Redux style store without Redux.

store.tsx

import React, { createContext, useReducer } from "react";
import { CheckType } from "./types";
import update from "immutability-helper";

interface Action {
  type: string;
  payload: any; // @TODO
}

interface State {
  selectedHealthCheck: CheckType;
  selectedHealthStatus: boolean;
  selectedHealthDetails: any; // @TODO
}

interface ProviderState {
  dispatch: any;
  state: Partial<State>;
}

const initialState = {
  selectedHealthCheck: undefined,
};

const store = createContext<Partial<ProviderState>>({
  state: initialState,
});

const { Provider } = store;

const StateProvider = ({ children }: any) => {
  const [state, dispatch] = useReducer(
    (state: Partial<State>, action: Action) => {
      switch (action.type) {
        case "select healthcheck":
          return update(state, {
            $set: {
              selectedHealthCheck: action.payload,
            },
          });
        case "fetched health":
          return update(state, {
            selectedHealthStatus: { $set: action.payload },
          });
        case "fetched details":
          return update(state, {
            selectedHealthDetails: { $set: action.payload },
          });
        default:
          throw new Error();
      }
    },
    initialState
  );
  return <Provider value={{ state, dispatch }}>{children}</Provider>;
};