Import source: src/components/shell/control-shell
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect } from "react";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { Header } from "@/components/shell/header";
|
||||
import { MobileSidebar, Sidebar } from "@/components/shell/sidebar";
|
||||
import { AmbientBackground } from "@/components/shell/ambient-background";
|
||||
import { CommandPalette, CommandPaletteHotkey } from "@/components/shell/command-palette";
|
||||
import { useUiStore } from "@/stores/ui-store";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
export function ControlShell({ children }: { children: React.ReactNode }) {
|
||||
const pathname = usePathname();
|
||||
const collapsed = useUiStore((state) => state.sidebarCollapsed);
|
||||
const rememberRoute = useUiStore((state) => state.rememberRoute);
|
||||
|
||||
useEffect(() => {
|
||||
rememberRoute(pathname);
|
||||
}, [pathname, rememberRoute]);
|
||||
|
||||
return (
|
||||
<div className="relative min-h-screen">
|
||||
<AmbientBackground />
|
||||
<Sidebar />
|
||||
<Header />
|
||||
<main
|
||||
className={cn(
|
||||
"px-3 py-4 transition-[padding] sm:px-4 lg:pl-[calc(var(--sidebar-width)+24px)] lg:pr-3 [&_a]:scroll-mt-[calc(var(--header-height)+24px)] [&_button]:scroll-mt-[calc(var(--header-height)+24px)] [&_input]:scroll-mt-[calc(var(--header-height)+24px)]",
|
||||
collapsed && "lg:pl-[96px]",
|
||||
)}
|
||||
>
|
||||
<div key={pathname} className="anim-rise mx-auto max-w-[1680px]">
|
||||
{children}
|
||||
</div>
|
||||
</main>
|
||||
<MobileSidebar />
|
||||
<CommandPalette />
|
||||
<CommandPaletteHotkey />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user