Extract a reducer when handlers multiply

A TaskApp component keeps tasks in state and has separate handlers for add, edit, delete, toggle, and reorder. Dispatch what happened; reduce to the next state in one function When every handler edits the same state shape directly, transition rules scatter and bugs hide in branches. Name user actions added, changed, deleted, reordered Reducer actions should describe what happened, not how to mutate the array. Move update logic Create tasksReducer(tasks, action) with a case for each action type. The reducer receives current state and action, then returns next state. Dispatch from handlers dispatch({ type: 'deleted', id }) Handlers become small…

Sign up free — one personalized lesson every day, matched to your role and goals.

Already have an account? Sign in