title: reducer not fired upon calling dispatch
body: <p>I am new to redux and I'm having trouble with setting it up. </p>
  
  <p>I am trying to dispatch an action whenever I click the login button. but the reducer does not get called. Using Thunk, I can see that my action DOES get dispatched. My terminal prints previous state, current action, and next state whenever I click the login button and I've successfully used console.log in LoginAction.js. </p>
  
  <p>That said, the emitted action does not seem to call my reducer to act. I tried console.log in my reducer, and it doesn't print anything. The current action displayed by Thunk is also displayed as empty and my initialState does not change</p>
  
  <p><strong>Login.js</strong></p>
  
  <pre><code>import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import { login } from './LoginAction';
  
  const mapDispatchToProps = (dispatch) =&gt; {
      return{
          login: () =&gt; {dispatch(login())},
      }
  };
  
  const mapStateToProps = (state) =&gt; {
      return{
          userInfo: state.userInfo
      }
  };
  
  const Login = connect(mapStateToProps, mapDispatchToProps)(
      class Login extends Component {
          onLogin() {
              this.props.login();
          }
  
          render() {
              return (
                  &lt;View&gt;
                      &lt;TouchableHighlight 
                          onPress={() =&gt; this.onLogin()}&gt;
                      &lt;/TouchableHighlight&gt;
                  &lt;/View&gt;
              );
          }
      }
  )
  </code></pre>
  
  <p><strong>LoginAction.js</strong></p>
  
  <pre><code>import { URL } from '../../core/api';
  import { fetchPost } from '../../core/util';
  
  export const LOGIN_REQUESTED = "LOGIN_REQUESTED";
  loginRequested = () =&gt; {
      console.log("in request");
      return {
          type: LOGIN_REQUESTED,
      };
  }
  
  
  export const LOGIN_RECEIVED = "LOGIN_RECEIVED";
  loginReceived = (loginAttemptResult) =&gt; {
      console.log("in receive");
      console.log(JSON.stringify(loginAttemptResult));
      return {
          type: LOGIN_RECEIVED,
          loginAttemptResult
      };
  }
  
  export function login() {
      let loginApi = URL + "/login";
      console.warn(loginApi)
  
      return (dispatch) =&gt; {
          dispatch(loginRequested());
          const formData = {
              email: 'xxx@gmail.com',
              id: '000000000000'
          }
          fetchPost(loginApi, formData)
              .then(loginAttemptResult =&gt; {
                  console.log(loginAttemptResult);
                  dispatch(loginReceived(loginAttemptResult));
              })
              .catch(console.log("fail :("));
      };
  }
  </code></pre>
  
  <p>In LoginAction.js, my console.log prints "in request", "in receive", and "fail :(". However, I've made sure that the HttpRequest/Fetch is successful by printing the content of the payload</p>
  
  <p><strong>LoginReducer.js</strong></p>
  
  <pre><code>import {LOGIN_REQUESTED, LOGIN_RECEIVED} from "./LoginAction";
  import {RESPONSE_STATUS} from "../../constants";
  import {userInfoState} from "../../core/initialState";
  
  export default function loginReducer(state = userInfoState, action) {
      switch (action.type) {
          case LOGIN_REQUESTED:{
              console.log("reducer 1");
              return Object.assign({}, state, {
                  isLoggingIn: true
              });
          }
          case LOGIN_RECEIVED: {
              console.log("reducer 2");
              const {status, message} = action.loginAttemptResult;
              const errorMsg = (status === RESPONSE_STATUS.ERROR) &amp;&amp; message;
              return Object.assign({}, state, {
                  isLoggingIn: false, errorMsg,
              });
          }
          default:
               console.log("default reducer");
               return state;
      }
  }
  </code></pre>
  
  <p>Nothing in LoginReducer.js got printed in my console</p>
  
  <p><strong>store.js</strong></p>
  
  <pre><code>import { AsyncStorage } from 'react-native';
  import { createStore, applyMiddleware, compose } from 'redux';
  import { persistStore, autoRehydrate } from 'redux-persist';
  import { REHYDRATE, persistCombineReducers } from 'redux-persist';
  import createActionBuffer from 'redux-action-buffer';
  import thunk from 'redux-thunk';
  import { createLogger } from 'redux-logger';
  import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2'
  
  import loginReducer from '../screens/Login/LoginReducer';
  
  let storage = AsyncStorage;
  
  const config = {
      key: 'root',
      storage,
      stateReconciler: autoMergeLevel2
  }
  
  export default function configureStore() {
  
      let reducer = persistCombineReducers(config, {
          userInfo: loginReducer,
      });
  
      const middleware = [thunk];
      middleware.push(createLogger());
  
      middleware.push(createActionBuffer(REHYDRATE));
      const store = createStore(
          reducer,
          undefined,
          compose(applyMiddleware(...middleware)),
      );
  
      persistStore(
          store,
          null,
      );
      return store;
  }
  </code></pre>
  
  <p>My suspicion is that I've got something wrong in my store.js, but I can't figure it out. </p>
  
  <p>This is my first question on the site and English is not my native language. If something is unclear and needed clarification, please ask</p>
  
  <p>Edit: This is the log from thunk</p>
  
  <pre><code>Login button clicked
  in request
  action LOGIN_REQUESTED 
  prev state Object {
      "userInfo": Object {...},
  }
  action Object {
      "type": "LOGIN_REQUESTED",
  }
  next state Object {
      "userInfo": Object {...},
  }
  fail :(
  Object {
      "data": Array [
              Object {
                  ...
              },
          ],
      "message": "success",
      "status": 1,
  }
  in receive
  action Object {
      "loginAttemptResult": Object {
          "data": Array [
              Object {...},
          ],
          "message": "success",
          "status": 1,
      },
      "type": "LOGIN_RECEIVED",
  }
  next state Object {
      "userInfo": Object {
      ...
      },
  }
  </code></pre>