title: Changing state in Redux
body: <p>I am trying to add an element to an array in the <code>state</code> and change another array element's property. Say we have the following <code>state</code> structure:</p>
  
  <pre><code>{
    menuItems: [{
      href: '/',
      active: true
    }]
  }
  </code></pre>
  
  <p>After dispatching the <code>ADD_MENU_ITEM</code> action I want to end up with this <code>state</code>:</p>
  
  <pre><code>{
    menuItems: [{
      href: '/new',
      active: true
    }, {
      href: '/',
      active: false,
    }]
  }
  </code></pre>
  
  <p>I have tried managing this in Redux <a href="http://redux.js.org/docs/basics/Reducers.html" rel="noreferrer">reducers</a> in several fashions:</p>
  
  <pre><code>function reducer(state = {}, action) {
    switch (action.type) {
      case ADD_MENU_ITEM: {
        let menuItems = state.menuItems;
        let newMenuItem = action.newMenuItem; 
  
        // First try
        menuItems[0].active = false;
        menuItems.unshift(newMenuItem);
        state = Object.assign({}, state, { menuItems: menuItems });
  
        // Second try 
        menuItems[0].active = false;
        menuItems.unshift(newMenuItem);
        state = Object.assign({}, state, {menuItems: Object.assign([], menuItems)});
  
        // Third try 
        menuItems[0].active = false;
        state = (Object.assign({}, state, {
          menuItems: [
            Object.assign({}, newMenuItem), 
            ...menuItems
          ]
        }));
  
        // Fourth try
        menuItems[0].active = false;
        state = update(state, {
          menuItems: {$unshift: new Array(newMenuItem)}
        });
  
        console.log(state);
        return state;
      }
    }
  }
  </code></pre>
  
  <p>In the fourth try, I am using React's <a href="https://facebook.github.io/react/docs/update.html" rel="noreferrer">Immutability Helpers</a> but it never works. I logged the state to the console before returning the state and it logs correctly, but when logging inside the components which get re-<code>rendered</code>, the menuItems array does not add the first item, although the <code>active</code> member is set to <code>false</code>.</p>
  
  <p>What could I be doing wrong?</p>