import { createContext, useContext, useState, type ReactNode } from "react";
import SideMenu from "../components/SideMenu";

interface MenuState {
  open: () => void;
  close: () => void;
}

const Ctx = createContext<MenuState>({ open: () => {}, close: () => {} });

export function MenuProvider({ children }: { children: ReactNode }) {
  const [visible, setVisible] = useState(false);
  return (
    <Ctx.Provider value={{ open: () => setVisible(true), close: () => setVisible(false) }}>
      {children}
      <SideMenu visible={visible} onClose={() => setVisible(false)} />
    </Ctx.Provider>
  );
}

export const useMenu = () => useContext(Ctx);