/* ============================================================ 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", "digital-employee": "Stefi" }; function EBTRMasthead({ route, onHome, onCategory, activeCategory, loggedIn, viewer, onSignIn, onSignOut, onApply, onRequestAccess, 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) */}
Write for us {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 open to Lab contributors and partner companies."}
{viewer.isStaff && Manage Google account →} {!viewer.isStaff && onRequestAccess && } Contact membership →
)}
) : ( )}
{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) => ( ))}
setBurgerOpen(false)} style={{ display: "inline-flex", alignItems: "center", justifyContent: "space-between", width: "100%", boxSizing: "border-box", background: "none", border: "1px solid var(--ebt-orange)", padding: "14px 16px", cursor: "pointer", fontFamily: "var(--font-ui)", fontSize: 12, letterSpacing: "0.1em", textTransform: "uppercase", color: "var(--ebt-orange)", textDecoration: "none" }}>Write for us {!loggedIn && } {!loggedIn && } {loggedIn && }
)}
); } function EBTRNewsletter() { const [email, setEmail] = React.useState(""); const [consent, setConsent] = React.useState(false); const [done, setDone] = React.useState(false); const [err, setErr] = React.useState(""); const submit = () => { if (!/.+@.+\..+/.test(email)) { setErr("Enter a valid email."); return; } if (!consent) { setErr("Please tick the consent box."); return; } setErr(""); const p = window.EBTR_SAVE_SUBSCRIBER ? window.EBTR_SAVE_SUBSCRIBER({ email: email, consent: true, source: "review-footer" }) : Promise.resolve(); p.then(() => setDone(true)).catch(() => setDone(true)); }; return (
The Review Newsletter

Don't miss the next Lab finding.

The “what you missed” digest, the full archive, and early access to new tools and field notes — first to know. Free, opt out anytime. This is a newsletter sign-up, not membership.

{done ? (
You're on the list.

We'll send the next digest to your inbox. You can unsubscribe anytime.

) : (
setEmail(e.target.value)} placeholder="you@work.com" style={{ fontFamily: "var(--font-body)", fontSize: 15, color: "var(--white)", background: "var(--neutral-900)", border: "1px solid var(--border-strong)", borderRadius: "var(--radius-sm)", padding: "13px 14px", outline: "none", width: "100%" }} /> {err &&
{err}
}
)}
); } 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 });