qualiteer/src/ctx/StoreContext.jsx

import React, { useReducer, createContext, useMemo } from "react";
import { jobStatus } from "./JobContext.jsx";

const StoreContext = createContext();

const ACTIONS = {
  UPDATE: "u",
};

const failingMock = new Array(10).fill(0).map((v, i) => ({
  class: `SomeTestClass${i % 2 ? i - 1 : i / 2}`,
  name: `TestThatDoesOneThing${i + 1}`,
  timestamp: `2022-05-10T16:${2 + i}:33.810Z`,
  silencedUntil: i % 4 ? null : `2022-05-10T16:${2 + i}:33.810Z`,
  frequency: "1hour",
  type: i % 3 ? "api" : "ui",
  dailyFails: i + 1,
  screenshot: "https://example.com",
  recentResults: [1, 0, 0, 1, 0],
  isCompound: i % 5 ? false : true,
  failedMessage: `Some Test FailureMessage ${i}`,
  jobStatus: (() => {
    switch (i) {
      case 1:
        return jobStatus.OK;
      case 3:
        return jobStatus.ERROR;
      case 4:
        return jobStatus.PENDING;
      case 5:
        return jobStatus.ACTIVE;
      case 6:
        return jobStatus.CANCELED;
      case 8:
        return jobStatus.QUEUED;
      default:
        return null;
    }
  })(),
}));

const initialState = {
  intervals: [],
  catalog: [],
  failing: failngMock,
  regions: [],
  catalogSearch: "",
  focusJob: false,
  simplifiedControls: false,
  defaultRegion: "us", // Local Store
  defaultPage: "failing", // Local Store
};

const reducer = (state, action) => {
  const { store } = action;
  // Actions
  switch (action.type) {
    case ACTIONS.UPDATE:
      return { ...state, ...store };
    default:
      return state;
  }
};

export const StoreProvider = ({ children }) => {
  const [state, dispatch] = useReducer(reducer, initialState);

  const context = {
    state,
    dispatch,
    updateStore: (store) => dispatch({ type: ACTIONS.UPDATE, store }),
  };
  const contextValue = useMemo(() => context, [state, dispatch]);

  return (
    <StoreContext.Provider value={contextValue}>
      {children}
    </StoreContext.Provider>
  );
};

export default StoreContext;