import { createContext } from "@applicaster/zapp-react-native-utils/reactUtils/createContext";
import React from "react";

const initialContext = { toggleMenu: {}, closeMenu: {}, openMenu: {} };

// Value is not checked, it can be anything as long as it is _either_:
// - A new reference
// - A different value
// Failing to pass a new reference or a different valu will fail to trigger the context change.
// Example of valid changes:
// - `setToggleMenu(toggleMenu + 1)` // different value
// - `setToggleMenu({})`             // new reference
// - `setToggleMenu({foo: "bar"})`   // looks like the same value, but is actually a new reference
const stateValidator = ({ property }) =>
  property === "toggleMenu" ||
  property === "closeMenu" ||
  property === "openMenu";

export const MenuToggleContext = createContext(initialContext, stateValidator);

export type MenuToggleContextType = {
  toggleMenu: any;
  setToggleMenu: () => void;
  openMenu: any;
  setOpenMenu: () => void;
  closeMenu: any;
  setCloseMenu: () => void;
};

export const useMenuToggleContext = () => {
  return React.useContext<MenuToggleContextType>(
    MenuToggleContext.ReactContext
  );
};