import { PropsWithChildren, ReactNode, Fragment, useEffect, useState } from "react"; import {AppSidebar} from "@/components/app-sidebar"; import {SidebarInset, SidebarProvider, SidebarTrigger} from "@/components/ui/sidebar"; import {Separator} from "@/components/ui/separator"; import { Breadcrumb, BreadcrumbItem, BreadcrumbList, BreadcrumbPage, BreadcrumbLink, BreadcrumbSeparator, BreadcrumbEllipsis, } from "@/components/ui/breadcrumb"; import { NavUser } from "@/components/nav-user"; import { usePage, Head, Link, router } from "@inertiajs/react"; import { PageProps } from "@/types"; import { BrandProvider, useBrand } from "@/contexts/brand-context"; import CookieConsent from "@/components/cookie-consent"; import { useFavicon } from "@/hooks/use-favicon"; import { useTranslation } from 'react-i18next'; import { Button } from "@/components/ui/button"; import { UserX, ArrowLeft } from "lucide-react"; import { useFlashMessages } from "@/hooks/useFlashMessages"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; function AuthenticatedLayoutContent({ header, children, breadcrumbs, pageTitle, pageDescription, pageActions, backUrl, className, ...props }: PropsWithChildren<{ header?: ReactNode; breadcrumbs?: Array<{label: string, url?: string}>; pageTitle?: string; pageDescription?: ReactNode; pageActions?: ReactNode; backUrl?: string; className?: string; }>) { const { t } = useTranslation(); const { auth, companyAllSetting, adminAllSetting } = usePage().props as any; const { settings } = useBrand(); useFavicon(); useFlashMessages(); return ( <> {companyAllSetting?.metaKeywords && ( )} {companyAllSetting?.metaDescription && ( )} {companyAllSetting?.metaImage && ( )}

{/* Sidebar + Breadcrumb */}

{/* SidebarTrigger */} {/* Separator */} {/* Breadcrumb */} {t('Dashboard')} {/* Desktop View (lg): show all breadcrumbs */} {breadcrumbs?.map((crumb, index) => ( {crumb.url ? ( {crumb.label} ) : ( {crumb.label} )} ))} {/* Tablet View (md:flex lg:hidden): if > 1 breadcrumbs, show Dashboard -> ... -> Last item */} {breadcrumbs && breadcrumbs.length > 1 && ( {breadcrumbs[breadcrumbs.length - 1].url ? ( {breadcrumbs[breadcrumbs.length - 1].label} ) : ( {breadcrumbs[breadcrumbs.length - 1].label} )} )} {/* Tablet View (md:flex lg:hidden): if exactly 1 breadcrumb, show Dashboard -> item */} {breadcrumbs && breadcrumbs.length === 1 && ( {breadcrumbs[0].url ? ( {breadcrumbs[0].label} ) : ( {breadcrumbs[0].label} )} )}

{/* NavUser */}

{/* Leave Impersonation Button */} {auth.impersonating && ( )}

{pageTitle && (

{pageTitle}

{pageDescription && (

{pageDescription}

)}

{backUrl && ( <>

{t('Back')}

)} {pageActions}

)} {children}

); } export default function AuthenticatedLayout({ children, header, breadcrumbs, pageTitle, pageDescription, pageActions, backUrl, className, ...props }: PropsWithChildren<{ header?: ReactNode; breadcrumbs?: Array<{label: string, url?: string}>; pageTitle?: string; pageDescription?: ReactNode; pageActions?: ReactNode; backUrl?: string; className?: string; }>) { return ( {children} ); }