In this episode, we work on displaying and managing the list of notification email addresses right on our dashboard. We start by dropping in some ready-made markup (feel free to grab it from the course resources!) that sets up a list view for the emails, each with its own "delete" button.
First up, we pass the notification emails from our main site data down to our Email Notifications component as a prop. With that set up, we use a simple loop to render all emails in the list, making sure it only shows if emails exist. Each item is uniquely keyed by the email address itself.
After verifying they display properly—and watching Inertia handle instant updates as we add new emails—it's time to tackle deletions. We make a new route and controller to handle deleting a given email, then update our frontend so clicking the delete button triggers a DELETE request using Inertia. The email to delete gets passed along in the query string, and we preserve the scroll position for a slick UX.
Once we've tested that deletion works and emails disappear as expected, we add some finishing touches: proper authorization, validation, and using Laravel's array_diff
function to update our list efficiently. By the end of the episode, you can add and remove emails from your dashboard, all without a single page refresh—and it just feels super smooth!