Bladeren bron

Bugfix: Menu selected problems fixed.

lfabl 1 maand geleden
bovenliggende
commit
e6650d09d9

+ 26 - 18
src/components/embeddedMenu/components/menuButton/index.tsx

@@ -25,31 +25,39 @@ import {
 } from "lucide-react-native";
 import RowCard from "../../../rowCard";
 
-const isPageActive = ((buttonItem: EmbeddedMenuButtonType, navigation: NCoreUIKit.Navigation) => {
-    if (!navigation || typeof navigation.getState !== "function") {
-        return false;
-    }
+const getDeepActiveRouteName = (state: NCoreUIKit.NavigationState): string | undefined => {
+    if (!state?.routes?.length) return undefined;
 
-    const state = navigation.getState();
+    const activeIndex = state.index ?? 0;
+    const activeRoute = state.routes[activeIndex];
 
-    if (!state || !state.routes) return false;
+    if (!activeRoute) return undefined;
 
-    const activeIndex = state.index ?? 0;
-    const currentRoute = state?.routes?.[activeIndex];
+    if (activeRoute.state) {
+        return getDeepActiveRouteName(activeRoute.state);
+    }
+    return activeRoute.name;
+};
 
-    if(!currentRoute) return false;
+const isPageActive = (
+    buttonItem: EmbeddedMenuButtonType,
+    navigation: NCoreUIKit.Navigation
+): boolean => {
+    if (!navigation) return false;
 
-    if(currentRoute.state) {
-        const nestedIndex = currentRoute.state.index ?? 0;
-        const nestedRoute = currentRoute.state.routes?.[nestedIndex];
+    const state = typeof navigation.getRootState === "function"
+        ? navigation.getRootState()
+        : typeof navigation.getState === "function"
+            ? navigation.getState()
+            : null;
 
-        return nestedRoute?.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-    } else if(currentRoute.name) {
-        return currentRoute.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-    }
+    if (!state?.routes) return false;
 
-    return currentRoute.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-});
+    const targetName = buttonItem.redirectSub ?? buttonItem.redirectMain;
+    if (!targetName) return false;
+
+    return getDeepActiveRouteName(state) === targetName;
+};
 
 const EmbeddedMenuButton: FC<IEmbeddedMenuButton> = ({
     updateMenuButtonCollabs,

+ 26 - 18
src/components/menu/components/menuButton/index.tsx

@@ -25,31 +25,39 @@ import {
 } from "lucide-react-native";
 import RowCard from "../../../rowCard";
 
-const isPageActive = ((buttonItem: MenuButtonType, navigation: NCoreUIKit.Navigation) => {
-    if (!navigation || typeof navigation.getState !== "function") {
-        return false;
-    }
+const getDeepActiveRouteName = (state: NCoreUIKit.NavigationState): string | undefined => {
+    if (!state?.routes?.length) return undefined;
 
-    const state = navigation.getState();
+    const activeIndex = state.index ?? 0;
+    const activeRoute = state.routes[activeIndex];
 
-    if (!state || !state.routes) return false;
+    if (!activeRoute) return undefined;
 
-    const activeIndex = state.index ?? 0;
-    const currentRoute = state?.routes?.[activeIndex];
+    if (activeRoute.state) {
+        return getDeepActiveRouteName(activeRoute.state);
+    }
+    return activeRoute.name;
+};
 
-    if(!currentRoute) return false;
+const isPageActive = (
+    buttonItem: MenuButtonType,
+    navigation: NCoreUIKit.Navigation
+): boolean => {
+    if (!navigation) return false;
 
-    if(currentRoute.state) {
-        const nestedIndex = currentRoute.state.index ?? 0;
-        const nestedRoute = currentRoute.state.routes?.[nestedIndex];
+    const state = typeof navigation.getRootState === "function"
+        ? navigation.getRootState()
+        : typeof navigation.getState === "function"
+            ? navigation.getState()
+            : null;
 
-        return nestedRoute?.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-    } else if(currentRoute.name) {
-        return currentRoute.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-    }
+    if (!state?.routes) return false;
 
-    return currentRoute.name === (buttonItem.redirectSub ?? buttonItem.redirectMain);
-});
+    const targetName = buttonItem.redirectSub ?? buttonItem.redirectMain;
+    if (!targetName) return false;
+
+    return getDeepActiveRouteName(state) === targetName;
+};
 
 const MenuButton: FC<IMenuButton> = ({
     updateMenuButtonCollabs,

+ 14 - 15
src/types/index.ts

@@ -218,26 +218,25 @@ declare global {
         interface Translation extends GeneratedTranslations {
         }
 
+        type NavigationRoute = {
+            params?: Record<string, unknown>;
+            state?: NavigationState;
+            name: string;
+            key: string;
+        };
+
+        type NavigationState = {
+            routes: Array<NavigationRoute>;
+            index: number;
+        };
+
         type Navigation = {
             addListener: (state: string, callback: () => void) => () => void;
+            getRootState: () => NavigationState;
             navigate: (page: string, config?: {
                 screen: string
             }) => void;
-            getState: () => {
-                index: number;
-                routes: Array<{
-                    params?: Record<string, unknown>;
-                    state?: {
-                        routes: Array<{
-                            name: string;
-                            key: string;
-                        }>;
-                        index: number;
-                    };
-                    name: string;
-                    key: string;
-                }>;
-            };
+            getState: () => NavigationState;
         };
     }
 }