site-header.tsx71 lines · main
| 1 | import Image from 'next/image'; |
| 2 | import Link from 'next/link'; |
| 3 | |
| 4 | import { LandingUserMenu } from '../landing-user-menu'; |
| 5 | |
| 6 | interface SiteHeaderUser { |
| 7 | name: string | null; |
| 8 | email: string; |
| 9 | image: string | null; |
| 10 | legalName: string | null; |
| 11 | } |
| 12 | |
| 13 | export function SiteHeader({ user }: { user: SiteHeaderUser | null }) { |
| 14 | return ( |
| 15 | <header className="relative z-50 mx-auto flex w-full max-w-6xl items-center justify-between px-6 py-6"> |
| 16 | <Link href="/" className="flex items-center gap-2" aria-label="briven home"> |
| 17 | <Image src="/icon.svg" alt="" width={40} height={40} priority className="opacity-95" /> |
| 18 | <span className="font-mono tracking-tight text-[var(--color-text)] text-[var(--text-small)]"> |
| 19 | briven |
| 20 | </span> |
| 21 | <span className="hidden font-mono text-[var(--color-text-subtle)] text-[var(--text-xs)] sm:inline"> |
| 22 | · tech |
| 23 | </span> |
| 24 | <span |
| 25 | aria-label="beta v1" |
| 26 | title="briven is in public beta — production-ready, on track for GA later this year" |
| 27 | className="ml-1 inline-flex items-center rounded-[var(--radius-full)] border border-[var(--color-border-primary)] bg-[var(--color-primary-subtle)] px-1.5 py-0.5 font-mono uppercase tracking-wider text-[var(--color-primary)] text-[10px]" |
| 28 | > |
| 29 | beta v1 |
| 30 | </span> |
| 31 | </Link> |
| 32 | |
| 33 | <nav className="flex items-center gap-6 font-mono text-[var(--text-small)]"> |
| 34 | <Link |
| 35 | href="/pricing" |
| 36 | className="text-[var(--color-text-muted)] hover:text-[var(--color-text)]" |
| 37 | > |
| 38 | pricing |
| 39 | </Link> |
| 40 | <Link |
| 41 | href="/compare" |
| 42 | className="hidden text-[var(--color-text-muted)] hover:text-[var(--color-text)] sm:inline" |
| 43 | > |
| 44 | compare |
| 45 | </Link> |
| 46 | <Link |
| 47 | href="/migrate" |
| 48 | className="hidden text-[var(--color-text-muted)] hover:text-[var(--color-text)] sm:inline" |
| 49 | > |
| 50 | migrate |
| 51 | </Link> |
| 52 | <Link |
| 53 | href="https://docs.briven.tech" |
| 54 | className="text-[var(--color-text-muted)] hover:text-[var(--color-text)]" |
| 55 | > |
| 56 | docs |
| 57 | </Link> |
| 58 | {user ? ( |
| 59 | <LandingUserMenu user={user} /> |
| 60 | ) : ( |
| 61 | <Link |
| 62 | href="/signin" |
| 63 | className="text-[var(--color-text-muted)] hover:text-[var(--color-text)]" |
| 64 | > |
| 65 | sign in |
| 66 | </Link> |
| 67 | )} |
| 68 | </nav> |
| 69 | </header> |
| 70 | ); |
| 71 | } |