import { PropsWithChildren, createContext, useContext, useMemo } from 'react';

/** Value for {@link MenuItemContext} */
export interface MenuItemContextValue {
  /** Is menu item active */
  active: boolean;
}

const MenuItemContext = createContext<MenuItemContextValue | undefined>(undefined);

/** Provider that provides data for current {@link MenuItem } */
export function MenuItemContextProvider({ active, children }: PropsWithChildren<MenuItemContextValue>) {
  const value: MenuItemContextValue = useMemo(() => ({ active }), [active]);

  return <MenuItemContext.Provider value={value}>{children}</MenuItemContext.Provider>;
}

/** Returns data for current {@link MenuItem } */
export function useMenuItemContext(): MenuItemContextValue {
  const value = useContext(MenuItemContext);
  if (!value) {
    throw new Error('useMenuItemContext should be used only inside MenuItemContextProvider');
  }

  return value;
}