In this episode, we dive into allowing users to change their password from the security page. We start by setting up a dedicated change password form, keeping it separate from the two-factor authentication section for clarity. We copy over a bunch of existing styling and input components to speed up the process, and tweak them for the three required fields: current password, new password, and password confirmation.
Next, we dig into the backend route responsible for handling the password update. We double-check which controller and action are used (thank you, Laravel Fortify!) and confirm what validation is expected. Then, we hook up our form submission using Inertia's useForm
, making sure we're sending the right data to the correct route.
Once that's working, we notice that validation errors from Laravel pop up correctly, so we experiment with intentionally failing validations—like incorrect current passwords or mismatched confirmations—just to make sure they're working. After confirming successful password changes, we tweak the user experience to reset the form after a successful update and also add a nice toast message letting the user know their password was updated. Finally, we show you how to override the response in Fortify, so you can customize the feedback shown to users after a password change.
All in all, it's a solid walkthrough of creating a secure password change feature and making sure it feels good to use. Nothing too wild, but essential stuff for any app!