All right.
And before we switch over to a server and start setting it up everything in there, I want to also add
clear alert functionality.
And technically, this is optional, but it is my preference that we also hide alert in certain time
because at the moment our functionality is falling, where if we try to submit and one of the values
is empty, then basically we'll get the alert and it will stay here unless we navigate away from the
page or unless we set up some functionality once we successfully log in or is there, for example,
eventually we'll display there, created user successfully or log in successful and stuff along those
lines.
So technically it is optional, but it's definitely my preference to also clear the alert.
I will do that first.
We'll start working in the actions, so we'll create our clear alert action.
Then we will set up the imports again.
This is pretty much given every time you set up an action, you need to set up those imports in the
reducer as well as context.
And then when it comes to a reducer.
I want to set up clear alert one.
So action type is equal to clearer alert online as far as logic stores are in the state, and I want
to set the alert back to false and then both the alert type as well as the alert text.
I want to set it empty, so I want them to be empty and light when it comes to context.
Remember, we have display alert function.
Correct.
And what are we doing over there?
Well, we're dispatching display alert for what we can also do is set up clear alert function and dispatch
clear alert.
But the difference is going to be that we will do that in three seconds.
So we will set up the timeout timeout.
In my case, is going to be in three seconds, but of course you can set up whatever time you want and
learn in those 30 seconds.
We will dispatch clear alert and back in display alert right after I dispatch display alert.
I'm actually going to call myself clear.
As a result, what is going to happen every time we display an alert in three seconds, we hide it.
So let's start working on that one, going to copy and paste and as a sign of the rest of the actions
that are going to be exactly the same as far as the name of the variable and the value, I just want
the different.
We're the first one.
Certain here.
Let me just select everything the lead.
Same is going to be with the value.
And then let's just add to cursors and learn our name.
And that is going to be clear, underscore and alert.
Let's save it when we want to go to a producer and learn the fastest way is going to be company based.
So let me just select everything.
The action that we're looking for is clear alert and in my case, I already went ahead and imported.
And then we want to set it up in our if condition.
So clear alert.
And if that is the case, then Charlotte will be false.
Like I said, man, when it comes to alert type as well as this one, the alert text basically want
to send back to your empty values.
And then lastly, remember, we have app context, correct?
So let's navigate here.
First, we want to get the clear alert one one right after the display alert.
Let's first set up the function.
So clear alert.
I'm I to start with concern, so clear alert function and then set of the function body.
This is where we have our set time up.
So before we do anything right after dispatch, let's call clear alert in the display alert one and
then here.
When we want to do is go set time timeout and in whatever time we will dispatch, the clear alert got,
in my case, that is going to be in 30 seconds.
So let's go here, let's say dispatch and then remember we need to pass in the time that was very,
very important.
And then what is the type?
Well, that is we alert.
Let's save it.
And now it's noticed the functionality.
Think I'm going to have to refresh this time so I can do this here?
And then if I'll try to submit and one value is empty.
Check it out.
I still have the alert, but then in three seconds is going to disappear.
So that's how we can set up clear alert functionality.