Bringing back the central dispatcher from Flux, but this time with hooks

use-flux.js

import { useEffect, useReducer } from "react";

const dispatchers = new Map();

function centralDispatch(type, payload) {
  for (const dispatch of dispatchers.keys()) {
    dispatch({ type, payload });
  }
}

export function useFlux(reducer, initialState, initializer) {
  const [state, localDispatch] = useReducer(reducer, initialState, initializer);

  useEffect(() => {
    dispatchers.set(localDispatch, true);
    return () => dispatchers.delete(localDispatch);
  }, [localDispatch]);

  return state;
}

export function useDispatch() {
  return centralDispatch;
}