67 lines
2.7 KiB
TypeScript
67 lines
2.7 KiB
TypeScript
import { Link, usePage } from "@inertiajs/react";
|
|
import { CircleUserRoundIcon, LogOutIcon, UserIcon } from "lucide-react";
|
|
|
|
import CustomSidebarTrigger from "@/back/Components/CustomSidebarTrigger";
|
|
import AppBreadcrumbs from "@/back/Components/Layout/AppBreadcrumbs";
|
|
import AppSettings from "@/back/Components/Layout/Settings/AppSettings";
|
|
import type { AuthProp, ConfigBackend } from "@/back/types/global";
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu";
|
|
import useTrans from "@/hooks/use-translations";
|
|
|
|
export default function AppHeader() {
|
|
const { user } = usePage().props.auth as AuthProp;
|
|
const { routes } = usePage().props.configBackend as ConfigBackend;
|
|
return (
|
|
<header className="sticky top-0 flex flex-col justify-between items-center bg-background border-b z-20">
|
|
<div className="sticky top-0 flex flex-row justify-between items-center w-full py-4">
|
|
<div className="flex flex-row justify-start items-center">
|
|
<CustomSidebarTrigger />
|
|
<AppBreadcrumbs className="hidden md:block" />
|
|
</div>
|
|
<div className="flex items-center gap-x-1.5">
|
|
<AppSettings />
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="ghost" className="text-muted-foreground">
|
|
<CircleUserRoundIcon />
|
|
<span className="hidden lg:block">
|
|
{user.first_name} {user.last_name}
|
|
</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent side="bottom" className="w-fit me-1">
|
|
<DropdownMenuItem className="p-0">
|
|
<Button variant="ghost" asChild>
|
|
<Link
|
|
href={route(`${routes.name}users.show`, user.id)}
|
|
className="w-full"
|
|
>
|
|
<UserIcon />
|
|
{useTrans("uwil-backend::back.profile")}
|
|
</Link>
|
|
</Button>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem className="p-0">
|
|
<Button variant="ghost" asChild>
|
|
<a href={route(`${routes.name}logout`)} className="w-full">
|
|
<LogOutIcon />
|
|
{useTrans("uwil-backend::back.disconnect")}
|
|
</a>
|
|
</Button>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</div>
|
|
</div>
|
|
<AppBreadcrumbs className="block md:hidden mb-4 w-full" />
|
|
</header>
|
|
);
|
|
}
|