title: Why is useReducer hook not updating state?
body: <p>I am working on login/register components in React, and I'm using useContext and useReducer hooks to manage state. This is the first time I've tried it this way, and I'm not sure why the state is not changing. Below are the files for the login component. I've shown where I've console logged and what the results are.</p>
  <p>This is the api:</p>
  <pre><code>export const login = ({ email, password }) =&gt; {
  
    console.log(email, password); 
    // jennifer@jennifer.com 12345678
  
    return fetch(`${DEV_AUTH_URL}/signin`, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        email,
        password,
      }),
    })
      .then((res) =&gt; {
        return res.ok
          ? res.json()
          : res.json().then(err =&gt; PromiseRejectionEvent.reject(err));
      })
      .then(data =&gt; data);
  };
  </code></pre>
  <p>This is the state manager:</p>
  <pre><code>const AuthState = (props) =&gt; {
    const initialState = {
      token: null,
      isAuth: false,
      errorMsg: null,
      user: {},
    };
  
    const [state, dispatch] = useReducer(AuthReducer, initialState);
    const history = useHistory();
  
    const handleLogin = (formData) =&gt; {
      login(formData)
        .then((res) =&gt; {
  
          console.log(res); 
          // {token: &quot;eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7I…zk3fQ.Qx9zDeXBecToIEScCTDXzkBiTnATHab4cnyg0aSMdLE&quot;}
  
  
          res &amp;&amp; res.token
            ? dispatch({ type: LOGIN_SUCCESS, payload: res })
            : dispatch({ type: LOGIN_FAIL, payload: res });
        })
        .then(() =&gt; {
          closeAllPopups();
  
          console.log('jwt: ', localStorage.getItem('jwt'));
          // {token: &quot;eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7I…zk3fQ.Qx9zDeXBecToIEScCTDXzkBiTnATHab4cnyg0aSMdLE&quot;}
  
          console.log('token: ', state.token);
          // token:  null
          console.log('isAuth: ', state.isAuth);
          // isAuth: false
  
          history.push('/');
        })
        .catch((err) =&gt; dispatch({ type: LOGIN_FAIL, payload: err.toString() }));
    };
  </code></pre>
  <p>This is what is in the reducer:</p>
  <pre><code>import {
    LOGIN_SUCCESS,
    LOGIN_FAIL,
  } from '../types';
  
  export default (state, action) =&gt; {
    switch (action.type) {
      case LOGIN_SUCCESS:
        localStorage.setItem('jwt', action.payload.token);
        return {
          ...state,
          token: action.payload.token, // this is not changing state
          isAuth: true, // this is also not changing state
        };
      case LOGIN_FAIL:
        return {
          ...state,
          token: null,
          user: {},
          isAuth: false,
          errorMsg: action.payload,
        };
      default:
        return state;
    }
  };
  </code></pre>