Immutable JS - merge creates a list of map objects from array
<p>I am using redux and immutablejs, and I am trying to create a reducer function.</p>

<p>I have come across some behaviour I did not expect</p>

<pre><code>const a = new Immutable.Map({
  numbers: [{id: 1},{id: 2}]
});

const b = a.merge(
  {
    numbers: [{id: 4},{id: 5}]
  }
);
</code></pre>

<p>Here are the values of <code>a</code> and <code>b</code></p>

<pre><code>a.get("numbers");
[Object, Object]
b.get("numbers");
List {size: 2, _origin: 0, _capacity: 2, _level: 5, _root: null…}
b.get("numbers").get(0);
Map {size: 1, _root: ArrayMapNode, __ownerID: undefined, __hash: undefined, __altered: false} 
</code></pre>

<p>I did not expect <code>numbers</code> to be an immutable List of Map objects.</p>

<p>In my application, using redux, I set the initial state to:</p>

<pre><code>const initialState = new Immutable.Map({
  error: null,
  isBusy: false,
  films: []
});
</code></pre>

<p>I the reducer, when I fetch films I try to merge them as follows:</p>

<pre><code>return state.merge({
        isBusy: false,
        films: action.payload,
        error: null
      });
</code></pre>

<p>This causes issues in the react component, as <code>films</code> are initially an array of objects, and then they become an Immutable List of Maps.</p>

<p>Should I create a different initial state, or should I be using a different type of merge? Or something else?</p>

<p>Thanks </p>