title: Redux State not Updating the first time
body: <p>I know there are a lot of same questions posted in this site but none of them links to my issue. <a href="https://stackoverflow.com/questions/39544713/why-my-redux-state-not-updating">This</a> is close to mine but I am not working with DB yet. Just a complete <code>react/redux</code> implementation. </p>
  
  <p>I am implementing redux in my sample project for <code>reactstrap</code> <code>modal</code> and confuses me because one of my reducers not updating the state the first time. Consider my redux setup.</p>
  
  <p><strong>Action</strong></p>
  
  <pre><code>export const showModal = (data) =&gt; {
     return {
      type: MODAL_TOOL,
      payload: data
    };
  }
  </code></pre>
  
  <p><strong>Reducer</strong></p>
  
  <pre><code> const initialState = {
       isOpen: false
   };
   export default function(state=initialState, action) {
      switch(action.type) {
          case MODAL_TOOL:
              console.log(action.payload.isOpen); //logs true
              return {
                   ...state, 
                   isOpen: action.payload.isOpen
              }
          default: 
               return state;
     }
  }
  </code></pre>
  
  <p><strong>Combine Reducer</strong></p>
  
  <pre><code>export default combineReducers({
      modal: modalReducer
  });
  </code></pre>
  
  <p><strong>Component</strong></p>
  
  <pre><code>class TaskModel extends Component {
     state = {
         isOpen: this.props.modal.isOpen
     }
     onCreateTask = () =&gt; {
          this.props.showModal({
              isOpen: !this.props.modal.isOpen
          });
  
          this.setState({
              isOpen: this.props.modal.isOpen
          }); 
     }
     render() { 
         return(
            &lt;Button
                 size="sm"
                 color="dark"
                 style={{marginBottom: '2rem'}}
                 onClick={this.onCreateTask}
             &gt;
                  Add Task
             &lt;/Button&gt;
         )
     }       
  }
  const mapStateToProps = (state) =&gt; ({
       modal: state.modal
  });
  
  export default connect(mapStateToProps, { showModal })(TaskModel);
  </code></pre>
  
  <p>When I click the button <code>Add Task</code> the first time, it will not update the state even the log from reducer showing true. It works the 2nd time and update the <code>redux</code> <code>state</code>. My CRUD for the tasks is working fine with the same <code>redux</code> setup. Did I misunderstand something?</p>