105 lines
3.6 KiB
TypeScript
105 lines
3.6 KiB
TypeScript
"use client";
|
|
|
|
import { useRouter } from "next/navigation";
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuLabel,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu";
|
|
import { LogOut, User } from "lucide-react";
|
|
import { logout, getCurrentUser } from "@/lib/auth";
|
|
import { NotificationsDropdown } from "@/components/notifications-dropdown";
|
|
import { LanguageSwitcher } from "@/components/language-switcher";
|
|
|
|
export function DashboardHeader() {
|
|
const router = useRouter();
|
|
const user = getCurrentUser();
|
|
|
|
const handleLogout = () => {
|
|
logout();
|
|
router.push("/");
|
|
};
|
|
|
|
const handleProfileClick = () => {
|
|
router.push("/profile");
|
|
};
|
|
|
|
const getInitials = (name: string) => {
|
|
return name
|
|
.split(" ")
|
|
.map((word) => word[0])
|
|
.join("")
|
|
.toUpperCase()
|
|
.slice(0, 2);
|
|
};
|
|
|
|
return (
|
|
<header className="border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 sticky top-0 z-50">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="flex h-16 items-center justify-between">
|
|
<div className="flex items-center gap-3 md:hidden">
|
|
<span className="font-bold">GoHorse Jobs</span>
|
|
</div>
|
|
<div className="hidden md:block"></div>
|
|
|
|
<div className="flex items-center gap-4">
|
|
<LanguageSwitcher />
|
|
<NotificationsDropdown />
|
|
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button
|
|
variant="ghost"
|
|
className="relative h-10 w-10 rounded-full"
|
|
>
|
|
<Avatar className="h-10 w-10">
|
|
<AvatarImage
|
|
src={user?.avatarUrl || undefined}
|
|
alt={user?.name}
|
|
/>
|
|
<AvatarFallback className="bg-primary/10 text-primary">
|
|
{user?.name
|
|
? getInitials(user.name)
|
|
: user?.email
|
|
? getInitials(user.email.split('@')[0])
|
|
: "U"}
|
|
</AvatarFallback>
|
|
</Avatar>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent className="w-56" align="end" forceMount>
|
|
<DropdownMenuLabel className="font-normal">
|
|
<div className="flex flex-col space-y-1">
|
|
<p className="text-sm font-medium leading-none">
|
|
{user?.name || "User"}
|
|
</p>
|
|
<p className="text-xs leading-none text-muted-foreground">
|
|
{user?.email}
|
|
</p>
|
|
</div>
|
|
</DropdownMenuLabel>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem onClick={handleProfileClick} className="cursor-pointer">
|
|
<User className="mr-2 h-4 w-4" />
|
|
<span>Profile</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem onClick={handleLogout} className="cursor-pointer">
|
|
<LogOut className="mr-2 h-4 w-4" />
|
|
<span>Sign out</span>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|