66 lines
2.5 KiB
TypeScript
66 lines
2.5 KiB
TypeScript
// * Packages
|
|
import { motion } from "motion/react";
|
|
import { ReactNode } from "react";
|
|
import { Head } from "@inertiajs/react";
|
|
// * Components shadcn
|
|
import { SidebarProvider } from "@/components/ui/sidebar";
|
|
import { Toaster } from "@/components/ui/toaster";
|
|
import { TooltipProvider } from "@/components/ui/tooltip";
|
|
// * Other
|
|
import AppSidebar from "@/back/Components/Layout/AppSidebar";
|
|
import AppHeader from "@/back/Components/Layout/AppHeader";
|
|
import AppFooter from "@/back/Components/Layout/AppFooter";
|
|
import { ThemeProvider } from "@/back/providers/ThemeProvider";
|
|
|
|
type LayoutProps = {
|
|
title: string;
|
|
beforeNode?: ReactNode;
|
|
afterNode?: ReactNode;
|
|
children: ReactNode;
|
|
}
|
|
|
|
export default function Layout({
|
|
title,
|
|
beforeNode,
|
|
afterNode,
|
|
children,
|
|
}: LayoutProps) {
|
|
const isCollapsed = localStorage.getItem("vite-ui-collapsed");
|
|
return (
|
|
<ThemeProvider>
|
|
<SidebarProvider defaultOpen={!isCollapsed}>
|
|
<TooltipProvider>
|
|
<AppSidebar />
|
|
<motion.main
|
|
initial={{ opacity: 0 }}
|
|
animate={{ opacity: 1 }}
|
|
exit={{ opacity: 0 }}
|
|
transition={{ duration: 0.3 }}
|
|
className="relative container flex flex-col justify-between mx-auto px-8 pb-4"
|
|
>
|
|
<div className="flex flex-col justify-between">
|
|
<AppHeader />
|
|
<div className="flex justify-between items-center py-4">
|
|
<Head title={title} />
|
|
<div className="flex justify-start items-center">
|
|
{beforeNode}
|
|
<h1
|
|
className={`scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl${
|
|
beforeNode ? " ms-2" : ""
|
|
}`}
|
|
>
|
|
{title}
|
|
</h1>
|
|
</div>
|
|
{afterNode}
|
|
</div>
|
|
{children}
|
|
</div>
|
|
<Toaster />
|
|
<AppFooter />
|
|
</motion.main>
|
|
</TooltipProvider>
|
|
</SidebarProvider>
|
|
</ThemeProvider>
|
|
);
|
|
}
|