title: Why reducer is not being activated after dispatch()
body: <p>When I submit my SignIn Form <code>validateAndSignInUser</code> is called and this dispatch <code>signInUser</code> that sends to backend an email and password to get a session token. That works right.
  After <code>signInUser</code> returns values <code>signInUserSuccess</code> is dispatched, and I verified this works. 
  But after that the UserReducer is not beign activated and I don't understand why. What is wrong?</p>
  
  <p>I have this action in my <code>SignInFormContainer.js</code>:</p>
  
  <pre><code>import { reduxForm } from 'redux-form';
  import SignInForm from '../components/SignInForm';
  import { signInUser, signInUserSuccess, signInUserFailure } from '../actions/UsersActions';
  
  const validateAndSignInUser = (values, dispatch) =&gt; {
      return new Promise ((resolve, reject) =&gt; {
          let response = dispatch(signInUser(values));
          response.payload.then((payload) =&gt;  {
              // if any one of these exist, then there is a field error 
              if(payload.status != 200) {
                  // let other components know of error by updating the redux` state
                  dispatch(signInUserFailure(payload));
                  reject(payload.data); // this is for redux-form itself
              } else {
                  // store JWT Token to browser session storage 
                  // If you use localStorage instead of sessionStorage, then this w/ persisted across tabs and new windows.
                  // sessionStorage = persisted only in current tab
                  sessionStorage.setItem('dhfUserToken', payload.data.token);
                  // let other components know that we got user and things are fine by updating the redux` state 
                  dispatch(signInUserSuccess(payload)); 
                  resolve(); // this is for redux-form itself
              }
          }).catch((payload) =&gt; {
              // let other components know of error by updating the redux` state
              sessionStorage.removeItem('dhfUserToken');
              dispatch(signInUserFailure(payload));
              reject(payload.data); // this is for redux-form itself
          });
      });
  }
  
  const mapDispatchToProps = (dispatch) =&gt; {
      return {
          signInUser: validateAndSignInUser /*,
          resetMe: () =&gt; {
              // sign up is not reused, so we dont need to resetUserFields
              // in our case, it will remove authenticated users
              // dispatch(resetUserFields());
          }*/
      }
  }
  
  function mapStateToProps(state, ownProps) {
      return { 
          user: state.user
      };
  }
  
  // connect: first argument is mapStateToProps, 2nd is mapDispatchToProps
  // reduxForm: 1st is form config, 2nd is mapStateToProps, 3rd is mapDispatchToProps
  export default reduxForm({
      form: 'SignInForm', 
      fields: ['email', 'password'], 
      null,
      null,
      validate 
  }, mapStateToProps, mapDispatchToProps)(SignInForm);
  </code></pre>
  
  <p>This three actions in <code>UserActions.js</code></p>
  
  <pre><code>import axios from 'axios';
  
  //sign in user
  export const SIGNIN_USER = 'SIGNIN_USER';
  export const SIGNIN_USER_SUCCESS = 'SIGNIN_USER_SUCCESS';
  export const SIGNIN_USER_FAILURE = 'SIGNIN_USER_FAILURE';
  
  export function signInUser(formValues) {
      const request = axios.post('/login', formValues);
      return {
          type: SIGNIN_USER,
          payload: request
      };
  }
  
  export function signInUserSuccess(user) {
      console.log('signInUserSuccess()');
      console.log(user);
      return {
          type: SIGNIN_USER_SUCCESS,
          payload: user
      }
  }
  
  export function signInUserFailure(error) {
      console.log('signInUserFailure()');
      console.log(error);
      return {
          type: SIGNIN_USER_FAILURE,
          payload: error
      }
  }
  </code></pre>
  
  <p>And this is my reducer <code>UserReducer.js</code></p>
  
  <pre><code>import {
      SIGNIN_USER, SIGNIN_USER_SUCCESS,  SIGNIN_USER_FAILURE,
  } from '../actions/UsersActions';
  
  const INITIAL_STATE = {user: null, status:null, error:null, loading: false};
  
  export default function(state = INITIAL_STATE, action) {
    let error;    
    switch(action.type) {    
      case SIGNIN_USER:// sign in user,  set loading = true and status = signin
          return { ...state, user: null, status:'signin', error:null, loading: true}; 
      case SIGNIN_USER_SUCCESS://return authenticated user,  make loading = false and status = authenticated
          return { ...state, user: action.payload.data.user, status:'authenticated', error:null, loading: false}; //&lt;-- authenticated
      case SIGNIN_USER_FAILURE:// return error and make loading = false
          error = action.payload.data || {message: action.payload.message};//2nd one is network or server down errors      
          return { ...state, user: null, status:'signin', error:error, loading: false};
  
      default:
          return state;
    }
  }
  </code></pre>
  
  <p>Reducers combined:</p>
  
  <pre><code>import { combineReducers } from 'redux';
  import { UserReducer } from './UserReducer';
  import { reducer as formReducer } from 'redux-form';
  
  const rootReducer = combineReducers({
      user: UserReducer,
      form: formReducer  // &lt;-- redux-form
  });
  
  export default rootReducer;
  </code></pre>
  
  <p><code>configureStore.js</code></p>
  
  <pre><code>import {createStore, applyMiddleware, combineReducers, compose} from 'redux';
  import thunkMiddleware from 'redux-thunk';
  import {devTools, persistState} from 'redux-devtools';
  import rootReducer from '../reducers/index';
  
  let createStoreWithMiddleware;
  
  // Configure the dev tools when in DEV mode
  if (__DEV__) {
    createStoreWithMiddleware = compose(
      applyMiddleware(thunkMiddleware),
      devTools(),
      persistState(window.location.href.match(/[?&amp;]debug_session=([^&amp;]+)\b/))
    )(createStore);
  } else {
    createStoreWithMiddleware = applyMiddleware(thunkMiddleware)(createStore);
  }
  
  export default function configureStore(initialState) {
    return createStoreWithMiddleware(rootReducer, initialState);
  }
  </code></pre>
  
  <p><code>index.js</code>:</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import {Provider} from 'react-redux';
  import { Router, browserHistory } from 'react-router';
  import routes from './routes';
  import configureStore from './store/configureStore';
  import {renderDevTools} from './utils/devTools';
  
  const store = configureStore();
  
  ReactDOM.render(
        &lt;div&gt;
          {/* &lt;Home /&gt; is your app entry point */}
          &lt;Provider store={store}&gt;
            &lt;Router history={browserHistory} routes={routes} /&gt;
          &lt;/Provider&gt;
  
          {/* only renders when running in DEV mode */
            renderDevTools(store)
          }
        &lt;/div&gt;
      , document.getElementById('main'));
  </code></pre>