A store from context and a reducer in React
React interview exercise on Context & reducers, difficulty 3 of 3. Solve it in the editor beside a worked example, or cold in Interview mode with the example hidden; the tests run the moment you do.
Build a todos store: TodosProvider holds { id, title, done }[] with a reducer (add with a title, toggle by id, remove by id; ids count up from 1) and exposes useTodos() and useTodosDispatch(). AddTodo renders an <input> that dispatches add on Enter and clears; TodoItems renders <li> per todo with the class "done", a checkbox to toggle and a <button className="remove">; TodosApp composes them inside the provider.
Each exercise pairs a worked example with a twin problem to solve in a real editor; the tests run the moment you do. Interview mode hides the example: solve it from memory, without the hint or the solution, and it counts as solved cold. Progress is saved in your browser, and in your account if you sign in.