kovakmedya
29aa346f9e
- Next.js 16.1.1 + React 19.2.3 + Tailwind v4 + shadcn/ui v3 - Template scaffold (App Router with (auth)/(dashboard)/landing route groups) - pnpm v10 lockfile - CLAUDE.md describing multi-tenant Appwrite architecture, 8 modules, Gitea+Coolify deploy
79 lines
2.4 KiB
TypeScript
79 lines
2.4 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
import { AppSidebar } from "@/components/app-sidebar";
|
|
import { SiteHeader } from "@/components/site-header";
|
|
import { SiteFooter } from "@/components/site-footer";
|
|
import { SidebarProvider, SidebarInset } from "@/components/ui/sidebar";
|
|
import { ThemeCustomizer, ThemeCustomizerTrigger } from "@/components/theme-customizer";
|
|
import { UpgradeToProButton } from "@/components/upgrade-to-pro-button";
|
|
import { useSidebarConfig } from "@/hooks/use-sidebar-config";
|
|
|
|
export default function DashboardLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
const [themeCustomizerOpen, setThemeCustomizerOpen] = React.useState(false);
|
|
const { config } = useSidebarConfig();
|
|
|
|
return (
|
|
<SidebarProvider
|
|
style={{
|
|
"--sidebar-width": "16rem",
|
|
"--sidebar-width-icon": "3rem",
|
|
"--header-height": "calc(var(--spacing) * 14)",
|
|
} as React.CSSProperties}
|
|
className={config.collapsible === "none" ? "sidebar-none-mode" : ""}
|
|
>
|
|
{config.side === "left" ? (
|
|
<>
|
|
<AppSidebar
|
|
variant={config.variant}
|
|
collapsible={config.collapsible}
|
|
side={config.side}
|
|
/>
|
|
<SidebarInset>
|
|
<SiteHeader />
|
|
<div className="flex flex-1 flex-col">
|
|
<div className="@container/main flex flex-1 flex-col gap-2">
|
|
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<SiteFooter />
|
|
</SidebarInset>
|
|
</>
|
|
) : (
|
|
<>
|
|
<SidebarInset>
|
|
<SiteHeader />
|
|
<div className="flex flex-1 flex-col">
|
|
<div className="@container/main flex flex-1 flex-col gap-2">
|
|
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<SiteFooter />
|
|
</SidebarInset>
|
|
<AppSidebar
|
|
variant={config.variant}
|
|
collapsible={config.collapsible}
|
|
side={config.side}
|
|
/>
|
|
</>
|
|
)}
|
|
|
|
{/* Theme Customizer */}
|
|
<ThemeCustomizerTrigger onClick={() => setThemeCustomizerOpen(true)} />
|
|
<ThemeCustomizer
|
|
open={themeCustomizerOpen}
|
|
onOpenChange={setThemeCustomizerOpen}
|
|
/>
|
|
<UpgradeToProButton />
|
|
</SidebarProvider>
|
|
);
|
|
}
|