Learn React Hooks

Defining the app reducer

Finally, we need to combine our other reducers into a single reducer for our app state. Let's define the appReducer function now:

1. In the src/reducers.js file, define a new function for the appReducer:

export default function appReducer (state, action) {

2. In this function, we return an object with the values from the other reducers. We simply pass the sub-state and action down to the other reducers:

    return {        todos: todosReducer(state.todos, action),        filter: filterReducer(state.filter, action)    }}

Now, our reducers are grouped together. So, we only have one state object and one dispatch function.