import { create } from "zustand"

interface DropdownState {
  isHamburgerMenuOpen: boolean
  isMyPagesMobileMenuOpen: boolean
  toggleHamburgerMenu: () => void
  toggleMyPagesMobileMenu: () => void
}

const useDropdownStore = create<DropdownState>((set) => ({
  isHamburgerMenuOpen: false,
  isMyPagesMobileMenuOpen: false,
  toggleHamburgerMenu: () =>
    set((state) => {
      // Close the other dropdown if it's open
      if (!state.isHamburgerMenuOpen && state.isMyPagesMobileMenuOpen) {
        set({ isMyPagesMobileMenuOpen: false })
      }
      return { isHamburgerMenuOpen: !state.isHamburgerMenuOpen }
    }),
  toggleMyPagesMobileMenu: () =>
    set((state) => {
      // Close the other dropdown if it's open
      if (!state.isMyPagesMobileMenuOpen && state.isHamburgerMenuOpen) {
        set({ isHamburgerMenuOpen: false })
      }
      return { isMyPagesMobileMenuOpen: !state.isMyPagesMobileMenuOpen }
    }),
}))

export default useDropdownStore