Create a redux reducer that automatically runs upon calling all other reducers

Eric P 0
Viewed 21

I have a createSnapshot reducer that will store snapshots of a portion of a slice as the state is being mutated. I have 30+ reducers for the slice. Rather than adding caseReducers.createSnapshot at the end of every reducer, is there a cleaner way to achieve this, like a middleware reducer?

redux-reducers react-redux redux
2 Answers

You can create a higher order reducer, that is a function taking a reducer as an argument and returning a new reducer, for instance (untested):

const withSnapshot = reducer => (state, action) => {
  // Call the original reducer
  const tmpState = reducer(state, action);
  // Create the snapshot
  const finalState = createSnapshot(tmpState);
  // Return the state
  return finalState;
}

and then in your configureStore you do something as follows:

  mySlice: withSnapshot(mySliceReducer),
Guillaume Brunerie0

.addMatcher allows listening to multiple reducers input

  extraReducers(builder) {
    builder
      .addMatcher(isAnyOf(reducer1, reducer2),(state,action)=>{
      // Do something
      })
  }
Eric P0
Related