Replace array item with another one without mutating state : <p>This is how example of my state looks:</p>

<pre><code>const INITIAL_STATE = {
 contents: [ {}, {}, {}, etc.. ],
 meta: {}
}
</code></pre>

<p>I need to be able and somehow replace an item inside contents array knowing its index, I have tried:</p>

<pre><code>      return {
        ...state,
        contents: [
          ...state.contents[action.meta.index],
          {
            content_type: 7,
            content_body: {
              album_artwork_url: action.payload.data.album.images[1].url,
              preview_url: action.payload.data.preview_url,
              title: action.payload.data.name,
              subtitle: action.payload.data.artists[0].name,
              spotify_link: action.payload.data.external_urls.spotify
            }
          }
        ]
      }
</code></pre>

<p>where <code>action.meta.index</code> is index of array item I want to replace with another contents object, but I believe this just replaces whole array to this one object I'm passing. I also thought of using <code>.splice()</code> but that would just mutate the array?</p>
