41 lines
1.2 KiB
TypeScript
41 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import { useSession, signOut } from 'next-auth/react';
|
|
import { LogOut } from 'lucide-react';
|
|
import { Button } from '@/components/ui/button';
|
|
import { SiteSwitcher } from './site-switcher';
|
|
|
|
export function Header() {
|
|
const { data: session } = useSession();
|
|
|
|
const handleLogout = () => {
|
|
signOut({ callbackUrl: '/login' });
|
|
};
|
|
|
|
const userRole = session?.user?.role || '';
|
|
const displayRole = userRole
|
|
.replace(/_/g, ' ')
|
|
.toLowerCase()
|
|
.replace(/\b\w/g, (l) => l.toUpperCase());
|
|
|
|
return (
|
|
<header className="sticky top-0 z-30 flex h-16 items-center justify-between border-b border-primary-200 bg-white px-6 pl-64">
|
|
<div className="ml-6">
|
|
<SiteSwitcher />
|
|
</div>
|
|
|
|
<div className="flex items-center gap-4">
|
|
<div className="text-right">
|
|
<p className="text-sm font-medium text-primary-800">{session?.user?.name || 'User'}</p>
|
|
<p className="text-xs text-primary-500">{displayRole}</p>
|
|
</div>
|
|
<Button variant="ghost" size="icon" onClick={handleLogout} title="Log out">
|
|
<LogOut className="h-5 w-5" />
|
|
</Button>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|
|
|
|
export default Header;
|