title: Why doesn't the redux state update?
body: <p>Everything Seems Fine to me, the Console logs work in the Action and in the Reducer but the Chrome Redux tools  show no action being  trigged and no state updates.</p>
  <p>Here is my Component Class</p>
  <pre><code>import React, { Component } from 'react'
  import { connect } from 'react-redux'
  import { SimpleGrid,Box,Select,Input,InputGroup,InputRightAddon,Text,Heading ,Button,NumberInput,NumberInputField,} from &quot;@chakra-ui/core&quot;;
  import { Footer } from '../../layout/Main/components';
  import {submitUserInput} from '../../utils/actions/userInput'
  import PropTypes from 'prop-types';
  
   class UserInput extends Component {
      
      constructor(props) {
          super(props);
          this.handleSubmit = this.handleSubmit.bind(this)
          this.state = {
              yieldStress:0,
              thickness:0,
              diameter:0,
              pMAX:0
          }
          this.handleChange = this.handleChange.bind(this)
      }
      handleSubmit=(event)=&gt;{
          event.preventDefault();
          console.log(this.state);
          this.props.submitUserInput(this.state);
      }
  
      handleChange=(event)=&gt;{
          this.setState({[event.target.name]:event.target.value});
      }
  
      render(){
          const materialsList = this.props.materials.map((material)=&gt;(
          &lt;option value={material.yieldStress} key={material.id}&gt;{material.name}&lt;/option&gt;
          ));
  
      return (
          &lt;Box&gt;
          &lt;Heading as=&quot;h4&quot; size=&quot;md&quot;&gt;Cylinder Details&lt;/Heading&gt;
      &lt;Text&gt;{this.props.thickness}&lt;/Text&gt;
          &lt;form onSubmit={this.handleSubmit} &gt;
              &lt;Select placeholder=&quot;Select Material of Cylinder&quot; isRequired name=&quot;yieldStress&quot; onChange={this.handleChange}&gt;
                      {materialsList}
              &lt;/Select&gt;
              &lt;SimpleGrid columns={2} spacing={8} padding=&quot;16px 0px&quot;&gt;
                  &lt;Box&gt;
                      &lt;InputGroup&gt;
                          &lt;InputRightAddon children=&quot;(mm)&quot;/&gt;
                          &lt;Input type=&quot;number&quot; placeholder=&quot;Thickness of Cylinder&quot;  roundedRight=&quot;0&quot; isRequired name=&quot;thickness&quot; onChange={this.handleChange}/&gt;
                      &lt;/InputGroup&gt;
                  &lt;/Box&gt;
                  &lt;Box&gt;
                      &lt;InputGroup&gt;
                          &lt;InputRightAddon children=&quot;(mm)&quot;/&gt; 
                          &lt;Input type=&quot;number&quot; placeholder=&quot;Diameter of Cylinder&quot; roundedRight=&quot;0&quot; isRequired name=&quot;diameter&quot;onChange={this.handleChange}/&gt;
                      &lt;/InputGroup&gt;
                  &lt;/Box&gt;
              &lt;/SimpleGrid&gt;
              &lt;SimpleGrid columns={2} spacing={8} padding=&quot;0px 0px&quot;&gt;
                  &lt;Box&gt;
                      &lt;InputGroup&gt;
                          &lt;InputRightAddon children={&lt;Text paddingTop=&quot;12px&quot;&gt;(N/mm)&lt;sup&gt;2&lt;/sup&gt;&lt;/Text&gt;} padding=&quot;0 4px&quot;/&gt;
                          
                          &lt;NumberInput precision={2} step={0.2}  &gt;
                              &lt;NumberInputField  placeholder=&quot;Maximum pressure &quot;  roundedRight=&quot;0&quot; isRequired name=&quot;pMAX&quot; onChange={this.handleChange}/&gt;
                          &lt;/NumberInput&gt;
                      &lt;/InputGroup&gt;
                  &lt;/Box&gt;
                  &lt;Box&gt;
                      &lt;InputGroup&gt;
                          &lt;InputRightAddon children=&quot;(mm)&quot;/&gt; 
                          &lt;Input type=&quot;number&quot; placeholder=&quot;Factor of Saftey&quot; roundedRight=&quot;0&quot; isRequired name=&quot;FOS&quot;onChange={this.handleChange}/&gt;
                      &lt;/InputGroup&gt;
                  &lt;/Box&gt;
              &lt;/SimpleGrid&gt;
              &lt;Box padding=&quot;8px 0&quot; &gt;
              &lt;Button variantColor=&quot;teal&quot; float=&quot;right&quot; border=&quot;0&quot;  type=&quot;submit&quot;&gt;Submit&lt;/Button&gt;
              &lt;/Box&gt;
          &lt;/form&gt;
          &lt;Footer /&gt;
      &lt;/Box&gt;
    
      )
  }
   }
  
  UserInput.protoTypes = {
      submitUserInput: PropTypes.func.isRequired,
      thickness: PropTypes.string.isRequired,
   }
  const mapStateToProps = (state) =&gt; ({
      thickness: state.userInput.thickness
  })
  
  const mapDispatchToProps = dispatch =&gt; {
      return {
      submitUserInput: (userInput)=&gt; dispatch(submitUserInput(userInput))
  }}
  
  export default connect(mapStateToProps, mapDispatchToProps)(UserInput)
  </code></pre>
  <p>Here is My Action File</p>
  <pre><code>import { SUBMIT_REQUEST_SENT,SUBMIT_SUCCESS,SUBMIT_FAILURE} from '../types'
  export const submitUserInput = ({yieldStress, FOS, diameter,pMAX,thickness }) =&gt; async (dispatch) =&gt; {
      dispatch(submitRequestSent());
      try {
          console.log(&quot;Printing object in action&quot;)
          console.log({yieldStress, FOS, diameter,pMAX,thickness }) //This is Printed 
          dispatch({
              type: SUBMIT_SUCCESS,
              payload:{yieldStress, FOS, diameter,pMAX,thickness } 
          }
          );
      }
      catch (error) {
          dispatch({
              type: SUBMIT_FAILURE,
              payload: error.message
          })
          throw error;
      }
  
  }
  
  export const submitRequestSent = () =&gt;
  ({
      type: SUBMIT_REQUEST_SENT,
  })
  
  </code></pre>
  <p>And Here is the UserInput Reducer</p>
  <pre><code>import {
  SUBMIT_REQUEST_SENT,SUBMIT_SUCCESS,SUBMIT_FAILURE
  } from '../../actions/types'
  
  const initialState = {
          userInput:{
              yieldStress:0,
              FOS:0,
              diameter:0,
              pMAX:0,
              thickness:0 
          }
      }
  
  export default function (state = initialState, action) {
      switch (action.type) {
          case SUBMIT_REQUEST_SENT:
              return {
                  ...state,
              }
          case SUBMIT_SUCCESS:
              console.log(&quot;Submit has been sucessfull And below is the Payload&quot;); //This is Printed
              console.log(action.payload)//This is Printed
              return {
                  ...state,
                  userInput:action.payload
              }
              
          case SUBMIT_FAILURE:
              return {
                  ...state,
                  error: action.payload
              }
          default:
              return state;
      }
  
  }
  </code></pre>
  <p>And my root Reducer</p>
  <pre><code>import {combineReducers} from 'redux';
  import  authReducer from '../authReducer'
  import userInputReducer from '../userInputReducer';
  
  export default  combineReducers(
      {
          auth:authReducer,
          userInput:userInputReducer
      }
  )
  </code></pre>
  <p>I will Appreciate any applicable solution/Explanation..thanks</p>