How to reset React Navigation to initial default state (the state that the app opens)?

Question

I'm trying to reset the navigation state to default state (whatever is when the app is first opened without any actions) upon user logout.

How do I achieve that?

I've seen Reset stack after navigate to login screen yet it still specifies a route and I don't know what to put there. I've tried providing undefined yet got an error.

How can I make React Navigation to just purge everything and act as if the app opened? I'm looking for something like StackActions.reset({}) (pseudocode, doesn't work) that is empty, and trigger whatever React Navigation does on app start.

Answer 1

You can use conditional routes, as suggested in the documents for authentication flow

like below

isSignedIn ? (
  <>
    <Stack.Screen name="Home" component={HomeScreen} />
    <Stack.Screen name="Profile" component={ProfileScreen} />
    <Stack.Screen name="Settings" component={SettingsScreen} />
  </>
) : (
  <>
    <Stack.Screen name="SignIn" component={SignInScreen} />
    <Stack.Screen name="SignUp" component={SignUpScreen} />
  </>
);

And the isSignedIn can be handled by Context Api or redux