A initial state object
A reducer function. Reducers let you consolidate a component’s state update logic.
A context provider initialised with state and dispatch function created using useReducer hook
A function exporting useContext
We have two sibling components that need to toggle the same boolean flag. How would you set up a reducer and a context to share that flag between them?
If you forget to wrap a component tree with the context provider and call useContext inside a child, what will happen at runtime?
You’re adding a multi‑step form where each step lives in its own component and needs to read and update the same form state. Walk me through how you’d structure the reducer actions and context to make that work.
During development you notice that dispatching an action from a nested component causes the entire component tree to re‑render repeatedly. What could be causing that, and how would you fix it?
In a large codebase you have several feature modules, each with its own reducer. How would you combine them while keeping context boundaries as small as possible? Discuss the trade‑offs of a single global context versus multiple scoped contexts.
A context provider is causing performance issues because unrelated state changes trigger re‑renders of many consumers. What strategies can you use to mitigate this without abandoning the reducer‑context pattern?
Your organization wants to migrate from Redux to a useReducer + Context solution across many services. What architectural considerations, testing strategy, and rollout plan would you propose to ensure a smooth transition?
Multiple teams need to share some global configuration but also maintain independent feature‑specific state. How would you design a scalable hierarchy of contexts and reducers to support this while avoiding tight coupling?