feat(settings): don't navigate to submenu of non opened menu

app/components/Settings/BottomScreen/Menus/Menus.vue

@@ -134,6 +134,13 @@ const { select, selected, selectorPosition } = useButtonNavigation({
       left: "user",
     },
   },
+  canClickButton: (buttonName) => {
+    if (isSubMenu(buttonName)) {
+      const parent = getParentMenu(buttonName);
+      return settingsStore.currentMenu === parent && settingsStore.menuExpanded;
+    }
+    return true;
+  },
   disabled: computed(() => settingsStore.currentSubMenu !== null),
   selectorAnimation: {
     duration: 0.11,

app/composables/useButtonNavigation.ts

@@ -3,6 +3,7 @@ import gsap from "gsap";
 export const useButtonNavigation = <T extends Record<string, Rect>>({
   buttons,
   initialButton,
+  canClickButton,
   onButtonClick,
   navigation,
   disabled,
@@ -10,6 +11,7 @@ export const useButtonNavigation = <T extends Record<string, Rect>>({
 }: {
   buttons: T;
   initialButton: keyof T;
+  canClickButton?: (buttonName: keyof T) => boolean;
   onButtonClick?: (buttonName: keyof T) => void;
   navigation: Record<
     keyof T,
@@ -188,6 +190,8 @@ export const useButtonNavigation = <T extends Record<string, Rect>>({
     ][]) {
       const [sx, sy, sw, sh] = buttonRect;
       if (x >= sx && x <= sx + sw && y >= sy && y <= sy + sh) {
+        if (canClickButton && !canClickButton(buttonName)) continue;
+
         if (selectedButton.value === buttonName) {
           onButtonClick?.(buttonName);
         } else {