Files
web/stores/main-menu.ts
2024-09-03 13:26:15 +02:00

104 lines
3.0 KiB
TypeScript

import { create } from "zustand"
// TODO: When MyPagesMobileMenu is removed, also remove the
// isMyPagesMobileMenuOpen state and toggleMyPagesMobileMenu function
interface DropdownState {
isHamburgerMenuOpen: boolean
isMyPagesMobileMenuOpen: boolean
isMyPagesMenuOpen: boolean
isLanguageSwitcherOpen: boolean
toggleHamburgerMenu: () => void
toggleMyPagesMobileMenu: () => void
toggleMyPagesMenu: () => void
toggleLanguageSwitcher: () => void
}
const useDropdownStore = create<DropdownState>((set) => ({
isHamburgerMenuOpen: false,
isMyPagesMobileMenuOpen: false,
isMyPagesMenuOpen: false,
isLanguageSwitcherOpen: false,
toggleHamburgerMenu: () =>
set(
({ isHamburgerMenuOpen, isMyPagesMenuOpen, isMyPagesMobileMenuOpen }) => {
// Close the other dropdowns if they're open
if (!isHamburgerMenuOpen) {
if (isMyPagesMenuOpen) {
set({ isMyPagesMenuOpen: false })
}
if (isMyPagesMobileMenuOpen) {
set({ isMyPagesMobileMenuOpen: false })
}
}
return { isHamburgerMenuOpen: !isHamburgerMenuOpen }
}
),
toggleMyPagesMobileMenu: () =>
set(
({
isMyPagesMenuOpen,
isMyPagesMobileMenuOpen,
isHamburgerMenuOpen,
isLanguageSwitcherOpen,
}) => {
// Close the other dropdowns if they're open
if (!isMyPagesMobileMenuOpen) {
if (isMyPagesMenuOpen) {
set({ isMyPagesMenuOpen: false })
}
if (isHamburgerMenuOpen) {
set({ isHamburgerMenuOpen: false })
}
if (isLanguageSwitcherOpen) {
set({ isLanguageSwitcherOpen: false })
}
}
return { isMyPagesMobileMenuOpen: !isMyPagesMobileMenuOpen }
}
),
toggleMyPagesMenu: () =>
set(
({
isHamburgerMenuOpen,
isLanguageSwitcherOpen,
isMyPagesMenuOpen,
isMyPagesMobileMenuOpen,
}) => {
// Close the other dropdowns if they're open
if (!isMyPagesMenuOpen) {
if (isHamburgerMenuOpen) {
set({ isHamburgerMenuOpen: false })
}
if (isMyPagesMobileMenuOpen) {
set({ isMyPagesMobileMenuOpen: false })
}
if (isLanguageSwitcherOpen) {
set({ isLanguageSwitcherOpen: false })
}
}
return { isMyPagesMenuOpen: !isMyPagesMenuOpen }
}
),
toggleLanguageSwitcher: () =>
set(
({
isLanguageSwitcherOpen,
isMyPagesMenuOpen,
isMyPagesMobileMenuOpen,
}) => {
// Close the other dropdowns if they're open
if (!isLanguageSwitcherOpen) {
if (isMyPagesMenuOpen) {
set({ isMyPagesMenuOpen: false })
}
if (isMyPagesMobileMenuOpen) {
set({ isMyPagesMobileMenuOpen: false })
}
}
return { isLanguageSwitcherOpen: !isLanguageSwitcherOpen }
}
),
}))
export default useDropdownStore