A hook to listen to Redux actions in your component.

ActionReducer.js

const initialState = {
  type: null,
  payload: null,
  meta: null,
  error: false
};

export default (state = initialState, action) => {
  return {
    ...state,
    ...action
  };
};

example.js

useReduxAction({ payload, error } => {
    // Do something here
}, MY_REDUX_ACTION, []);

store.js

const reducers = combineReducers({
  ...
  action: ActionReducer
});

useReduxAction.js

/*
* It's important to also use a action reducer
* which keeps track of the latest action for
* this to work.
*/

import { useRef, useEffect } from "react";
import { useStore } from "react-redux";
import _castArray from "lodash.castarray";

/**
 * Subscribes to redux store events
 *
 * @param effect
 * @param type
 * @param deps
 */
export function useReduxAction(effect, type, deps = []) {
  const currentValue = useRef(null);
  const store = useStore();

  const handleChange = () => {
    const state = store.getState();
    const action = state.action;
    let previousValue = currentValue.current;
    currentValue.current = action.type;

    if (
      previousValue !== action.type &&
      _castArray(type).includes(action.type)
    ) {
      effect(action);
    }
  };

  useEffect(() => {
    const unsubscribe = store.subscribe(handleChange);
    return () => unsubscribe();
  }, deps);
}

@PilotLeon checkout the package: https://github.com/aspect-apps/use-redux-effect