put the settings section in the url

Five settings pages moved from a `*_SELECTED` global to `/settings/:page/:section`. The
sidebar entry is a react-router `<NavLink>` rather than a button holding the key in its
onClick closure, so a section is linkable, cmd-clickable and gets its active state from the
router; each page renders one `SettingsRoute` guard that canonicalises both the bare route
and a section that does not exist.

Integrations needed more than the shared factory. It builds its own sidebar, and it kept the
Enterprise/Personal tab in a second global — which is why a deep link to a Personal section
could never have worked: the link set the section, the tab stayed on Enterprise, and the
content pane said "Select a section" about a section that existed. The tab is derived from
the section key now.

Also removes the `/settings/resources` menu item (audit M8) and its two locale keys: there
has never been such a route, so it bounced to the catch-all and out to `/`.
This commit is contained in:
2026-08-07 11:38:21 +00:00
parent 98ba61f135
commit 2502c33804
12 changed files with 155 additions and 99 deletions
@@ -3,7 +3,7 @@ import { Bot, Settings, Mail, Volume2, Mic, ScanText } from 'lucide-react';
import type { LayoutNode, PanelComponents } from 'officerdev';
import { WorkspaceLayout } from 'officerdev';
import { createSettingsPanelComponents, type SettingsSectionGroup } from './SettingsPanel';
import { SettingsRoute, createSettingsPanelComponents, type SettingsSectionGroup } from './SettingsPanel';
import { SMTPSection } from './ServerSettings/SMTPSection';
import { TTSSection } from './ServerSettings/TTSSection';
import { STTSection } from './ServerSettings/STTSection';
@@ -40,8 +40,10 @@ const groups: SettingsSectionGroup[] = [
},
];
const { Sidebar, Content } = createSettingsPanelComponents({
globalKey: 'SYSTEM_SETTINGS_SELECTED',
const BASE_PATH = '/settings/system';
const { Sidebar, Content, allSections } = createSettingsPanelComponents({
basePath: BASE_PATH,
sidebarIcon: Settings,
sidebarLabel: 'System',
groups,
@@ -73,8 +75,10 @@ export const SystemSettings = () => {
);
return (
<div className="h-full w-full pt-2">
<WorkspaceLayout layout={baseLayout} onLayoutChange={() => {}} components={panelComponents} />
</div>
<SettingsRoute basePath={BASE_PATH} sections={allSections}>
<div className="h-full w-full pt-2">
<WorkspaceLayout layout={baseLayout} onLayoutChange={() => {}} components={panelComponents} />
</div>
</SettingsRoute>
);
};