layoutsettings layout

settings layout

two-column shell for every /settings surface: 240px left-rail nav on the left, content panel on the right. lifted into packages/ui so patient, provider, and HQ compose the same shape.

click a nav item below to see the active-state shift. in a real app, next.js routing drives the active item via usePathname().

import from @halwel/ui/components/dashboard/SettingsLayout

variants

live demo — click the rail

profile

body of the profile tab. composes any existing primitives — portal cards, form fields, status rows. the layout is just the rail + panel shell.

example content: a profile field group would go here.

the panel switches based on the active item. each nav item is a Link in production; the demo overrides currentPath so the page doesn't actually navigate.