In this episode, we're working on automatically setting an employee for a service during the checkout process. If a customer lands on the checkout page without an employee already selected, we need to pick one as soon as they choose a time slot.
We start by figuring out how to watch the date/time field of our form, so that any changes trigger logic to choose and set an available employee. We first experiment with manually setting the employee using a method, but decide it's more future-proof to use a watcher, so it'll react to changes no matter where they're triggered from.
We then make a request to our route, passing in the necessary service and employee information. We notice that with each request, we were losing the state of the chosen time. To fix this, we add an option to preserve the existing state so the checkout experience feels seamless.
Next, we write logic to pick the next available employee based on the time slot the customer chose. We tweak our backend/API to provide the necessary slug
info (instead of just the ID) so it's easy to use in URLs and requests.
After a few more tweaks and tests—including setting an employee as unavailable to check that the "next in line" gets picked—we confirm that our checkout now correctly and automatically assigns the right employee whenever a slot is chosen, no matter who’s available!
That's it for now—we’ll hook up the customer details form in the next episode, but at this point, our employee selection logic is working just the way we want.