// screens.jsx — all app screens const fav = PRODUCTS.filter(p => ['cafe-leche', 'sandwich', 'medialunas', 'cheesecake', 'cafe-llevar', 'limonada'].includes(p.id)); // ── Quick-access tile ────────────────────────────── function QuickTile({ icon, label, sub, tone, onClick }) { return ( ); } // ── HOME ──────────────────────────────────────────── function HomeScreen() { const { t, lang } = useLang(); const { go } = useNav(); return (
{/* hero */}
{t.tagline}

{t.heroSub}

{/* quick access */}
{t.quick}
go('menu')} /> go('combos')} /> go('esquel')} /> go('place')} />
{/* featured rail */}
{fav.map(p => )}
{/* tourism teaser */}
); } // ── MENU ──────────────────────────────────────────── function MenuScreen() { const { t, lang } = useLang(); const { go } = useNav(); const [active, setActive] = React.useState('cafe'); const refs = React.useRef({}); const onChip = (id) => { setActive(id); const el = refs.current[id]; if (el) el.scrollIntoView({ block: 'start', behavior: 'smooth' }); }; return (
{/* sticky category chips */}
{CATEGORIES.map(c => ( ))}
{/* combos promo */} {CATEGORIES.map(c => (
refs.current[c.id] = el} style={{ scrollMarginTop: 64, marginBottom: 22 }}>

{lang === 'en' ? c.en : c.label}

{PRODUCTS.filter(p => p.cat === c.id).map(p => )}
))}
); } // ── COMBOS ────────────────────────────────────────── function CombosScreen() { const { t, lang } = useLang(); return (
{COMBOS.map(c => )}

{lang === 'en' ? 'Combos can be customized at the counter.' : 'Los combos se pueden ajustar en el mostrador.'}

); } // ── recommendation chip (for Esquel) ─────────────── function RecItem({ id }) { const p = productById(id); const cart = useCart(); const { lang } = useLang(); if (!p) return null; return (
{lang === 'en' && p.en ? p.en : p.name}
); } // ── ESQUEL (tourism → products) ───────────────────── function EsquelScreen() { const { t, lang } = useLang(); const cart = useCart(); return (
{ACTIVITIES.map(a => (
{a.meta}
{lang === 'en' ? a.en : a.name}

{a.blurb}

{t.forTheRoad}
{a.recs.map(id => )}
{a.comboId && (() => { const c = COMBOS.find(x => x.id === a.comboId); return ( ); })()}
))}
); } // ── PLACE (location & hours) ──────────────────────── function PlaceScreen() { const { t, lang } = useLang(); const { go } = useNav(); return (
{/* map placeholder */}
Terminal de Ómnibus de Esquel
{lang === 'en' ? 'Ground floor · across from platforms 4–7.' : 'Planta baja · frente a las plataformas 4 a 7.'}
{/* hours */}

{t.hoursTitle}

{HOURS.map((r, i) => (
{r.d} {r.h}
))}
{/* contact buttons */}

{lang === 'en' ? 'Order from the app and pick it up at the counter — skip the wait before your bus.' : 'Pedí desde la app y retirá en el mostrador, sin perder tiempo antes de tu colectivo.'}

); } // ── CART ──────────────────────────────────────────── function CartScreen() { const { t, lang } = useLang(); const cart = useCart(); const { go } = useNav(); const [name, setName] = React.useState(''); if (cart.count === 0) { return (

{t.empty}

{t.emptySub}

); } return (
{cart.lines.map(({ id, qty }) => { const p = productById(id); return (
{lang === 'en' && p.en ? p.en : p.name}
{fmt(p.price * qty)}
); })}
{/* pickup + name */}
{t.pickup}
setName(e.target.value)} placeholder={t.namePh} style={{ width: '100%', marginTop: 6, padding: '12px 14px', borderRadius: 'var(--r-sm)', border: '1px solid var(--c-line)', background: 'var(--c-bg)', fontSize: 14, fontFamily: 'var(--font-body)', color: 'var(--c-ink)', outline: 'none' }} />
{t.total} · {cart.count} {cart.count === 1 ? t.item : t.items} {fmt(cart.total)}
); } // ── CONFIRM ───────────────────────────────────────── function ConfirmScreen() { const { t } = useLang(); const cart = useCart(); const { go } = useNav(); const num = React.useMemo(() => 'Z-' + (10 + Math.floor(Math.random() * 89)), []); React.useEffect(() => () => {}, []); return (

{t.done}

{t.doneSub}

{t.order} {num}
); } Object.assign(window, { HomeScreen, MenuScreen, CombosScreen, EsquelScreen, PlaceScreen, CartScreen, ConfirmScreen, });