Loading homepage
Implement a React hook that manages a plain object with convenient methods for shallow merging, removing keys, clearing, and resetting. Operations must remain immutable and compose correctly when React batches updates.
The JavaScript and TypeScript variants share the same contract. Tests render real React components and exercise updates and lifecycle cleanup.
Input: useObject({ name: "Ada", age: 30 }); merge({ age: 31 }) Output: object is { name: "Ada", age: 31 }.
Input: remove("age") Output: object no longer has an own age property.
Input: merge(prev => ({ count: (prev.count || 0) + 1 })) twice in one event Output: Both updates apply in sequence.
Input: clear(); then reset() Output: Restores a fresh shallow copy of the original object.
Examples describe the current return value after the corresponding React render or event.