In this episode, we're adding the all-important logout feature to our app’s authentication system. The process is nice and straightforward: we need to make sure we can trigger a logout, hit the backend logout endpoint, and then update the app’s local state so the user is actually logged out.
We start by editing our useAuth
composable and adding a new logout
function. It's just a matter of exposing this function and deciding where in the UI we want to allow users to log out—usually somewhere in the navigation bar. We wire up a simple logout button, and connect it to our new logout
method so it does something useful when clicked.
Next, we handle the actual logout logic: making a POST request to the server’s logout endpoint with Fortify, resetting our authenticated state, and emptying the user data from local memory. We even briefly chat through simple error handling, to make sure we’ve got our bases covered if the logout request fails for any reason.
Finally, we give it a spin in the app, and confirm it works—users can now sign in, log out, and see their authentication state update instantly. Super simple, but it lays the groundwork for more advanced flows like redirecting after logout, which we'll cover in later sections!