We've now got a pretty long time without running any code.
So I think we should try to be line actually testing this thing inside of our simulator.
The first thing we need to do is recognize that inside of our DOT then right here this is where we actually
want to be able to dispatch an action and say hey users now just signed in please do something with
this information.
So rather than cancel logging out the user which we're not actually doing just yet I'm going to dispatch
an action.
So inside of here I'm going to manually dispatch an action.
So I'm going to call dispatch and pass it in action.
I mean that's really what we're doing here.
So when you have a type.
I'm just going to hardcoded it for right now we'll fix it up in just a second.
Logon users success with the payload of the user that was just fetched.
So remember the van is called with a user model.
I'm going to pass it through as the payload property.
Now the whole key here the reason this whole thing works out is that we are not actually calling dispatch
until the request is complete after the quest is complete.
We create our action and we manually pass it off to dispatch the action right here.
As you see it right here it might look you know us a line might look very dissimilar from any of the
other action cars we've we've seen.
But trust me behind the scenes whenever you return an action as we do right here it is getting passed
him to dispatch in the exactly same fashion.
The only difference is that we are manually dispatching ourselves.
All right.
So I think we're just about ready to do a test.
You actually get this thing running inside the simulator.
The first thing I want to do is flip over to my author reducer and I'm going to add in a console log
of action inside of here.
Let's just see every action that comes across and say does this thing actually work or not.
You know how is this thing going then.
The only last thing we have to do is if you recall we don't actually have any sign of functionality
inside of our application right now like we're not we have not yet implemented that try to sign the
user in and then create an account for them if it doesn't exist.
To make sure we actually have an account to test with we can flip over to our authentication console
and firebase.
So on the left hand side of him is click on off and then on the right hand side there's an add user
buttons so we can use this to manually add a user to our project and we can do that to create a test
account for us essentially.
So if the top on the right hand side or click to user and I'm going to make a test user with a e-mail
of test at test come and a password of password go looks good.
So that's my test user to run with.
And the very last thing I need to do is I have an action creator called log and user I need to make
sure that this actually gets called Somewhere in my application.
So we have not yet wired this up to our logon form so let's flip over a log and form.
We're going to import the log in user and hook it up to that button at the bottom.
So first we will import the log in user action action creator excuse me and then at the bottom we will
add it to the connect call.
So here's log in user and this is getting pretty long right here.
I'm going to do some new lines as well.
I think that looks pretty reasonable right there.
So I am giving it the actual creators of email change password change and log in user.
All right.
Last thing to do is find our button and make sure that whenever user presses this thing we actually
call it or call our action creator.
So I'll say on press this dot on button press find this.
And inside of this helper method that we're going to define in just a second is where we will call that
action creator.
So I'll scroll up a little bit and I'll add in the helper method on button press.
All right.
So now we're going to take the e-mail and password from our prop's object.
Again doing a little bit of 60 structuring here and then I'll call this Doug prop's thought logged in
user with the email in the password.
Remember that we set up the method signature to log in user to expect an object with the email and password
properties.
So we need to make sure we pass in an object that has both email and password properties on it.
All right.
Finally finally at long last I think we're ready for a test here.
I think we're ready for a test.
So let's open up our Riak native debugger.
Here it is.
I've already got mine open here.
Member If you are on iOS you can open yours up by pressing command D and then hit start remote.
J.S. debugging if you are an android on Windows you can hit command or excuse me control in and then
hit the same button.
OK.
So I think we're about ready here.
I need to do a refresh to make sure we get all the legacy code.
You can see that we need to immediately get some console logs of actions that are flowing into that
author douceur.
Now here's the fun part.
I'm going to select the email field and I'll hit test at test dot com.
And very interestingly in the background you can see that I'm getting in the action in the reducer for
every character that I add to email field.
So that's the email changed action in action.
Gazi and say no at enter and password and there is all my password changed actions.
And then finally log in and hot.
After a brief pause I see an action of type log in user success with a payload of W and half way it's
beyond this and look at w..
I know there's a lot of really weird properties on here.
Don't sweat it.
What really matters is that we have an email of test at test dot com and a new ID which is the ID for
this very particular user.
So this is the user model right here.
This is the thing that describes the currently logged in user.
So that's it.
Everything works.
Now to take a brief pause and I want to say yes I know that everything we just went through especially
wiring up the action creator is really tedious.
Like how are you going to ever remember every last step in here.
You know worry I guarantee you you get used to all this little you know tiny little details like dispatch
and types and payloads.
You really get used to it over time.
So just the more practice you get the more you're going to internalize all this stuff and you're going
to do fantastic.
So let's do one last quick review of how this works because redux thunk is a little bit of a brain bender.
By using redux thunk we expand the range of values that we can return from an action of creator so we
can now return a function from an action Creator.
This function as we see it right here will automatically be called for us by redux thunk and the first
argument to it is going to be the dispatch method.
So dispatch right here is a method and allows us to manually send an action off to all of the reducers
in our application by using this we can do what ever async action we want in.
Only after that async action like say you know logging use user in is complete.
We can then manually dispatch an action with whatever whatever action we can possibly imagine.
So this really is a backdoor into redux.
It gives us a ton of control and power over what is going on inside of our application.
All right.
So this is great good progress.
We're definitely signing our users in now.
But now we still need to make sure that we're doing all the extra stuff in our application like you
know showing a spinner here.
We need to be able to stop it.
We need to create new accounts for users who don't have one.
Cetera all that good stuff.
Let's start working on that in the next section.