feat(SW-187): simplify dropdown menu

components/Header/MainMenu/MyPagesMobileMenu/index.tsx

@@ -14,6 +14,7 @@ import MyPagesMenuContent from "../MyPagesMenuContent"
 
 import styles from "./myPagesMobileMenu.module.css"
 
+import { DropdownType } from "@/types/components/dropdown/dropdown"
 import type { MyPagesMenuProps } from "@/types/components/header/myPagesMenu"
 
 export default function MyPagesMobileMenu({
@@ -22,12 +23,13 @@ export default function MyPagesMobileMenu({
   user,
 }: MyPagesMenuProps) {
   const intl = useIntl()
-  const { toggleMyPagesMobileMenu, isMyPagesMobileMenuOpen } =
-    useDropdownStore()
+  const { openDropdown, toggleDropdown } = useDropdownStore()
+  const isMyPagesMobileMenuOpen =
+    openDropdown === DropdownType.MyPagesMobileMenu
 
   useHandleKeyUp((event: KeyboardEvent) => {
     if (event.key === "Escape" && isMyPagesMobileMenuOpen) {
-      toggleMyPagesMobileMenu()
+      toggleDropdown(DropdownType.MyPagesMobileMenu)
     }
   })
 
@@ -35,7 +37,7 @@ export default function MyPagesMobileMenu({
     <div className={styles.myPagesMobileMenu}>
       <MainMenuButton
         className={styles.button}
-        onClick={toggleMyPagesMobileMenu}
+        onClick={() => toggleDropdown(DropdownType.MyPagesMobileMenu)}
         aria-label={intl.formatMessage({ id: "Open my pages menu" })}
       >
         <Avatar initials={getInitials(user.firstName, user.lastName)} />
@@ -49,7 +51,9 @@ export default function MyPagesMobileMenu({
             membership={membership}
             navigation={navigation}
             user={user}
-            toggleOpenStateFn={toggleMyPagesMobileMenu}
+            toggleOpenStateFn={() =>
+              toggleDropdown(DropdownType.MyPagesMobileMenu)
+            }
           />
         </Dialog>
       </Modal>