title: Immutable JS: Set value of map inside map
body: <p>I have Immutable like this</p>
  
  <pre><code>Immutable.Map({
      name: action.data.name,
      avatarUrl: action.data.up,
      profileUrl: action.data.upl,
      id: action.data.uid,
      role: Immutable.fromJS(action.data.r),
      color: Immutable.Map({
        initial: '#00FF00',
      })
  });
  </code></pre>
  
  <p>All I want is to check if a value corresponding to a key exists inside <code>color map</code>, then change it. If it does not exist then add a new key inside <code>color map</code> with the new value like this:</p>
  
  <pre><code>Immutable.Map({
      name: action.data.name,
      avatarUrl: action.data.up,
      profileUrl: action.data.upl,
      id: action.data.uid,
      role: Immutable.fromJS(action.data.r),
      color: Immutable.Map({
        initial: '#00FF00',
        c-0: '#000000',
        7: '#0000FF'
      })
  });
  </code></pre>
  
  <p>What I tried is this, but it aint working and adds keys anywhere.</p>
  
  <pre><code>return state.setIn(state.getIn('color', action.thread_id), action.code);
  </code></pre>
  
  <p>thread_id is the key like 'c-0' or '7' and code contains the value to be added or updated against the key</p>
  
  <p><strong>Update 1</strong>
  When adding keys like 'c-0' and 'c-1', and '7' and '8', it adds inside the map like</p>
  
  <pre><code>Immutable.Map({
      name: action.data.name,
      avatarUrl: action.data.up,
      profileUrl: action.data.upl,
      id: action.data.uid,
      role: Immutable.fromJS(action.data.r),
      c: Immutable.Map({
        -: Immutable.Map({
          0: '#00F0F0',
          1: '#0000F0',
        })
      })
      7: '#FFFF00',
      8: '#00FFFF',
      color: Immutable.Map({
        initial: '#00FF00'
      })
  });
  </code></pre>