We've now got two possible scenes for our application which means we need to figure out a way to navigate
our users between them in the context of our app.
We probably want a user to progress from the log in form over to the employee list screen only after
they successfully log into our application.
So I have a question for you where in our app do we know that a user just logged in successfully.
Like where inside of our codebase.
I think that would be the action creator inside of our action creator.
So heres actions index.
Yes if we go on down to log in user and find the log in users success function.
This is where we know that a user has successfully logged into our application.
So in other words right here is where we want to somehow forcibly navigate the user from the log and
form seen on over to the employee list.
So that just means that we need to figure out how to navigate the user.
Fortunately this is one of the best features of re-act native router flux besides the ridiculous name
of course.
So to navigate a user to a different screen in our application we are first going to import a helper
function at the top of this file.
So going to go to the top and I'm going to import actions from re-act native router flux and do take
note.
We've got the curly braces on here make sure you get those then back down at the bottom of this file
at the log user success function immediately after dispatching this action right here.
We are going to make a function call from something on that actions object.
So we are going to call actions dot employee list like so.
So this employee list method right here.
Where did this come from.
Easy.
Back inside the router.
So let's go back over to the router file.
Recall that we had created a scene and added a key to it of employee list.
Any key is that we add to our scenes are instantly transcribed onto that actions object that we just
saw.
So any time that we want to navigate between one scene and another we can call actions Daut and then
the scene name and that will automatically navigate us over.
So let's test this out in the simulator now in the simulator.
I'm going to refresh.
Then we'll log in with a valid log in record.
So I'll use my test at test dot com info.
And now when I hit log in this Should successfully log us to the application and then navigate us over
to the employee list screen.
So a click log in and then we get navigated automatically on over.
Now when we do so you'll notice that there is a blue back button up here which doesn't really make a
lot of sense because once again this should really be something more like hey log out or something like
that.
But I do want to point out that it really is a great feature of re-act me and router flux to automatically
take care of this button for us.
So even though for these two particular screens it doesn't make the most sense in the world to build
a freely go back and forth between them too usually.
It definitely makes sense or it is really nice that re-act need a router flux automatically set us up
set that up for us.
So navigating between screens pretty straightforward.
All we need to do is import that actions object so actions from re-act native Retter flux and then to
navigate to a particular scene we call actions dot and then the key from the scene that we want to visit.
Cool.
So let's take a break here and continue on into the next section.