And before we set up the logout functionality in the dashboard layout page, let's also quickly recall
the request we're going to be working with.
So the URL is going to be forward slash auth, forward slash logout.
It's going to be a get request, so we're not going to send anything to the server.
And if we're successful, not only we're going to get the success message, but also there's going to
be no more cookie in the browser since server is going to clear it.
And while we're still working in the dashboard layout page, we might as well also set up the logout
user because we already have the endpoint in place and pretty much this is the most important thing.
So let's navigate to a logout user.
It's going to be async.
And for starters, let's see how we can navigate programmatically to a different page using use, navigate,
hook.
So for starters, let's go up.
We want to import, use, navigate so this is not used navigation.
Please don't mix the two.
So this is use navigate and this is going to be alternative to redirect over here.
And also we want to grab the toast.
And you know what?
I think I'll rely on auto import.
So what do I want to do when we click on logout button?
Well, for starters, we want to navigate to a different page back to a landing page.
Correct.
So in here I want to invoke my use, navigate hook, and I want to set it equal to some kind of variable.
So I'm going to go here with use, navigate, and just like with redirect, basically we just want to
run it and pass it where we want to navigate.
So when we click on Logout User, I want to navigate back to the home page, back to the landing page.
That's why I'm going to go here with Navigate and then forward Slash.
Also, we want to go with Await and make a request.
To a logout route.
Remember, that clears out the cookies.
So you will just go here with custom fetch.
It's a get request.
What is the URL?
It's auth and then logout.
And lastly, let's just display a toast.
So I'm just going to go here with toast, then success and we'll just say logging out, let's save it.
Let's navigate here and notice now I'm logged in as Peter.
Let me click on Logout right away.
Notice in the application how we don't have any cookies.
We don't have the JWT with the info about our user.
And of course, if I want to log in as John, I'm just going to go back over here, log in, and everything
is correct.
So now again, I have my token, I have the JWT and I'm actually logged in as John.
Let me try it one more time with Anna.
Just so you don't think I'm messing with you.
Let's go over here.
Let's submit.
And now notice, of course, now I have a different user.
And with this in place, we can start working on add job functionality.