diff --git a/src/app/navigation.tsx b/src/app/navigation.tsx index 6c5e4a935..9bd932f22 100644 --- a/src/app/navigation.tsx +++ b/src/app/navigation.tsx @@ -207,6 +207,16 @@ export const orgNavSections = ( title: "sidebarVirtualApiKeys", href: "/{orgId}/settings/virtual-api-keys", icon: + }, + { + title: "sidebarLogsAi", + href: "/{orgId}/settings/logs/ai", + icon: + }, + { + title: "sidebarLogsAiUsage", + href: "/{orgId}/settings/logs/ai-usage", + icon: } ] }, @@ -229,16 +239,6 @@ export const orgNavSections = ( ) }, - { - title: "sidebarLogsAi", - href: "/{orgId}/settings/logs/ai", - icon: - }, - { - title: "sidebarLogsAiUsage", - href: "/{orgId}/settings/logs/ai-usage", - icon: - }, ...(!env?.flags.disableEnterpriseFeatures ? [ { diff --git a/src/components/SidebarNav.tsx b/src/components/SidebarNav.tsx index 93f358c71..eb8386ffc 100644 --- a/src/components/SidebarNav.tsx +++ b/src/components/SidebarNav.tsx @@ -49,6 +49,10 @@ export interface SidebarNavProps extends React.HTMLAttributes { notificationCounts?: Record; } +function isPathActive(pathname: string, href: string): boolean { + return pathname === href || pathname.startsWith(`${href}/`); +} + type CollapsibleNavItemProps = { item: SidebarNavItem; level: number; @@ -285,7 +289,7 @@ function CollapsedNavItemWithPopover({ childItem.href ); const childIsActive = childHydratedHref - ? pathname.startsWith(childHydratedHref) + ? isPathActive(pathname, childHydratedHref) : false; const childIsEE = build === "enterprise" && @@ -392,7 +396,7 @@ export function SidebarNav({ function isItemOrChildActive(item: SidebarNavItem): boolean { const hydratedHref = hydrateHref(item.href); - if (hydratedHref && pathname.startsWith(hydratedHref)) { + if (hydratedHref && isPathActive(pathname, hydratedHref)) { return true; } if (item.items) { @@ -408,7 +412,7 @@ export function SidebarNav({ const hydratedHref = hydrateHref(item.href); const hasNestedItems = item.items && item.items.length > 0; const isActive = hydratedHref - ? pathname.startsWith(hydratedHref) + ? isPathActive(pathname, hydratedHref) : false; const isChildActive = hasNestedItems ? isItemOrChildActive(item)