fix(settings): don't highlight a sibling nav item on nested settings pages

/account/settings/chat-keys is a real page but deliberately not a nav item, so the sidebar's parseSettingsPathSection fell through to defaultSection ('general') and highlighted General — the page read as though it lived inside General.

Resolve the sidebar's active item with a null default so an unmatched nested route highlights nothing, and widen SettingsSidebar's activeSection to string | null. The section feeding the title/description provider keeps its default (pages override title/description anyway), and /account/settings/billing/credit-usage still correctly highlights Billing.

Author: TheodoreSpeaks

apps/sim/components/settings/navigation.test.ts

@@ -179,6 +179,9 @@ describe('settings navigation boundaries', () => {
     expect(parseAccountPath('/account/settings/apikeys', null)).toBe('api-keys')
     expect(parseAccountPath('/account/settings/not-a-section', null)).toBeNull()
     expect(parseAccountPath('/account/settings', 'general')).toBe('general')
+    // Chat keys is a real page but deliberately not a nav item — with a null
+    // default it must resolve to nothing so the sidebar highlights no sibling.
+    expect(parseAccountPath('/account/settings/chat-keys', null)).toBeNull()
   })
 
   it('parses canonical, aliased, and invalid organization settings paths', () => {

apps/sim/components/settings/settings-sidebar.tsx

@@ -18,7 +18,8 @@ interface SidebarSettingsItem<Section extends SettingsSection>
 }
 
 interface SettingsSidebarProps<Section extends SettingsSection> {
-  activeSection: string
+  /** `null` when the route is a nested page that is not itself a nav item — nothing highlights. */
+  activeSection: string | null
   backHref: string
   groups: readonly SettingsNavigationGroup[]
   hrefForSection: (section: Section) => string

apps/sim/components/settings/standalone-settings-shell.tsx

@@ -76,10 +76,23 @@ export function StandaloneSettingsShell(props: StandaloneSettingsShellProps) {
     aliases: ORGANIZATION_SETTINGS_PATH_ALIASES,
   })
   const activeSection = plane === 'account' ? accountSection : organizationSection
+  /**
+   * The sidebar highlights only an exact nav match. A nested route that is not
+   * itself a nav item (e.g. /account/settings/chat-keys) would otherwise fall back
+   * to `defaultSection` and light up an unrelated sibling — reading as though the
+   * page lived inside it. The section above keeps its default for the title
+   * provider, which every page can still override.
+   */
+  const accountSidebarSection = parseSettingsPathSection({
+    path: pathname,
+    items: ACCOUNT_SETTINGS_ITEMS,
+    defaultSection: null,
+    aliases: ACCOUNT_SETTINGS_PATH_ALIASES,
+  })
   const sidebar =
     plane === 'account' ? (
       <SettingsSidebar
-        activeSection={accountSection}
+        activeSection={accountSidebarSection}
         backHref='/workspace'
         groups={ACCOUNT_SETTINGS_GROUPS}
         hrefForSection={getAccountSettingsHref}