How do I reset my state when logging out with multiple reducers

Question

How can I reset my state my I am having multiple reducers? I have seen various examples, How to reset the state of a Redux store?. as follows.

const appReducer = combineReducers({
  /* your app’s top-level reducers */
})

const rootReducer = (state, action) => {
  if (action.type === 'USER_LOGOUT') {
    state = undefined
  }

  return appReducer(state, action)
}

I am confused how to proceed. How can I reset the state with the following when I have

My rootReducer looks like this:

export interface IState {
  userReducer: IUserState;
  sessionReducer: ISessionState;
  authenticateReducer: IAuthenticateState;
  articlesReducer: IArticlesState;
}

export const reducers = combineReducers<IState>({
  userReducer,
  sessionReducer,
  authenticateReducer,
  articlesReducer  
});

Just to give you an example of the states, (I am providing for IUserState) only as the others have the same architecture when initialising.

export interface IUserState {
  user: IUserEntity;
  alert?: IAlertEntity;
  errors: IErrorsEntity;
}
export const initialState: IUserState = {
  errors: EmptyErrors(),
  alert: EmptyMessage(),
  user: EmptyUser()
};

How can I reset my states and what would be the best solution?

Answer 1

I use location.reload() on logout onClick