title: React router <Redirect> is not redirecting on state
body: <p>The app should redirect to <code>/dashboard</code> when <code>user</code> is not <code>null</code>. User is <code>null</code> in the first render but <code>useEffect()</code> should pick up and store user data from local storage. Then, the ternary operator should trigger <code>&lt;Redirect to='/dashboard' /&gt;</code> and redirects to dashboard page. But, it's not doing that. It just keeps showing the login page at <code>/login</code> whenever I refresh even if there is data in localStorage.</p>
  <p>What am I doing wrong or how can I solve this?</p>
  <pre><code>const App = () =&gt; {
      const [user, setUser] = useState(null)
  
      useEffect(() =&gt; {
          const loggedUserJSON = window.localStorage.getItem('loggedUser')
  
          if (loggedUserJSON) {
              const user = JSON.parse(loggedUserJSON)
              setUser(user)
              noteService.setToken(user.token)
          }
      }, [])
  
      return (
          &lt;Router&gt;
              &lt;Switch&gt;
                  &lt;Route exact path='/'&gt;
                      {user
                          ? &lt;Redirect to='/dashboard' /&gt;
                          : &lt;Redirect to='/login' /&gt;
                      }
                  &lt;/Route&gt;
                  &lt;Route exact path='/login'&gt;
                      &lt;LogIn /&gt;
                  &lt;/Route&gt;
                  &lt;Route exact path='/dashboard'&gt;
                      &lt;Dashboard /&gt;
                  &lt;/Route&gt;
              &lt;/Switch&gt;
          &lt;/Router&gt;
      )
  
  </code></pre>