title: Updating an object within array in react redux reducer getting map() is not a function
body: <p>I have a fairly complex/nested redux store like this:</p>
  
  <pre><code>{
    object1
    {
      array:
      [
        object[1]: {
          id: 1,
          replace: ""
        }
        object[2]: {
          id: 2
          replace: ""
        }
        object[3]: {
          id: 3,
          replace: ""
        }
      ]
    }
  }
  </code></pre>
  
  <p>After dispatching an action, I need to insert the action to one of the object[] based on ID. I am currently using the following scripts to update <strong>replace</strong> within the reducer. However this will change the array to an object due to the curly bracket of <strong>object2: {}</strong>.</p>
  
  <pre><code>case UPDATE:
    return {
      ...state,
      object1: {
        ...state.object1,
        array: {
          ...state.object1.array,
          [action.id]: {
            ...state.object1.array[action.id],
            replace: action.result
          }
        }
      }
    };
  </code></pre>
  
  <p>My render will breaks after that since object2.map is no longer a function after changing to object. How do I workaround this without converting it to an object?</p>
  
  <p>The following will failed with syntax error:</p>
  
  <pre><code>case UPDATE:
    return {
      ...state,
      object1: {
        ...state.object1,
        array: [
          ...state.object1.array,
          [action.id]: {
            ...state.object1.array[action.id],
            replace: action.result
          }
        ]
      }
    };
  </code></pre>