// Header + announcement bar + Shop mega menu
// ----------------------------------------------------------------------------
// Nav structure from Inga's site notes (2026-06-12):
// Shop (mega menu: Anlass / Geschmackswelten / Getränkearten / Mehr)
// Produzenten · Stories · Über uns
// The mega menu links navigate to the Collection page with a preset filter
// (onNav("collection", { anlass: "Apéro" }) etc.) — so every entry leads to
// a genuinely different place, not just "the shop" (the old complaint).
// Layer 3 (Getränkearten) is derived live from the productTypes present in
// the Shopify catalog — nothing hardcoded, renaming the Produkttyp in
// Shopify renames the menu entry.
function Header({ onNav, view, cartCount, cartBump, onCartOpen, onMenu, onSearch, onAccount }) {
const [megaOpen, setMegaOpen] = useState(false);
const closeTimer = useRef(null);
// Hover-intent: opening is instant, closing is delayed ~160ms so the
// cursor can travel from the nav item into the panel without it closing.
const openMega = () => { clearTimeout(closeTimer.current); setMegaOpen(true); };
const closeMega = () => {
clearTimeout(closeTimer.current);
closeTimer.current = setTimeout(() => setMegaOpen(false), 160);
};
useEffect(() => () => clearTimeout(closeTimer.current), []);
// Close on Escape for keyboard users.
useEffect(() => {
if (!megaOpen) return;
const onKey = (e) => { if (e.key === "Escape") setMegaOpen(false); };
document.addEventListener("keydown", onKey);
return () => document.removeEventListener("keydown", onKey);
}, [megaOpen]);
const go = (v, opts) => { setMegaOpen(false); onNav(v, opts); };
// Layer 3: live from the catalog. Sorted, deduped, "Sets" pushed last.
const drinkTypes = Array.from(new Set((window.PRODUCTS || []).map((p) => p.category).filter(Boolean)))
.sort((a, b) => (a === "Sets") - (b === "Sets") || a.localeCompare(b, "de"));
const link = (id, label) => (
go(id)}>{label}
);
return (