title: Replace array item with another one without mutating state
body: <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>