2024-06-29 05:22:22 +00:00
|
|
|
import React from "react";
|
|
|
|
import Link from "next/link";
|
|
|
|
import { CircleUser, Menu, Search } from "lucide-react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
import {
|
|
|
|
DropdownMenu,
|
|
|
|
DropdownMenuContent,
|
|
|
|
DropdownMenuItem,
|
|
|
|
DropdownMenuLabel,
|
|
|
|
DropdownMenuSeparator,
|
|
|
|
DropdownMenuTrigger,
|
|
|
|
} from "@/components/ui/dropdown-menu";
|
|
|
|
import { Input } from "@/components/ui/input";
|
|
|
|
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
|
|
|
|
import { getAuth } from "@/auth/queries/getauth";
|
|
|
|
import NavigationMenuDesktop from "./desktopNavBar";
|
|
|
|
import NavigationMenuMobile from "./mobileNavBar";
|
|
|
|
import { signOut } from "@/auth/components/signout";
|
2024-07-01 18:19:20 +00:00
|
|
|
import { ModeToggle } from "../darkmode";
|
2024-06-29 05:22:22 +00:00
|
|
|
const HeaderNavigation = async () => {
|
|
|
|
const { user } = await getAuth();
|
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
{user && (
|
|
|
|
<header className="sticky top-0 flex h-16 items-center gap-4 border-b bg-background px-4 md:px-6">
|
|
|
|
<NavigationMenuDesktop />
|
|
|
|
<Sheet>
|
|
|
|
<SheetTrigger asChild>
|
|
|
|
<Button
|
|
|
|
variant="outline"
|
|
|
|
size="icon"
|
|
|
|
className="shrink-0 md:hidden"
|
|
|
|
>
|
|
|
|
<Menu className="h-5 w-5" />
|
|
|
|
<span className="sr-only">Toggle navigation menu</span>
|
|
|
|
</Button>
|
|
|
|
</SheetTrigger>
|
|
|
|
<SheetContent side="left">
|
|
|
|
<NavigationMenuMobile />
|
|
|
|
</SheetContent>
|
|
|
|
</Sheet>
|
|
|
|
<div className="flex w-full items-center gap-4 md:ml-auto md:gap-2 lg:gap-4">
|
|
|
|
<form className="ml-auto flex-1 sm:flex-initial">
|
|
|
|
<div className="relative">
|
|
|
|
<Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
|
|
|
|
<Input
|
|
|
|
type="search"
|
|
|
|
placeholder="Search"
|
|
|
|
className="pl-8 sm:w-[300px] md:w-[200px] lg:w-[300px]"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</form>
|
2024-07-01 18:19:20 +00:00
|
|
|
<ModeToggle />
|
|
|
|
|
2024-06-29 05:22:22 +00:00
|
|
|
<DropdownMenu>
|
|
|
|
<DropdownMenuTrigger asChild>
|
|
|
|
<Button
|
|
|
|
variant="secondary"
|
|
|
|
size="icon"
|
|
|
|
className="rounded-full"
|
|
|
|
>
|
|
|
|
<CircleUser className="h-5 w-5" />
|
|
|
|
<span className="sr-only">Toggle user menu</span>
|
|
|
|
</Button>
|
|
|
|
</DropdownMenuTrigger>
|
|
|
|
<DropdownMenuContent align="end">
|
|
|
|
<DropdownMenuLabel>My Account</DropdownMenuLabel>
|
|
|
|
<DropdownMenuSeparator />
|
|
|
|
<DropdownMenuItem>
|
|
|
|
<Link className="text-primary" href="/settings/home">
|
|
|
|
Settings
|
|
|
|
</Link>
|
|
|
|
</DropdownMenuItem>
|
|
|
|
{user.role === "ADMIN" && (
|
|
|
|
<DropdownMenuItem>
|
|
|
|
<Link className="text-primary" href="/admin/home">
|
|
|
|
Admin
|
|
|
|
</Link>
|
|
|
|
</DropdownMenuItem>
|
|
|
|
)}
|
|
|
|
<DropdownMenuSeparator />
|
|
|
|
<form action={signOut}>
|
|
|
|
<Button className="bg-transparent text-primary hover:bg-transparent pl-2 font-normal">
|
|
|
|
Logout
|
|
|
|
</Button>
|
|
|
|
</form>
|
|
|
|
</DropdownMenuContent>
|
|
|
|
</DropdownMenu>
|
|
|
|
</div>
|
|
|
|
</header>
|
|
|
|
)}
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default HeaderNavigation;
|