title: Using Redux for making protected routes with React-Navigation (v.3 or v.4)
body: <p>How can we use redux to create protected routes in react-navigation? </p>
  
  <p>Consider I have a redux store containing following state </p>
  
  <pre><code>const mapStateToProps = state =&gt; {
    return {
      isAuthenticated: state.profileInfo.isAuthenticated,
      isLoaded: state.profileInfo.isLoaded,
      googleProfileLoading: state.profileInfo.googleProfileLoading
    }
  };
  </code></pre>
  
  <p>And I am using React-navigation to navigate user. </p>
  
  <pre><code>const loginNavigation = createStackNavigator(
    {
      login: {
        screen: Login
      },
      signup: {
        screen: Signup
      }
    },
    {
      headerMode: "none"
    }
  )
  
  const allRoutes = createSwitchNavigator(
    {
      home: {
        screen: loginNavigation
      },
      user: {
        screen: user
  
    },
    {
      initialRouteName: "home"
    }
  );
  
  const App = createAppContainer(allRoutes);
  </code></pre>
  
  <p>Now if user is not logged in, I want redirect to login screen. </p>
  
  <p>In simple react-redux, this is what I usually used to do: <a href="https://github.com/irohitb/SelfieApp/blob/master/client/src/routes.js" rel="nofollow noreferrer">https://github.com/irohitb/SelfieApp/blob/master/client/src/routes.js</a></p>
  
  <p>Can someone help me in figuring out how can we create protected routes in react-native, redux and react-navigation </p>