This episode is for members only

Sign up to access "Build an Appointment Booking System With Livewire" right now.

Get started
Already a member? Sign in to continue
Playing
22. Making the employee optional

Episodes

0%
Your progress
  • Total: 3h 4m
  • Played: 0m
  • Remaining: 3h 4m
Join or sign in to track your progress

Transcript

00:00
To make the employee optional, we're
00:01
going to start with our web routes. And we're just going to add a question mark onto the end of the employee, which means it can be nullable within our routes.
00:08
Otherwise, it's always going to expect an employee. The next thing we want to do is head over to our checkout and make sure that this is also potentially a null value, because we might not have that in there.
00:19
And now we're going to go over to our home page, where we are going directly through to this service here. This is going to need an href now. So if we pass this href in as a route to the checkout,
00:32
remember that caused an error before, we can just pass through here the service. And we don't need the employee now, because it's optional within our web routes.
00:41
So if we head over now, we shouldn't see an error. And yeah, we do. So let's just check. And yeah, we just need to get rid of, well,
00:49
let's take service, not services. We were passing the entire object in. Now it's working. So we can click through normally onto the service
00:57
that we want for each of these employees. But now we can click directly through to here. And we just need to do a little bit of tidying up in our template, because of course, we
01:06
don't have an employee in there. So let's head over to our checkout. And we'll bring back this empty placeholder. And of course, what we want to do
01:14
is just wrap this in an if statement. So if we do have an employee available, we want to show their profile photo. So let's go and say if employee.
01:23
And otherwise, so let's just pull this into an else. We are just going to show the placeholder in there. Again, the same with the name as well. So we want to say employee name.
01:34
Or we'll just do a sort of shorthand in here and say any employee, because later on, as soon as we select a slot from here, that will pick up on the next available employee.
01:46
And it will update the employee that we have within this Livewire component. And then of course, it will re-render and show that employee in there.

Episode summary

In this episode, we're making the employee parameter optional throughout our booking flow. First, we update our web routes and add a question mark after employee to let Laravel know this route parameter doesn't have to be present. This change means we can visit the checkout page without always specifying an employee up front.

After updating the routes, we move on to the checkout logic, making sure it handles a null employee without any errors. Next, on the homepage, we tweak our link to the checkout so it doesn't need to pass an employee anymore—just the service when that's all we've got.

We do a quick test, fix a small bug where we were passing the wrong variable, and confirm that everything now works whether or not there’s an employee selected. Lastly, we tidy up our template: we show either a placeholder or the employee details depending on whether an employee is set, using simple if statements. Now, users can start their booking with just a service, and the app takes care of the rest as they go.

Episode discussion

No comments, yet. Be the first!