// Home screen — ported (session S-D): real data via lib/parkhub-data.js. // Deleted per spec §5.1: getParkDetail("Mount Rainier") hardcoded feature, // USER_PROGRESS fabricated stats, decorative fake pin-scatter map, PERSONAS // import from data.jsx (persona list is now inline — small, static, and not // user data, so it stays a constant here rather than another network call). const PERSONAS = { solo: { label: "Solo", sub: "Quiet mornings, long trails" }, family: { label: "Family", sub: "Short hikes, big wow moments" }, glamper: { label: "Glamper", sub: "Canvas tents, chef pairings" }, thruhiker: { label: "Thru-hiker", sub: "Permit windows, resupply" }, }; function PersonaGlyph({ kind }) { const c = 'var(--ink)'; const wrap = (children) => (
{children}
); if (kind === 'solo') return wrap(); if (kind === 'family') return wrap(); if (kind === 'glamper') return wrap(); if (kind === 'thruhiker') return wrap(); return null; } function PersonaDropdown({ persona, setPersona }) { const [open, setOpen] = React.useState(false); const ref = React.useRef(null); React.useEffect(() => { if (!open) return; const onClick = (e) => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); }; document.addEventListener('mousedown', onClick); return () => document.removeEventListener('mousedown', onClick); }, [open]); const current = PERSONAS[persona] || PERSONAS.solo; return (
{open && (
Choose your explorer
{Object.entries(PERSONAS).map(([k, v]) => { const active = k === persona; return ( ); })}
)}
); } function HomeScreen({ go, persona, setPersona, openPark }) { const [loading, setLoading] = React.useState(true); const [parkIndex, setParkIndex] = React.useState([]); const [visits, setVisits] = React.useState([]); const [trips, setTrips] = React.useState([]); const [journalStats, setJournalStats] = React.useState({ entries: 0, photos: 0, parks: 0 }); const [nextTrip, setNextTrip] = React.useState(null); // {trip, park, items} React.useEffect(() => { (async () => { try { const [idx, v, tr, journal] = await Promise.all([ window.PH.getParkIndex(), window.PH.listVisits(), window.PH.listTrips({ status: undefined }), window.PH.listJournal({ limit: 100 }), ]); setParkIndex(idx); setVisits(v); setTrips(tr); const photos = journal.reduce((a, e) => a + (e.photos ? e.photos.length : 0), 0); const parks = new Set(journal.map(e => e.park_slug)).size; setJournalStats({ entries: journal.length, photos, parks }); const active = tr.filter(t => t.status !== 'completed').sort((a, b) => new Date(b.updated_at) - new Date(a.updated_at))[0]; if (active) { const [{ items }, parkData] = await Promise.all([ window.PH.getTrip(active.id), window.PH.getPark(active.park_slug), ]); setNextTrip({ trip: active, items, park: parkData }); } } finally { setLoading(false); } })(); }, []); if (loading) return
Loading your fieldbook…
; const visitedCount = visits.length; const pct = Math.round(visitedCount / 63 * 100); const totals = nextTrip ? window.PH.tripTotals(nextTrip.items) : null; return (
PH
My National Parks
Adventure

Good to see you,
wanderer.

63 · U.S. National Parks · Est. 1872
{/* Passport summary card — real map, real counts (spec §2.5) */}
go('badges')}/>
{/* Next trip — the actual most-recently-updated non-completed trip, or an empty state */} {nextTrip ? ( <>
Items
{nextTrip.items.length}
Trail mi
{totals.miles}
Ascent
{totals.ascent_ft}′
Status
{nextTrip.trip.status}
) : ( <>
Open any park and tap the + on a hike, stay, or gear item to start a trip.
)} {/* Recommended — top parks by real visitation, not a fake "for your persona" list */}
{parkIndex.slice(0, 6).map(p => ( ))}
{/* Journal preview */}
{journalStats.entries} entr{journalStats.entries === 1 ? 'y' : 'ies'} · {journalStats.parks} park{journalStats.parks === 1 ? '' : 's'}
{journalStats.entries === 0 ? "Your first entry is the hardest one. Start after your next hike." : "Keep the streak going — write down what you saw today."}
); } Object.assign(window, { HomeScreen });