title: Redux - state updated in reducer but not updating the new values to component
body: <p>While updating the state in redux combined with React app, the state is updated in the reducer. But in the container, I'm still getting the old state.</p>
  
  <p>Below is the reducer.</p>
  
  <pre><code>import * as constants from '../actions/constants';
  
  export function caseTypes(state=[], action) {
    switch(action.type) {
      case constants.LOAD_CASE_TYPES_SUCCESS:
        return action.caseTypes
      default:
        return state;
    }
  }
  
  export function cases(state=[], action) {
    switch (action.type) {
      case constants.LOAD_CASES_SUCCESS:
          const newState = Object.assign({}, state, {cases:action.cases})
          alert('newstate' + newState.cases)
          return newState;
      default:
          return state;
    }
  }
  </code></pre>
  
  <p>If I keep an alert inside the reducer "cases", I'm getting new values updated to the state. But in the component below, I'm still getting old state inside 
  mapStateToProps function. Action is dispatched from the CaseSearchConnectComponent and mapStateToProps inside CaseSearchConnectComponent is also giving the old value.</p>
  
  <pre><code>class casePage extends React.Component {
    render() {
      return(
        &lt;div&gt;
          &lt;div height="100px"&gt;
            &lt;CaseSearchConnectComponent/&gt;
          &lt;/div&gt;
          {this.props.loadCaseList &amp;&amp; 
            &lt;div&gt;
              &lt;CaseListConnectComponent cases={this.props.cases}/&gt;
            &lt;/div&gt;
          }
        &lt;/div&gt;
      )
    }
  }
  
  function mapStateToProps(state) {
    alert("case page cases  " + state.cases)
    return {
      cases:state.cases 
    };
  }
  
  const CasePageConnectComponent = connect(mapStateToProps)(casePage);
  export default CasePageConnectComponent;
  </code></pre>