User: "quero que o usuário possa escolher o idioma na navbar, e então leia
o site todo em seu idioma."
The locale infrastructure already existed (cookie + getLocale() + every
page renders bilingual). The toggle only lived as a subtle floating
control bottom-left. This surfaces it in the navbars where users expect
it, and confirms whole-site language switching.
locale-toggle-client.tsx
- New variant="navbar": gold-amber pill matching the magazine theme
(PT | EN, active = solid gold). Retro green variant kept for the
floating fallback.
- Guard: clicking the already-active language is a no-op.
- aria-pressed on each button for a11y.
locale-toggle.tsx: LocaleToggle gains variant passthrough.
site-header.tsx: <LocaleToggle variant="navbar"> added to the main nav
(homepage + /sightings /witnesses /objects /locations /operations
/documents).
bureau-nav.tsx: optional `locale` prop renders the same toggle pushed
to the right (ml-auto) on /bureau, /c/[slug], /h/[id], /jobs/[id].
All four callers now pass locale (getLocale added to h + jobs pages).
Cookie-based: switching sets `locale` cookie + router.refresh(); the
server re-renders every component through getLocale(), so the entire
page — headers, hero, summaries, case narratives, entity cards — flips
language in one click. The floating bottom-left toggle stays as a global
fallback for pages without a navbar (/d, /e, /search, /graph).
Also this session: Sun-Tzu smoke succeeded on the refreshed
CLAUDE_CODE_OAUTH_TOKEN — brief B-0001 written for the green fireballs
("bolas de fogo verdes confinadas ao corredor nuclear... cor espectral
e trajetória quase horizontal que os próprios analistas consideraram
irreconciliáveis com meteoros naturais", 3 pillars). Bulk entity
enrichment resumed in the background.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
47 lines
2 KiB
TypeScript
47 lines
2 KiB
TypeScript
/**
|
|
* SiteHeader — top navigation present on the homepage.
|
|
*
|
|
* Magazine-style — clean, with the brand mark left and a slim nav right.
|
|
* Sub-pages use BureauNav (sticky with breadcrumbs) instead.
|
|
*/
|
|
import Link from "next/link";
|
|
import { AuthBar } from "./auth-bar";
|
|
import { LocaleToggle } from "./locale-toggle";
|
|
|
|
export function SiteHeader({ locale }: { locale: "pt-br" | "en" }) {
|
|
return (
|
|
<header className="border-b border-[rgba(224,192,128,0.15)]">
|
|
<div className="mx-auto max-w-7xl px-4 md:px-8 py-4 flex items-center justify-between gap-4 flex-wrap">
|
|
<Link href="/" className="flex items-center gap-2 group">
|
|
<span className="text-[#e0c080] text-lg">▍</span>
|
|
<span className="font-display text-xl text-[#e7ecf3] group-hover:text-[#e0c080] transition-colors">
|
|
The Disclosure Bureau
|
|
</span>
|
|
</Link>
|
|
|
|
<nav className="flex items-center gap-1 text-[12px] font-mono">
|
|
<NavLink href="/sightings" label={locale === "en" ? "Sightings" : "Avistamentos"} />
|
|
<NavLink href="/witnesses" label={locale === "en" ? "Witnesses" : "Testemunhas"} />
|
|
<NavLink href="/objects" label={locale === "en" ? "Craft" : "Objetos"} />
|
|
<NavLink href="/locations" label={locale === "en" ? "Locations" : "Locais"} />
|
|
<NavLink href="/operations" label={locale === "en" ? "Programs" : "Programas"} />
|
|
<NavLink href="/bureau" label={locale === "en" ? "Case files" : "Casos"} />
|
|
<NavLink href="/search" label={locale === "en" ? "Search" : "Busca"} />
|
|
<span className="ml-1"><LocaleToggle current={locale} variant="navbar" /></span>
|
|
<span className="ml-1"><AuthBar /></span>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|
|
|
|
function NavLink({ href, label }: { href: string; label: string }) {
|
|
return (
|
|
<Link
|
|
href={href}
|
|
className="px-2.5 py-1.5 rounded text-[#9aa6b8] hover:text-[#e0c080] hover:bg-[rgba(224,192,128,0.06)] transition-colors"
|
|
>
|
|
{label}
|
|
</Link>
|
|
);
|
|
}
|