75 lines
2.8 KiB
TypeScript
75 lines
2.8 KiB
TypeScript
"use client";
|
|
import Image from "next/image";
|
|
import { icons } from "#/assets/icons";
|
|
import * as React from "react";
|
|
import { DropdownMenu } from "radix-ui";
|
|
import Link from "next/link";
|
|
import Theme from "./theme";
|
|
import { signOutFunc } from "#/lib/function";
|
|
|
|
export default function AdminHeader() {
|
|
const [open, setOpen] = React.useState(false);
|
|
|
|
return (
|
|
<>
|
|
<nav className="header r-flex-between px-[44px] py-[20px] ">
|
|
<p className="name text-[26px]">
|
|
Bienvenue, <span>Ken B.</span>{" "}
|
|
</p>
|
|
<div className="r-flex-between justify-center items-center r-gap-12">
|
|
<Theme />
|
|
{/* <ProfilePicture /> */}
|
|
|
|
<button type="button" className="icon-border">
|
|
<Image src={icons.notificationsIcon} alt="Notifications" />
|
|
</button>
|
|
<div className="relative">
|
|
<DropdownMenu.Root open={open} onOpenChange={setOpen}>
|
|
<DropdownMenu.Trigger asChild>
|
|
<div className="r-flex-between justify-center items-center r-gap-12 cursor-pointer ">
|
|
<Image src={icons.profilePicture} alt="ProfilePicture" />
|
|
<button className="IconButton" aria-label="Customise options">
|
|
<Image
|
|
src={icons.arrowUp}
|
|
alt="arrowUp"
|
|
className={`transition-transform duration-300 ${
|
|
open ? "scale-y-[-1]" : ""
|
|
}`}
|
|
/>
|
|
</button>
|
|
</div>
|
|
</DropdownMenu.Trigger>
|
|
|
|
<DropdownMenu.Portal>
|
|
<DropdownMenu.Content
|
|
className="DropdownMenuContent dropdown-menu r-flex-column r-secondary p-2"
|
|
sideOffset={0}
|
|
side="bottom"
|
|
align="end"
|
|
>
|
|
<DropdownMenu.Item className="DropdownMenuItem dropdown-item text-[14px] outline-none hover:bg-blue-100 rounded-md">
|
|
<Link href="#" className="d-flex items-start ">
|
|
<Image src={icons.userIcon} alt="Profil" />
|
|
Profil
|
|
</Link>
|
|
</DropdownMenu.Item>
|
|
<DropdownMenu.Item className="DropdownMenuItem dropdown-item text-[14px] outline-none hover:bg-blue-100 rounded-md">
|
|
<Link
|
|
href="#"
|
|
onClick={() => signOutFunc()}
|
|
className="d-flex items-start r-danger "
|
|
>
|
|
<Image src={icons.logoutRed} alt="Deconnexion" />
|
|
Déconnexion
|
|
</Link>
|
|
</DropdownMenu.Item>
|
|
</DropdownMenu.Content>
|
|
</DropdownMenu.Portal>
|
|
</DropdownMenu.Root>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
</>
|
|
);
|
|
}
|