title: Private Route in react redux firebase not working
body: <p>I been trying to integrate the react-redux-firebase with my react app. Everything is working except for the protected routes</p>
  <p>I copied the code for private route from react-react-firebase.</p>
  <p>This is the code for my private route</p>
  <pre><code>import React from &quot;react&quot;;
  import { Route, Redirect } from &quot;react-router-dom&quot;;
  import { useSelector } from &quot;react-redux&quot;;
  import { isLoaded, isEmpty } from &quot;react-redux-firebase&quot;;
  
  // A wrapper for &lt;Route&gt; that redirects to the login
  // screen if you're not yet authenticated or if auth is not
  // yet loaded
  function PrivateRoute({ children, ...rest }) {
    // FIXME: #27 Imp This is not working for some reason, you can still access the not accessible locations
    const auth = useSelector((state) =&gt; state.firebase.auth);
    console.log(auth);
    console.log(&quot;Empty?&quot;);
    console.log(isEmpty(auth));
    console.log(&quot;Load?&quot;);
    console.log(isLoaded(auth));
    return (
      &lt;Route
        {...rest}
        render={({ location }) =&gt;
          // FIXME: Here it even if it is false it is rendering the children for some reason
          isLoaded(auth) &amp;&amp; !isEmpty(auth) ? (
            // auth.uid==undefined ? ( // Even this does not work
            children
          ) : (
            &lt;Redirect
              to={{
                pathname: &quot;/redirect/login&quot;,
                state: { from: location },
              }}
            /&gt;
          )
        }
      /&gt;
    );
  }
  
  export default PrivateRoute;
  </code></pre>
  <p>Even when the isEmpty is false, it is returning the children.</p>
  <p>This is my reducer code.</p>
  <pre><code>import { combineReducers } from &quot;redux&quot;;
  import { firebaseReducer } from &quot;react-redux-firebase&quot;;
  
  export default combineReducers({
    firebase: firebaseReducer,
  
    // authReducer,
    // apiStatusReducer,
  });
  </code></pre>
  <p>I been trying to solve it for the past 1 week and would love any help or hints on why it isn't working. Thanks for the help.</p>
  <p>Edit:-</p>
  <p>For some weird reason, even exchanging  the children and redirect positions is also working.</p>
  <pre><code>&lt;Route
        {...rest}
        render={({ location }) =&gt;
          // FIXME: Here it even if it is false it is rendering the children for some reason
          isLoaded(auth) &amp;&amp; isEmpty(auth) ? (
            // auth.uid==undefined ? ( // Even this does not work
            &lt;Redirect
              to={{
                pathname: &quot;/redirect/login&quot;,
                state: { from: location },
              }}
            /&gt;
          ) : (
            children
          )
        }
      /&gt;
  </code></pre>