51 lines
1.8 KiB
TypeScript
51 lines
1.8 KiB
TypeScript
'use client'
|
|
|
|
import { useSession } from 'next-auth/react'
|
|
import { Bell, Search } from 'lucide-react'
|
|
import { Button } from '@/components/ui/button'
|
|
import { Input } from '@/components/ui/input'
|
|
|
|
export function AdminHeader() {
|
|
const { data: session } = useSession()
|
|
|
|
return (
|
|
<header className="sticky top-0 z-40 flex h-16 shrink-0 items-center gap-4 border-b bg-background px-6">
|
|
{/* Search */}
|
|
<div className="flex flex-1 items-center gap-4">
|
|
<div className="relative w-full max-w-md">
|
|
<Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
|
<Input
|
|
type="search"
|
|
placeholder="Search orders, customers..."
|
|
className="pl-9"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Right side */}
|
|
<div className="flex items-center gap-4">
|
|
<Button variant="ghost" size="icon" className="relative">
|
|
<Bell className="h-5 w-5" />
|
|
<span className="absolute -right-1 -top-1 flex h-4 w-4 items-center justify-center rounded-full bg-primary text-[10px] text-primary-foreground">
|
|
3
|
|
</span>
|
|
</Button>
|
|
|
|
<div className="flex items-center gap-3">
|
|
<div className="h-8 w-8 rounded-full bg-primary flex items-center justify-center">
|
|
<span className="text-sm font-medium text-primary-foreground">
|
|
{session?.user?.name?.charAt(0)?.toUpperCase() || 'A'}
|
|
</span>
|
|
</div>
|
|
<div className="hidden sm:block">
|
|
<p className="text-sm font-medium">{session?.user?.name || 'Admin'}</p>
|
|
<p className="text-xs text-muted-foreground">
|
|
{session?.user?.role === 'ADMIN' ? 'Administrator' : 'Support'}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|