Appheaders1

1import Logo from "@/ui/logo";
2import { Avatar, AvatarFallback, AvatarImage } from "@/ui/avatar";
3import { Button } from "@/ui/button";
4import {
5  DropdownMenu,
6  DropdownMenuContent,
7  DropdownMenuItem,
8  DropdownMenuSeparator,
9  DropdownMenuTrigger,
10} from "@/ui/dropdown-menu";
11import { Bell } from "@mynaui/icons-react";
12 
13export default function Basic() {
14  return (
15    <header className="flex h-16 w-full shrink-0 items-center justify-between px-4 md:px-6">
16      <Logo />
17      <nav className="mx-auto hidden gap-6 text-sm font-medium md:flex">
18        <a href="#">Dashboard</a>
19        <a href="#">Analytics</a>
20        <a href="#">Projects</a>
21        <a href="#">Team</a>
22      </nav>
23      <div className="flex items-center gap-4">
24        <Button variant="ghost" size="icon" className="rounded-full">
25          <Bell className="size-5" />
26          <span className="sr-only">View notifications</span>
27        </Button>
28        <DropdownMenu>
29          <DropdownMenuTrigger asChild>
30            <Avatar className="size-8">
31              <AvatarImage src="https://mynaui.com/avatars/avatar-01.webp" />
32              <AvatarFallback>JP</AvatarFallback>
33              <span className="sr-only">Toggle user menu</span>
34            </Avatar>
35          </DropdownMenuTrigger>
36          <DropdownMenuContent>
37            <DropdownMenuItem>My Account</DropdownMenuItem>
38            <DropdownMenuItem>Settings</DropdownMenuItem>
39            <DropdownMenuSeparator />
40            <DropdownMenuItem>Logout</DropdownMenuItem>
41          </DropdownMenuContent>
42        </DropdownMenu>
43      </div>
44    </header>
45  );
46}