title: React/Redux Can't update initial state / undefined problem
body: <p>I am trying to update my state and getting it to render.</p>
  
  <p>Below I am calling my state from the reducer.js file and displaying the initial list fine.</p>
  
  <pre><code>&lt;div className={classes.resultborder}&gt;
                  {this.props.transInput.map(data =&gt; {
                      return (
                          &lt;Inputs
                              key={data.id}
                              xParty={data.xParty}
                              zParty={data.zParty}
                              yAction={data.yAction}
                              amount={data.amount}
                              deleteItem={() =&gt; this.deleteItem(data.id)}/&gt;
                      );
                  })}
              &lt;/div&gt;
  </code></pre>
  
  <p>At the bottom of my parent app, I have</p>
  
  <pre><code>const mapStateToProps = state =&gt; {
      return {
          transInput: state.transactionInputs
      };
  };
  
  const mapDispatchToProps = dispatch =&gt; {
      return {
          submitResults: () =&gt; dispatch({type: 'SUBMIT', x: {
              xParty: 'Henry',
              yAction: 'Funds',
              zParty: 'Elizbath'
          }})
      };
  };
  
  export default connect(mapStateToProps, mapDispatchToProps)(Transactions);
  </code></pre>
  
  <p>I have hard coded my <code>submitResults</code> because I have not yet been able to update my state and display, this is for simplicity.</p>
  
  <p>I am calling <code>submitResults</code> in a button</p>
  
  <pre><code>submitResults={this.props.submitResults}
  </code></pre>
  
  <p>Now below is my whole reducer</p>
  
  <pre><code>const initialReducer = {
  
      transactionInputs: [
          {id: 1, xParty: "statePaul", yAction: "Funds", zParty: "stateSandra", amount: 100},
          {id: 2, xParty: "stateEmily", yAction: "Loans", zParty: "stateJohn", amount: 200},
          {id: 3, xParty: "stateMatt", yAction: "Repays", zParty: "stateMicheal", amount: 300},
      ],
      emptyInputs: false,
      toggle: false
  };
  
  const reducer = (state = initialReducer, action) =&gt; {
  
      console.log(initialReducer.transactionInputs);
  
      if(action.type === 'SUBMIT'){
          return{
              ...state,
              xParty: state.xParty.concat(action.x)
          }
      }
      return state;
  };
  
  export default reducer;
  </code></pre>
  
  <p>When I press te button to run <code>submitResults</code> I get the following error message <code>TypeError: Cannot read property 'concat' of undefined</code></p>
  
  <p>I want to be able to update my initial state and have it displayed (currently I do believe if I can get the initial state to update then the display will re-render fine).</p>
  
  <p>I am not completely sure why this is not working but I do believe it's in my reducer.js file has something to dow ith how I'm returning my state.</p>
  
  <p>I apprentice any suggestions.</p>