/* ============================================================ EBTR — Shared chrome: masthead / nav + footer ============================================================ */ const { ThreeBar: EBThreeBarC } = window.EBTHubDesignSystem_ccdc9d; const EBTR_NAV_SHORT = { "lab-outputs": "Labs", "voices": "Voices", "tools": "Tools", "field-notes": "Field", "agent-stories": "Agents", "briefings": "Briefs" }; function EBTRMasthead({ route, onHome, onCategory, activeCategory, loggedIn, viewer, onSignIn, onSignOut, onApply, onSearch }) { const cats = window.EBTR_DATA.categories; const [scrolled, setScrolled] = React.useState(false); const [acctOpen, setAcctOpen] = React.useState(false); const [burgerOpen, setBurgerOpen] = React.useState(false); React.useEffect(() => { const f = () => setScrolled(window.scrollY > 8); f(); window.addEventListener("scroll", f, { passive: true }); return () => window.removeEventListener("scroll", f); }, []); React.useEffect(() => { if (!acctOpen) return; const c = () => setAcctOpen(false); window.addEventListener("click", c); return () => window.removeEventListener("click", c); }, [acctOpen]); return (
{/* Wordmark — full EBT REVIEW lockup in Michroma */} {/* Category nav — centered between logo and search */} {/* Actions — search · (signed out: sign in + apply / signed in: name + sign out) */}
{loggedIn ? (
e.stopPropagation()}> {acctOpen && (
{viewer.name}
{viewer.email || ""}
{viewer.isStaff ? "EBTHub staff" : "Partner access"}
{viewer.isStaff ? "Full access. Manage your account in Google." : "Reader access to EBTR. Premium papers may need a one-time unlock."}
)}
) : ( )}
{burgerOpen && (
setBurgerOpen(false)} style={{ position: "fixed", inset: 0, zIndex: 90, background: "rgba(8,8,10,0.6)" }}>
e.stopPropagation()} style={{ position: "absolute", top: 0, right: 0, bottom: 0, width: "82%", maxWidth: 320, background: "var(--ebt-ink)", borderLeft: "1px solid var(--border-hairline)", padding: "20px 22px 32px", overflowY: "auto" }}>
Menu
{loggedIn &&
{viewer.name}
}
Topics
{Object.keys(cats).map((k) => ( ))}
{!loggedIn && } {!loggedIn && } {loggedIn && }
)}
); } function EBTRFooter({ onCategory }) { const cats = window.EBTR_DATA.categories; const Col = ({ title, items }) => (
{title}
{items.map((it, i) => ( ))}
); return ( ); } /* ---- Search overlay ---- */ function EBTRSearch({ articles, onOpen, onClose }) { const [q, setQ] = React.useState(""); const cats = window.EBTR_DATA.categories; React.useEffect(() => { const k = (e) => e.key === "Escape" && onClose(); window.addEventListener("keydown", k); return () => window.removeEventListener("keydown", k); }, [onClose]); const term = q.trim().toLowerCase(); const results = !term ? articles.slice(0, 6) : articles.filter((a) => { const hay = (a.title + " " + a.dek + " " + (cats[a.category] ? cats[a.category].label : "") + " " + (a.tags || []).join(" ")).toLowerCase(); return hay.includes(term); }); return (
e.stopPropagation()} style={{ width: "100%", maxWidth: 620, background: "var(--surface-raised)", border: "1px solid var(--border-hairline)", borderTop: "3px solid var(--ebt-orange)" }}>
setQ(e.target.value)} placeholder="Search articles, topics, tags…" style={{ flex: 1, background: "none", border: "none", outline: "none", color: "var(--white)", fontFamily: "var(--font-body)", fontSize: 17 }} />
{!term &&
Latest
} {results.length === 0 &&
No matches for “{q}”.
} {results.map((a) => { const c = cats[a.category]; return ( ); })}
); } Object.assign(window, { EBTRMasthead, EBTRFooter, EBTRSearch });