// * Packages import { motion } from "motion/react"; import { ReactNode, useEffect, useState } from "react"; import { Head, usePage } from "@inertiajs/react"; // * Components shadcn import { SidebarProvider, useSidebar } 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 AuthenticatedLayoutProps = { title: string; beforeNode?: ReactNode; afterNode?: ReactNode; children: ReactNode; }; function LayoutContent({ title, beforeNode, afterNode, children, }: Omit & { children: ReactNode }) { const { open } = useSidebar(); const [isSm, setIsSm] = useState(false); let sidebarVar = "0px"; if (!isSm) { sidebarVar = open ? "var(--sidebar-width)" : "var(--sidebar-width-icon)"; } useEffect(() => { const mediaQuery = window.matchMedia("(max-width: 767px)"); setIsSm(mediaQuery.matches); const handler = (e: MediaQueryListEvent) => setIsSm(e.matches); mediaQuery.addEventListener("change", handler); return () => mediaQuery.removeEventListener("change", handler); }, []); return ( <>
{beforeNode}

{title}

{afterNode}
{children}
); } export default function AuthenticatedLayout({ title, beforeNode, afterNode, children, }: AuthenticatedLayoutProps) { const isCollapsed = typeof window !== "undefined" ? localStorage.getItem("vite-ui-collapsed") : null; const { locale } = usePage().props.appEnv as unknown as { locale: string; }; return ( {children} ); }