How to add a field in an object in a reducer?

Question

redux

The store has an array like this:

plans: [
  [ {id: 1},{id: 2},{id: 3} ],
  [ {id: 4},{id: 5},{id: 6} ],
  [ {id: 7},{id: 8},{id: 9} ],
]

The following arrives in the reducer:

case "TEST":
console.log(action.someID) // 3
console.log(action.value) // "SomeValue"
  return {
    ...state,
    plans: ???
  };

It is necessary to immutably return the plans array, but in the object with id equal to action.someID, add a new field called value which will be equal to action.value.

So in this case, the output should look like this:

plans: [
  [ {id: 1},{id: 2},{id: 3, value: "SomeValue"} ],
  [ {id: 4},{id: 5},{id: 6} ],
  [ {id: 7},{id: 8},{id: 9} ],
]

My brain exploded from nesting, please help me, I always have an array without a new field returned.

Answer 1

return {
  ...state,
  plans: state.plans.map(n => {
    const item = n.find(m => m.id === action.id);
    return item
      ? n.map(m => m === item ? { ...m, value: action.value } : m)
      : n;
  }),
};