Loading resource
Compositions
The connected application frame for Overview and Settings, with isolated account loading and responsive navigation.
Use AppShell once in the application workspace layout. It owns the main landmark, header, SidebarProvider, tooltip and toast providers. Keep the redirect guard and identity-keyed DataProvider inside /app. Public resources use PublicShell instead. AppShellView accepts resolved account slots and renders an embeddable section unless mainId is supplied. The root Providers mounts useScrollActivity once; keep scrolling native and standalone scrollable regions keyboard accessible.
src/components/app-shell.tsx
Navigation and account actions stay in this preview.
The preview imports your production components. Open Code for the complete working example, including its imports.
Use Tab to inspect keyboard focus, switch themes, and try the controls. Reset restores the example’s initial state.