SinkLayout() — ui Function Reference

Architecture documentation for the SinkLayout() function in layout.tsx from the ui codebase.

Function tsx DocumentationAtlas Changelog

Entity Profile

DocumentationAtlas→ Changelog→ SinkLayout() — ui Function Reference

Dependency Diagram

graph TD
  fc988d35_cc6b_2d45_1df3_f83d4219bbca["SinkLayout()"]
  a4cae50b_f57e_6d2a_b6bd_6709db7519d7["layout.tsx"]
  fc988d35_cc6b_2d45_1df3_f83d4219bbca -->|defined in| a4cae50b_f57e_6d2a_b6bd_6709db7519d7
  style fc988d35_cc6b_2d45_1df3_f83d4219bbca fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/app/(internal)/sink/layout.tsx lines 35–66

export default async function SinkLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <SidebarProvider
      defaultOpen={true}
      className={cn(
        "theme-container",
        inter.variable,
        notoSans.variable,
        nunitoSans.variable,
        figtree.variable
      )}
    >
      <AppSidebar />
      <SidebarInset>
        <header className="bg-background sticky top-0 z-10 flex h-14 items-center border-b p-4">
          <SidebarTrigger />
          <Separator orientation="vertical" className="mr-4 ml-2 !h-4" />
          <AppBreadcrumbs />
          <div className="ml-auto flex items-center gap-2">
            <ModeSwitcher />
            <ThemeSelector />
          </div>
        </header>
        {children}
      </SidebarInset>
    </SidebarProvider>
  )
}