Update a nested value immutably

Updating nested state immutably by hand produces a pyramid of spread operators, and getting it wrong either mutates state or copies everything, defeating the reference checks that React.memo and useMemo rely on.

Implement updateIn(source, path, updater). path is an array of segments: strings are object keys, numbers are array indices. Walk to the end of the path, call updater with the value found there, and return a new structure in which that position holds the returned value. Copy only the containers along the path: any branch you did not walk into keeps its original reference, so result.untouched === source.untouched. Arrays stay arrays and objects stay objects. If a segment along the path is missing, create the container the *next* segment needs — an array when that segment is a number, a plain object otherwise — and call updater with undefined at the end. An empty path means the whole value: return updater(source). The input is never modified.

updateIn({ a: { b: { c: 1 } } }, ["a", "b", "c"], (n) => n + 1);
// { a: { b: { c: 2 } } }

updateIn({ list: [1, 2, 3] }, ["list", 1], (n) => n * 10);
// { list: [1, 20, 3] } — number segments keep the array an array

updateIn({}, ["xs", 0], () => "first");
// { xs: ["first"] } — missing containers are created based on the next segment