We just put together our user quest hook.
Now we're going to use it inside of our sign up component.
Before we do in the last video I realized I made a little mistake.
So back over inside of our used request took file I have once again made use of the await keyword without
marketing enclosing function as a sink.
So I'm gonna throw in that keyword very quickly right away.
Let's go back over to sign up tobacco over here.
I'm gonna delete where we get this errors piece of state and I'm going to replace it with a call to
this user request took.
So when we call user requests we're gonna get back an object that remember has the do request function
and the heirs property.
This will come from user request and inside this object we're gonna pass off to use request.
We are going to provide a U or L a method and the body so our your l is going to be API users sign up
the method will be post and the body in this case is gonna be our email and our password.
So now we've got a function that we can call to actually execute the request and we have possibly some
errors right here.
So now down inside of on submit we don't have to write out all this logic right here we already essentially
put all this stuff together inside that hook.
All we have to do is call do request that's it.
And then to show any errors that might have occurred during the request we want to show this errors
thing down inside where we had previously had all this complicated logic stuck directly inside of here.
We can replace it with just simply errors.
We do not have to check and see if errors is defined or anything like that because by default it will
be equal to no.
So let's don't say this I'm gonna flip back over and do a quick test
so I'm going to first put in some invalid input here though invalid email invalid password and attempt
to sign up look at that it still works.
Now if I put in a valid email and a valid password let's say test.
Or how about just some gibberish I'll sign up and you'll notice that the request was made successfully
if you have opened your network request log there is a little bug right now if we submit requests and
it is valid or Sammy is invalid and then we make another request that is valid we don't clear out the
air that we had previously set there so we could take care of that very easily by going back over the
hook back inside of user request we'll say that the instant that someone is trying to make a follow
up request let's just go ahead and reset our heirs piece of state so right before making the request
I'll do a set ears with no.
So now if I attempt to submit right away I get an error but if I put in a valid email address and develop
password it goes away and I signed up successfully.
Perfect so again this little hope that we put together of your request is just a little time saving
thing.
It's good to make it a little bit easier on some other components are going to eventually put together
to very easily make a request consume some data out of it and so on.
Well that is pretty much it for our sign up component.
We just all have to do one or two quick things.
For example we need to make sure that after signing up successfully we redirect the user over to that
index page and say something like you are signed in.
So it's still a little bit left but for the most part this component is now complete.
So quick pause right here and we'll continue in just a moment.