Refactoring to `useReducer`

Let’s modify our custom hook to use `useReducer` instead of `useState`.

Refactoring to useReducer

The most intuitive way to make the state reducer pattern work is using the useReducer hook to manage the internal state.

First, let’s refactor our custom hook to use useReducer instead of useState.

To refactor our custom hook to use the useReducer hook for state updates, everything within the custom hook stays the same except how the expanded state is managed.

Here’s what’s to be changed.

First, we’ll change the state from just a boolean value, true or false, to an object like this: {expanded: true || false}.

Get hands-on with 1200+ tech skills courses.