Merge pull request #703 from easyops-cn/steve/menu

fix(menu): support query in active excludes
easyops-cn · Dec 26, 2024 · 85e832c · 85e832c
2 parents 4d0b80c + db21dd8
commit 85e832c
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 8 deletions.
diff --git a/libs/basic-components/src/Sidebar.spec.tsx b/libs/basic-components/src/Sidebar.spec.tsx
@@ -218,4 +218,22 @@ describe("Sidebar", () => {
     expect(matchMenuItem(item, pathname2, "?search=false")).toBe(true);
     expect(matchMenuItem(item, pathname3, "?search=true")).toBe(false);
   });
+
+  it("matchMenuItem with activeExcludes with query", () => {
+    const item = {
+      text: "Test",
+      to: "/test?tab=a",
+      exact: true,
+      activeMatchSearch: true,
+      activeIncludes: ["/test?tab=b"],
+      activeExcludes: ["/test?system=x"],
+    };
+    const pathname = "/test";
+    expect(matchMenuItem(item, pathname, "")).toBe(false);
+    expect(matchMenuItem(item, pathname, "?tab=a")).toBe(true);
+    expect(matchMenuItem(item, pathname, "?tab=b")).toBe(true);
+    expect(matchMenuItem(item, pathname, "?tab=c")).toBe(false);
+    expect(matchMenuItem(item, pathname, "?tab=a&system=x")).toBe(false);
+    expect(matchMenuItem(item, pathname, "?tab=a&system=y")).toBe(true);
+  });
 });
diff --git a/libs/basic-components/src/Sidebar.tsx b/libs/basic-components/src/Sidebar.tsx
@@ -107,6 +107,10 @@ export function matchMenuItem(
     exact: item.exact,
   });
 
+  if (match && (item as any).activeMatchSearch) {
+    match = getMatchOfSearch(search, to.search);
+  }
+
   if (!match && Array.isArray(item.activeIncludes)) {
     for (const include of item.activeIncludes) {
       let paths: string[];
@@ -159,10 +163,19 @@ export function matchMenuItem(
       }
 
       for (const path of paths) {
-        match = !matchPath(pathname, {
-          path,
-          exact,
-        });
+        let parsedPathWithSearch: Location | undefined;
+        if (path.includes("?")) {
+          parsedPathWithSearch = parsePath(path);
+        }
+
+        match = !(
+          matchPath(pathname, {
+            path: parsedPathWithSearch ? parsedPathWithSearch.pathname : path,
+            exact,
+          }) &&
+          (!parsedPathWithSearch ||
+            getMatchOfSearch(search, parsedPathWithSearch.search))
+        );
 
         if (!match) {
           break;
@@ -175,10 +188,6 @@ export function matchMenuItem(
     }
   }
 
-  if (match && (item as any).activeMatchSearch) {
-    match = getMatchOfSearch(search, to.search);
-  }
-
   return match;
 }