title: Updating Object Property in Reducer without Mutation
body: <p>I feel like my reducer should be working, but it keeps insisting that I'm mutating the state.</p>
  
  <blockquote>
    <p>Uncaught Error: A state mutation was detected inside a dispatch, in the path: <code>output.outputList.0.composition</code>. Take a look at the reducer(s) handling the action {"type":"SET_OUTPUT_COMPOSITION",</p>
  </blockquote>
  
  <p>I posted something similar a couple hours ago with no answers, but I figured my redux state was too complicated.  This is my simplified version and I'm still getting mutate errors.. what am I doing wrong?  should I not be using a class in my redux state?  should i be using some sort of immutable library? please help me.</p>
  
  <p>My Initial Redux State</p>
  
  <pre><code>output: {
      outputList: [], //composed of Output class objects
      position: 0
    }
  </code></pre>
  
  <p>Output Class</p>
  
  <pre><code>class Output {
  
    constructor(output) {
        this.id = output.id;
        this.composition = output.getComposition();
        this.outputObj = output;
        this.name = output.name;
        this.url = output.getUrl();    
    }
  }
  
  export default Output;
  </code></pre>
  
  <p>Reducer for updating property</p>
  
  <pre><code>case types.SET_OUTPUT_COMPOSITION: {
        let outputListCopy = Object.assign([], [...state.outputList]);
        outputListCopy[state.position].composition = action.composition;
        return Object.assign({}, state, {outputList: outputListCopy});
  </code></pre>
  
  <p>Action</p>
  
  <pre><code>export function setOutputComposition(comp) {
   return { type: types.SET_OUTPUT_COMPOSITION, composition: comp}
  }
  </code></pre>