"use client";

import { useState, useEffect } from "react";

interface MenuState {
  isMobileMenuOpen: boolean;
  isSearchOpen: boolean;
}

interface UseMenuStateReturn {
  isMobileMenuOpen: boolean;
  isSearchOpen: boolean;
  toggleMobileMenu: () => void;
  toggleSearch: () => void;
}

let globalState: MenuState = {
  isMobileMenuOpen: false,
  isSearchOpen: false,
};

const listeners: Set<() => void> = new Set();

const notifyListeners = () => {
  listeners.forEach(listener => listener());
};

export const useMenuState = (): UseMenuStateReturn => {
  const [state, setState] = useState<MenuState>(globalState);

  useEffect(() => {
    const updateState = () => {
      setState({ ...globalState });
    };

    listeners.add(updateState);
    return () => {
      listeners.delete(updateState);
    };
  }, []);

  const toggleMobileMenu = () => {
    globalState = {
      ...globalState,
      isMobileMenuOpen: !globalState.isMobileMenuOpen,
    };
    notifyListeners();
  };

  const toggleSearch = () => {
    globalState = {
      ...globalState,
      isSearchOpen: !globalState.isSearchOpen,
    };
    notifyListeners();
  };

  return {
    isMobileMenuOpen: state.isMobileMenuOpen,
    isSearchOpen: state.isSearchOpen,
    toggleMobileMenu,
    toggleSearch,
  };
};