56 lines
2 KiB
TypeScript
56 lines
2 KiB
TypeScript
import Link from 'next/link';
|
|
import { getCurrentUser } from '@/lib/server/auth';
|
|
import { t } from '@/lib/i18n';
|
|
import { ThemeToggle } from './ThemeToggle';
|
|
import { CartLink } from './cart/CartLink';
|
|
|
|
export async function SiteHeader() {
|
|
const user = await getCurrentUser();
|
|
return (
|
|
<header
|
|
className="sticky top-0 z-40 border-b backdrop-blur-xl"
|
|
style={{
|
|
borderColor: 'color-mix(in srgb, var(--border) 85%, transparent)',
|
|
background: 'color-mix(in srgb, var(--surface) 78%, transparent)',
|
|
}}
|
|
>
|
|
<div className="page flex h-16 items-center justify-between gap-4">
|
|
<Link href="/" className="flex items-center gap-2">
|
|
<span className="font-display text-2xl leading-none tracking-tight">{t('brand.name')}</span>
|
|
<span className="kicker hidden sm:inline" aria-hidden>
|
|
Store
|
|
</span>
|
|
</Link>
|
|
<nav className="hidden items-center gap-7 text-sm md:flex" aria-label="Main">
|
|
<Link href="/shop" className="transition-colors hover:text-[var(--text)]" style={{ color: 'var(--text-muted)' }}>
|
|
Shop
|
|
</Link>
|
|
{user && (
|
|
<Link href="/orders" className="transition-colors hover:text-[var(--text)]" style={{ color: 'var(--text-muted)' }}>
|
|
Orders
|
|
</Link>
|
|
)}
|
|
{user?.role === 'admin' && (
|
|
<Link href="/admin" className="transition-colors hover:text-[var(--text)]" style={{ color: 'var(--text-muted)' }}>
|
|
{t('nav.admin')}
|
|
</Link>
|
|
)}
|
|
</nav>
|
|
<div className="flex items-center gap-2">
|
|
<ThemeToggle />
|
|
<CartLink />
|
|
{user ? (
|
|
<Link href="/dashboard" className="btn-secondary">
|
|
{t('nav.dashboard')}
|
|
</Link>
|
|
) : (
|
|
<Link href="/login" className="btn-primary">
|
|
{t('nav.login')}
|
|
</Link>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|