In this episode, we're building out the feature that lets you click on an employee and view all the services they can perform. Here's how we do it:
First, we set up a new Livewire component called EmployeeShow
. We also register a new route for showing individual employees, cleanly using route model binding with their slugs for nicer URLs.
Next, we hook this new route up to our links on the homepage—so now, when you click on an employee, it takes you to that employee's dedicated page. Inside the new component, we reuse some of our existing structure to list out the services, adjust the heading, and make sure we're showing the employee's name at the top.
We make sure the component accepts the correct employee (with all their services) via route model binding. Once that's set, clicking on any employee displays a list of only the services they offer, perfectly tailored per employee—and everything's hooked up so that if you click further, you go through to checkout just like before.
Nice and tidy! This is a great foundational piece for making the site more user-friendly and dynamic.