Hi and welcome back.
Today we're going to be creating a new navigation system where we're going to be
controlling whether user is authenticated or not.
And according to that we're going
to choose which navigation system they should be accessing.
So what we can do is create another stack navigator here so we can say that the name
is authenticated and what we want to do is just copy this
here and take out all the pages that shouldn't be accessible
to the authenticated user and that should be login and registration.
So let's make the initial root name home
and the rest can stay the same and let's rename this from main navigation to non
authenticated and let's make both of these exportable.
So now that we have these, what we want to do is make sure that we
use non authenticated and authenticated flows accordingly.
And also for the non authenticated users we
don't want them to have access to the home and single donation item pages.
So let's make sure that we get rid of that from there.
And then what we want to do is create a root navigator in our navigation system.
So let's create a new file called root navigation JS.
It's going to import react from react
and then it is going to be named root navigation.
It's going to be a functional component
that is going to grab the user state using useselector state state
user and then it is going to return if user is logged in we're going to return
authenticated flow, otherwise we're going to return non authenticated flow so we can
state this and export default root navigation.
And then what we can do is go to our app
file and here instead of main navigation we're going to use root navigation.
So let's save this.
And now if we want to go back I'm trying
to slide, we are not going to be able to do that.
So that's great because if the user is already logged in their go
stack page definitely shouldn't be the login page.
But we're going to be working on how to log the user out in the next video.
So stay tuned and I'll see you in the next video.