diff --git a/frontend-web/src/components/page-sidebar-dark.tsx b/frontend-web/src/components/page-sidebar-dark.tsx index 15b6f8c8..af274aff 100644 --- a/frontend-web/src/components/page-sidebar-dark.tsx +++ b/frontend-web/src/components/page-sidebar-dark.tsx @@ -54,7 +54,7 @@ export function PageSidebarDark({ collapsed, onToggleCollapsed }: PageSidebarDar }; const hasActiveChild = (item: MenuItem): boolean => { - if (item.path && pathname === item.path) { + if (item.path && (pathname === item.path || pathname.startsWith(item.path + "/"))) { return true; } @@ -153,7 +153,7 @@ export function PageSidebarDark({ collapsed, onToggleCollapsed }: PageSidebarDar inWujieEnv ? item.id === activeTopId : item.path - ? pathname === item.path + ? pathname === item.path || pathname.startsWith(item.path + "/") : hasActiveChild(item); const handleSidebarItemClick = (item: MenuItem) => { if (inWujieEnv) { diff --git a/frontend-web/src/components/page-sidebar.tsx b/frontend-web/src/components/page-sidebar.tsx index 42b556fe..4ad89043 100644 --- a/frontend-web/src/components/page-sidebar.tsx +++ b/frontend-web/src/components/page-sidebar.tsx @@ -42,7 +42,7 @@ type PageSidebarProps = { type SettingsSection = "account" | "appearance" | "memory" | "tools" | "about"; const hasActiveChild = (item: MenuItem, pathname: string): boolean => { - if (item.path && pathname === item.path) { + if (item.path && (pathname === item.path || pathname.startsWith(item.path + "/"))) { return true; } return item.children?.some((child) => hasActiveChild(child, pathname)) ?? false; @@ -116,7 +116,9 @@ function SecondaryNavSidebar() { const secondaryItems = activeTopItem?.children ?? []; const isItemActive = (item: MenuItem) => - item.path ? pathname === item.path : hasActiveChild(item, pathname); + item.path + ? pathname === item.path || pathname.startsWith(item.path + "/") + : hasActiveChild(item, pathname); const handleItemClick = (item: MenuItem) => { const path = item.path ?? findFirstRoutePath(item.children); @@ -210,7 +212,7 @@ function SecondaryNavSidebar() { {thirdItems.map((child) => { const ChildIcon = child.icon; const childActive = child.path - ? pathname === child.path + ? pathname === child.path || pathname.startsWith(child.path + "/") : hasActiveChild(child, pathname); return (