fix(ui): add Outlet to settings layout for child route navigation
Settings child routes (credentials, snmp-profiles, api-keys) were not rendering because the parent settings.tsx had no Outlet. Now detects child routes and renders Outlet, or shows SettingsPage index. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,6 +1,21 @@
|
|||||||
import { createFileRoute } from '@tanstack/react-router'
|
import { createFileRoute, Outlet, useMatches } from '@tanstack/react-router'
|
||||||
import { SettingsPage } from '@/components/settings/SettingsPage'
|
import { SettingsPage } from '@/components/settings/SettingsPage'
|
||||||
|
|
||||||
export const Route = createFileRoute('/_authenticated/settings')({
|
export const Route = createFileRoute('/_authenticated/settings')({
|
||||||
component: SettingsPage,
|
component: SettingsLayout,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function SettingsLayout() {
|
||||||
|
const matches = useMatches()
|
||||||
|
// If we're on a child route (credentials, snmp-profiles, api-keys), render the Outlet.
|
||||||
|
// If we're on the exact /settings route, render the SettingsPage index.
|
||||||
|
const isChildRoute = matches.some(
|
||||||
|
(m) => m.routeId !== '/_authenticated/settings' && m.routeId.startsWith('/_authenticated/settings/')
|
||||||
|
)
|
||||||
|
|
||||||
|
if (isChildRoute) {
|
||||||
|
return <Outlet />
|
||||||
|
}
|
||||||
|
|
||||||
|
return <SettingsPage />
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user