[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_159":160,"_161":162},"routes/_app.x.$handle.$name",{"_101":100,"_34":47,"_110":91,"_28":38,"_13":14,"_111":-5,"_11":112,"_113":114,"_115":116,"_117":118,"_119":120,"_20":-5,"_121":-5,"_122":-5,"_123":27,"_124":125,"_126":27,"_127":-5,"_128":-5,"_129":130},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_45":46,"_34":47,"_40":48,"_49":-5,"_50":27,"_51":52,"_53":52,"_54":55,"_56":-5,"_18":57,"_58":59,"_60":25,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":72,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":84,"_85":86,"_87":88,"_89":27},"version",2,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":31},"file",{"_32":33,"_34":29,"_35":36,"_37":39,"_40":41,"_42":14,"_43":44,"_24":27},"previous",{"_32":33,"_34":29,"_35":36,"_37":38},"deleted",true,"deletedHere",false,"path","main.ts","latestPath","frontend/main.tsx","fileId","e786da84-9ca2-11f1-8b1f-1607ee4eb77e","name","fileType","script","content","","import React, { useState, useEffect, useCallback, useMemo } from \"react\";\nimport { Ticket, Users, MapPin, Clock, Plus, X, Check, Info, Radio, Globe, Music2, AlertTriangle, Youtube, Headphones, CalendarPlus } from \"lucide-react\";\n\n// ---- Seed data: Baybeats 2026, 3–6 Sep, Esplanade – Theatres on the Bay ----\n// Times marked TBC weren't published in the preview programme — edit them once confirmed.\nconst SEED_ACTS = [\n // THU 3 SEP\n { id: \"t1\", day: \"THU\", date: \"3 Sep\", stage: \"LiveWire\", time: \"7:30 PM\", act: \"Cancer Game\", genre: \"Metalcore\", origin: \"Macau\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"t2\", day: \"THU\", date: \"3 Sep\", stage: \"LiveWire\", time: \"9:00 PM\", act: \"HYPER SLASH\", genre: \"\\u201cDopamine rock\\u201d (screamo/electronic-core/punk)\", origin: \"China\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"t3\", day: \"THU\", date: \"3 Sep\", stage: \"LiveWire\", time: \"10:30 PM\", act: \"Bilderbuch\", genre: \"Rock, pop, disco, psychedelia\", origin: \"Austria\", duration: \"Closing set, ~60 min (est.)\", ticket: \"walkin\" },\n { id: \"t4\", day: \"THU\", date: \"3 Sep\", stage: \"Arena\", time: \"7:15 PM\", act: \"Soggy Jeans\", genre: \"Indie-emo\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"t5\", day: \"THU\", date: \"3 Sep\", stage: \"Arena\", time: \"TBC\", act: \"enec.e\", genre: \"Shoegaze, indie folk, dream pop\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"t6\", day: \"THU\", date: \"3 Sep\", stage: \"Arena\", time: \"10:00 PM\", act: \"Soft Pine\", genre: \"Psychedelic rock, indie pop\", origin: \"Thailand (Bangkok)\", duration: \"Closing set, ~50 min (est.)\", ticket: \"walkin\" },\n { id: \"t7\", day: \"THU\", date: \"3 Sep\", stage: \"Chillout\", time: \"TBC\", act: \"kin\", genre: \"Pop-punk (acoustic set)\", origin: \"Singapore\", duration: \"Acoustic set, ~30 min (est.)\", ticket: \"walkin\" },\n\n // FRI 4 SEP\n { id: \"f1\", day: \"FRI\", date: \"4 Sep\", stage: \"Powerhouse²\", time: \"7:30 PM\", act: \"the cabs\", genre: \"Post-rock, math rock\", origin: \"Japan\", duration: \"~50 min (est.)\", ticket: \"reg\" },\n { id: \"f2\", day: \"FRI\", date: \"4 Sep\", stage: \"Powerhouse²\", time: \"9:15 PM\", act: \"The Observatory\", genre: \"Post-punk, free improvisation, experimental electronics\", origin: \"Singapore\", duration: \"~50 min (est.)\", ticket: \"reg\" },\n { id: \"f3\", day: \"FRI\", date: \"4 Sep\", stage: \"Powerhouse²\", time: \"11:00 PM\", act: \"Naedr & the Midheaven String Collective\", genre: \"Screamo + strings (commissioned collab)\", origin: \"Singapore\", duration: \"Special commission, ~45 min (est.)\", ticket: \"reg\" },\n { id: \"f4\", day: \"FRI\", date: \"4 Sep\", stage: \"Annexe\", time: \"7:15 PM\", act: \"Pretty Girls Cry\", genre: \"Garage rock, emo, math rock\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"reg\" },\n { id: \"f5\", day: \"FRI\", date: \"4 Sep\", stage: \"Annexe\", time: \"TBC\", act: \"Yangbans\", genre: \"Rock, jazz, funk, hip-hop, R&B, gospel\", origin: \"South Korea\", duration: \"~45 min (est.)\", ticket: \"reg\" },\n { id: \"f6\", day: \"FRI\", date: \"4 Sep\", stage: \"Annexe\", time: \"10:30 PM\", act: \"TOOLS OF THE TRADE\", genre: \"Grindcore\", origin: \"Malaysia\", duration: \"Closing set, ~40 min (est.)\", ticket: \"reg\" },\n { id: \"f7\", day: \"FRI\", date: \"4 Sep\", stage: \"LiveWire\", time: \"7:00 PM\", act: \"FUSE\", genre: \"Rock (TBC)\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"f8\", day: \"FRI\", date: \"4 Sep\", stage: \"LiveWire\", time: \"8:45 PM\", act: \"Perunggu\", genre: \"Rock (TBC)\", origin: \"Indonesia\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"f9\", day: \"FRI\", date: \"4 Sep\", stage: \"LiveWire\", time: \"10:30 PM\", act: \"Coaltar of the Deepers\", genre: \"Shoegaze, rock, metal, techno\", origin: \"Japan\", duration: \"Closing set, ~60 min (est.)\", ticket: \"walkin\" },\n { id: \"f10\", day: \"FRI\", date: \"4 Sep\", stage: \"Chillout\", time: \"6:00 PM\", act: \"Kin Leonn\", genre: \"Ambient\", origin: \"Singapore\", duration: \"Ambient set, ~40 min (est.)\", ticket: \"walkin\" },\n { id: \"f11\", day: \"FRI\", date: \"4 Sep\", stage: \"Chillout\", time: \"TBC\", act: \"HOA\", genre: \"Rock (soaring, nostalgic)\", origin: \"South Korea\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n\n // SAT 5 SEP\n { id: \"s1\", day: \"SAT\", date: \"5 Sep\", stage: \"Powerhouse²\", time: \"TBC\", act: \"DAVID BORING\", genre: \"Punk, dissonance\", origin: \"Hong Kong\", duration: \"~40 min (est.)\", ticket: \"reg\" },\n { id: \"s2\", day: \"SAT\", date: \"5 Sep\", stage: \"Powerhouse²\", time: \"TBC\", act: \"Disco Hue\", genre: \"Synth-pop\", origin: \"Singapore\", duration: \"Closing set, ~50 min (est.)\", ticket: \"reg\" },\n { id: \"s3\", day: \"SAT\", date: \"5 Sep\", stage: \"LiveWire\", time: \"6:45 PM\", act: \"Sweetass\", genre: \"Fuzz rock\", origin: \"Malaysia\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"s4\", day: \"SAT\", date: \"5 Sep\", stage: \"LiveWire\", time: \"8:30 PM\", act: \"Typecast\", genre: \"Alternative rock\", origin: \"Philippines\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"s5\", day: \"SAT\", date: \"5 Sep\", stage: \"LiveWire\", time: \"10:15 PM\", act: \"THE SIGIT\", genre: \"Rock\", origin: \"Indonesia (Bandung)\", duration: \"Closing set, ~60 min (est.)\", ticket: \"walkin\" },\n { id: \"s6\", day: \"SAT\", date: \"5 Sep\", stage: \"Annexe\", time: \"TBC\", act: \"Jhen Yue Tang\", genre: \"Taiwanese folk, Beiguan music, rap, rock, electronic\", origin: \"Taiwan\", duration: \"Ritual performance, ~45 min (est.)\", ticket: \"reg\" },\n { id: \"s7\", day: \"SAT\", date: \"5 Sep\", stage: \"Annexe\", time: \"TBC\", act: \"Rắn Cạp Đuôi Collective\", genre: \"Experimental\", origin: \"Vietnam\", duration: \"~60 min (confirmed \\u2013 \\\"an hour\\\")\", ticket: \"reg\" },\n { id: \"s8\", day: \"SAT\", date: \"5 Sep\", stage: \"Annexe\", time: \"TBC\", act: \"T-REX\", genre: \"Math rock, jazz fusion, prog, metal\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"reg\" },\n { id: \"s9\", day: \"SAT\", date: \"5 Sep\", stage: \"Arena\", time: \"7:15 PM\", act: \"Mediocre Haircut Crew\", genre: \"Hip-hop\", origin: \"Singapore\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"s10\", day: \"SAT\", date: \"5 Sep\", stage: \"Arena\", time: \"TBC\", act: \"Bugs of Phonon\", genre: \"Electronic-infused post-rock\", origin: \"Taiwan\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"s11\", day: \"SAT\", date: \"5 Sep\", stage: \"Black Room\", time: \"3:00–10:00 PM\", act: \"G.A.S. Attack: Durian Edition (gear market)\", genre: \"Gear market, not a live set\", origin: \"\\u2014\", duration: \"Runs all afternoon/evening\", ticket: \"walkin\" },\n\n // SUN 6 SEP\n { id: \"u1\", day: \"SUN\", date: \"6 Sep\", stage: \"Powerhouse²\", time: \"TBC\", act: \"Srirajah Rockers\", genre: \"Roots reggae, lovers rock, mento ska, funk, soul\", origin: \"Thailand\", duration: \"~40 min (est.)\", ticket: \"reg\" },\n { id: \"u2\", day: \"SUN\", date: \"6 Sep\", stage: \"Powerhouse²\", time: \"7:30 PM\", act: \"Subsonic Eye\", genre: \"Indie rock\", origin: \"Singapore\", duration: \"~45 min (est.)\", ticket: \"reg\" },\n { id: \"u3\", day: \"SUN\", date: \"6 Sep\", stage: \"Powerhouse²\", time: \"9:15 PM\", act: \"Boris\", genre: \"Sludge, noise, shoegaze, psychedelia\", origin: \"Japan\", duration: \"Closing set, ~60 min (est.)\", ticket: \"reg\" },\n { id: \"u4\", day: \"SUN\", date: \"6 Sep\", stage: \"LiveWire\", time: \"6:45 PM\", act: \"Bhayanak Maut\", genre: \"Metal\", origin: \"India\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"u5\", day: \"SUN\", date: \"6 Sep\", stage: \"LiveWire\", time: \"TBC\", act: \"Dabda\", genre: \"Math rock\", origin: \"South Korea\", duration: \"~40 min (est.)\", ticket: \"walkin\" },\n { id: \"u6\", day: \"SUN\", date: \"6 Sep\", stage: \"LiveWire\", time: \"10:15 PM\", act: \"Tiramisu feat. The Hype Goblins\", genre: \"Art rock\", origin: \"Singapore\", duration: \"Closing set, ~60 min (est.)\", ticket: \"walkin\" },\n { id: \"u7\", day: \"SUN\", date: \"6 Sep\", stage: \"Arena\", time: \"9:00 PM\", act: \"Solitude Is Bliss\", genre: \"Psychedelic, shoegaze-tinged alt-rock\", origin: \"Thailand\", duration: \"~45 min (est.)\", ticket: \"walkin\" },\n { id: \"u8\", day: \"SUN\", date: \"6 Sep\", stage: \"Arena\", time: \"10:45 PM\", act: \"Treaks\", genre: \"Techno, noise, post-punk\", origin: \"France\", duration: \"Closing set, ~45 min (est.)\", ticket: \"walkin\" },\n { id: \"u9\", day: \"SUN\", date: \"6 Sep\", stage: \"Chillout\", time: \"6:00 PM\", act: \"T.HIRST (slot 1)\", genre: \"Emo, punk, bass music/electronic\", origin: \"Singapore\", duration: \"30 min (confirmed)\", ticket: \"walkin\" },\n { id: \"u10\", day: \"SUN\", date: \"6 Sep\", stage: \"Chillout\", time: \"8:00 PM\", act: \"T.HIRST (slot 2)\", genre: \"Emo, punk, bass music/electronic\", origin: \"Singapore\", duration: \"30 min (confirmed)\", ticket: \"walkin\" },\n { id: \"u11\", day: \"SUN\", date: \"6 Sep\", stage: \"Black Room\", time: \"3:00–10:00 PM\", act: \"G.A.S. Attack: Durian Edition (gear market)\", genre: \"Gear market, not a live set\", origin: \"\\u2014\", duration: \"Runs all afternoon/evening\", ticket: \"walkin\" },\n];\n\nconst DAYS = [\n { key: \"THU\", label: \"Thu\", date: \"3 Sep\" },\n { key: \"FRI\", label: \"Fri\", date: \"4 Sep\" },\n { key: \"SAT\", label: \"Sat\", date: \"5 Sep\" },\n { key: \"SUN\", label: \"Sun\", date: \"6 Sep\" },\n];\n\nconst TICKET_META = {\n walkin: { label: \"Free \\u00b7 walk in\", color: \"#3fe0c9\" },\n reg: { label: \"Free \\u00b7 registration\", color: \"#ffb84d\" },\n ticketed: { label: \"Ticketed \\u00b7 SISTIC\", color: \"#ff5d6c\" },\n unsure: { label: \"Not sure yet\", color: \"#9691a3\" },\n};\n\nconst STAGE_COLORS = {\n \"LiveWire\": \"#ff5d6c\",\n \"Arena\": \"#ffb84d\",\n \"Chillout\": \"#3fe0c9\",\n \"Powerhouse²\": \"#c792ff\",\n \"Annexe\": \"#d4ff3f\",\n \"Black Room\": \"#9691a3\",\n};\n\nconst STORAGE_KEY = \"baybeats2026-tracker-v1\";\nconst DEFAULT_CREW = [\"Friend 1\", \"Friend 2\", \"Friend 3\"];\n\n// Uses Claude's built-in shared window.storage when this runs as a Claude artifact (crew members\n// sharing the artifact link see the same live data). Outside that environment — e.g. running this\n// on CodeSandbox — window.storage won't exist, so this falls back to localStorage: the tracker still\n// works and persists per-browser, it just won't auto-sync between different people's tabs.\nasync function storageGet(key, shared) {\n if (typeof window !== \"undefined\" && window.storage && typeof window.storage.get === \"function\") {\n return window.storage.get(key, shared);\n }\n try {\n const raw = window.localStorage.getItem(key);\n return raw ? { key, value: raw, shared } : null;\n } catch (e) {\n return null;\n }\n}\n\nasync function storageSet(key, value, shared) {\n if (typeof window !== \"undefined\" && window.storage && typeof window.storage.set === \"function\") {\n return window.storage.set(key, value, shared);\n }\n try {\n window.localStorage.setItem(key, value);\n return { key, value, shared };\n } catch (e) {\n return null;\n }\n}\n\n// Turns a seed \"date\" like \"3 Sep\" plus a minutes-from-midnight offset into a JS Date\n// (year is fixed to the 2026 festival run). Handles offsets past 1440 (i.e. past midnight).\nfunction actDateTime(dateStr, minutesOfDay) {\n const monthMap = { Jan: 0, Feb: 1, Mar: 2, Apr: 3, May: 4, Jun: 5, Jul: 6, Aug: 7, Sep: 8, Oct: 9, Nov: 10, Dec: 11 };\n const [dayStr, monStr] = (dateStr || \"3 Sep\").split(\" \");\n const day = parseInt(dayStr, 10) + Math.floor(minutesOfDay / 1440);\n const h = Math.floor(minutesOfDay / 60) % 24;\n const m = minutesOfDay % 60;\n return new Date(2026, monthMap[monStr] ?? 8, day, h, m, 0);\n}\n\nfunction pad2(n) {\n return String(n).padStart(2, \"0\");\n}\n\n// Local (floating, Singapore) datetime formatted for both Google Calendar's `dates` param\n// and an .ics VEVENT: YYYYMMDDTHHMMSS\nfunction toCalString(d) {\n return `${d.getFullYear()}${pad2(d.getMonth() + 1)}${pad2(d.getDate())}T${pad2(d.getHours())}${pad2(d.getMinutes())}00`;\n}\n\nfunction buildGoogleCalUrl(act) {\n const interval = getInterval(act);\n if (!interval) return null;\n const start = actDateTime(act.date, interval.start);\n const end = actDateTime(act.date, interval.end);\n const params = new URLSearchParams({\n action: \"TEMPLATE\",\n text: `${act.act} \\u2013 Baybeats 2026`,\n dates: `${toCalString(start)}/${toCalString(end)}`,\n details: [act.genre, act.origin].filter(Boolean).join(\" \\u00b7 \"),\n location: `${act.stage}, Esplanade \\u2013 Theatres on the Bay, Singapore`,\n ctz: \"Asia/Singapore\",\n });\n return `https://calendar.google.com/calendar/render?${params.toString()}`;\n}\n\nfunction buildICS(act) {\n const interval = getInterval(act);\n if (!interval) return null;\n const start = actDateTime(act.date, interval.start);\n const end = actDateTime(act.date, interval.end);\n const now = new Date();\n const desc = [act.genre, act.origin].filter(Boolean).join(\" \\\\, \");\n const lines = [\n \"BEGIN:VCALENDAR\",\n \"VERSION:2.0\",\n \"PRODID:-//Baybeats 2026 Tracker//EN\",\n \"BEGIN:VEVENT\",\n `UID:${act.id}-baybeats2026@tracker`,\n `DTSTAMP:${toCalString(now)}`,\n `DTSTART:${toCalString(start)}`,\n `DTEND:${toCalString(end)}`,\n `SUMMARY:${act.act} \\u2013 Baybeats 2026`,\n `LOCATION:${act.stage}\\\\, Esplanade \\u2013 Theatres on the Bay\\\\, Singapore`,\n `DESCRIPTION:${desc}`,\n \"END:VEVENT\",\n \"END:VCALENDAR\",\n ];\n return lines.join(\"\\r\\n\");\n}\n\nfunction downloadICS(act) {\n const ics = buildICS(act);\n if (!ics) return;\n const blob = new Blob([ics], { type: \"text/calendar;charset=utf-8\" });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = `${act.act.replace(/[^\\w\\- ]/g, \"\").trim() || \"baybeats-act\"}.ics`;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n setTimeout(() => URL.revokeObjectURL(url), 2000);\n}\n\nfunction uid() {\n return Math.random().toString(36).slice(2, 9);\n}\n\n// Strips trailing parentheticals like \"(slot 1)\" or \"(gear market)\" so search queries\n// target the artist name itself rather than festival-specific labelling.\nfunction searchableName(act) {\n return act.replace(/\\s*\$[^)]*\$\\s*$/, \"\").trim();\n}\n\n// Parses strings like \"7:30 PM\" or a range \"3:00\\u201310:00 PM\" (uses start time).\n// Unparseable / \"TBC\" values sort to the end of the day.\nfunction parseTimeToMinutes(raw) {\n if (!raw) return Infinity;\n const first = raw.split(/[\\u2013\\u2014-]/)[0].trim(); // take start of a range\n const match = first.match(/(\\d{1,2}):(\\d{2})\\s*(AM|PM)?/i);\n if (!match) return Infinity;\n let [, h, m, ampm] = match;\n h = parseInt(h, 10);\n m = parseInt(m, 10);\n ampm = (ampm || \"PM\").toUpperCase(); // festival sets are virtually all PM\n if (ampm === \"PM\" && h !== 12) h += 12;\n if (ampm === \"AM\" && h === 12) h = 0;\n return h * 60 + m;\n}\n\n// Pulls the first number out of a duration string like \"~45 min (est.)\" or \"30 min (confirmed)\".\nfunction parseDurationMinutes(raw) {\n if (!raw) return null;\n const match = raw.match(/(\\d+)\\s*min/i);\n return match ? parseInt(match[1], 10) : null;\n}\n\n// Returns {start, end} in minutes-from-midnight for an act, or null if it can't be determined\n// (e.g. time is still TBC). Handles explicit ranges like \"3:00\\u201310:00 PM\" (the gear market)\n// as well as a single start time + estimated/confirmed duration.\nfunction getInterval(act) {\n const parts = (act.time || \"\").split(/[\\u2013\\u2014-]/).map((s) => s.trim());\n const start = parseTimeToMinutes(act.time);\n if (start === Infinity) return null;\n if (parts.length === 2 && /\\d/.test(parts[1])) {\n const end = parseTimeToMinutes(parts[1]);\n if (end !== Infinity) return { start, end: end > start ? end : end + 24 * 60 };\n }\n const dur = parseDurationMinutes(act.duration);\n if (dur == null) return null;\n return { start, end: start + dur };\n}\n\nexport default function BaybeatsTracker() {\n const [crew, setCrew] = useState(DEFAULT_CREW);\n const [acts, setActs] = useState(SEED_ACTS);\n const [activeDay, setActiveDay] = useState(\"THU\");\n const [loaded, setLoaded] = useState(false);\n const [saveState, setSaveState] = useState(\"idle\"); // idle | saving | saved | error\n const [showInfo, setShowInfo] = useState(false);\n const [showSummary, setShowSummary] = useState(true);\n\n // ---- load from shared storage ----\n useEffect(() => {\n (async () => {\n try {\n const res = await storageGet(STORAGE_KEY, true);\n if (res && res.value) {\n const parsed = JSON.parse(res.value);\n if (parsed.crew) setCrew(parsed.crew);\n if (parsed.acts) {\n // migrate any pre-existing ticketHolders arrays (boolean) into ticketQty maps (counts)\n const migrated = parsed.acts.map((a) => {\n if (a.ticketQty) return a;\n const qty = {};\n (a.ticketHolders || []).forEach((n) => {\n qty[n] = 1;\n });\n const { ticketHolders, ...rest } = a;\n return { ...rest, ticketQty: qty };\n });\n setActs(migrated);\n }\n }\n } catch (e) {\n // no existing data yet — seed defaults will be used\n } finally {\n setLoaded(true);\n }\n })();\n }, []);\n\n // ---- persist to shared storage (debounced) ----\n const persist = useCallback((nextCrew, nextActs) => {\n setSaveState(\"saving\");\n const payload = JSON.stringify({ crew: nextCrew, acts: nextActs });\n storageSet(STORAGE_KEY, payload, true)\n .then((r) => setSaveState(r ? \"saved\" : \"error\"))\n .catch(() => setSaveState(\"error\"));\n }, []);\n\n useEffect(() => {\n if (!loaded) return;\n const t = setTimeout(() => persist(crew, acts), 400);\n return () => clearTimeout(t);\n }, [crew, acts, loaded, persist]);\n\n const updateAct = (id, patch) => {\n setActs((prev) => prev.map((a) => (a.id === id ? { ...a, ...patch } : a)));\n };\n\n const toggleInterested = (id, name) => {\n setActs((prev) =>\n prev.map((a) => {\n if (a.id !== id) return a;\n const list = a.interested || [];\n const has = list.includes(name);\n return { ...a, interested: has ? list.filter((n) => n !== name) : [...list, name] };\n })\n );\n };\n\n // Bumps how many tickets `name` booked for act `id` by `delta`, floored at 0.\n const bumpTicketQty = (id, name, delta) => {\n setActs((prev) =>\n prev.map((a) => {\n if (a.id !== id) return a;\n const qty = { ...(a.ticketQty || {}) };\n const next = Math.max(0, (qty[name] || 0) + delta);\n if (next === 0) delete qty[name];\n else qty[name] = next;\n return { ...a, ticketQty: qty };\n })\n );\n };\n\n const addAct = () => {\n const day = DAYS.find((d) => d.key === activeDay);\n setActs((prev) => [\n ...prev,\n {\n id: uid(),\n day: activeDay,\n date: day.date,\n stage: \"LiveWire\",\n time: \"TBC\",\n act: \"New act\",\n genre: \"\",\n origin: \"\",\n duration: \"~45 min (est.)\",\n ticket: \"unsure\",\n ticketQty: {},\n interested: [],\n },\n ]);\n };\n\n const removeAct = (id) => setActs((prev) => prev.filter((a) => a.id !== id));\n\n const renameCrew = (idx, value) => {\n const old = crew[idx];\n const next = [...crew];\n next[idx] = value;\n setCrew(next);\n // keep name references in act lists / ticket counts in sync\n setActs((prev) =>\n prev.map((a) => {\n const qty = a.ticketQty || {};\n const renamedQty = { ...qty };\n if (old in renamedQty) {\n renamedQty[value] = renamedQty[old];\n delete renamedQty[old];\n }\n return {\n ...a,\n ticketQty: renamedQty,\n interested: (a.interested || []).map((n) => (n === old ? value : n)),\n };\n })\n );\n };\n\n const dayActs = useMemo(\n () =>\n acts\n .filter((a) => a.day === activeDay)\n .sort((a, b) => {\n const timeDiff = parseTimeToMinutes(a.time) - parseTimeToMinutes(b.time);\n if (timeDiff !== 0) return timeDiff;\n return (a.stage || \"\").localeCompare(b.stage || \"\");\n }),\n [acts, activeDay]\n );\n\n // Maps act id -> array of other acts (on the same day) whose sets overlap in time,\n // based on start time + duration. Acts with an unparseable/TBC time or duration are skipped.\n const overlapMap = useMemo(() => {\n const withIntervals = dayActs\n .map((a) => ({ act: a, interval: getInterval(a) }))\n .filter((x) => x.interval);\n const map = {};\n for (let i = 0; i < withIntervals.length; i++) {\n for (let j = i + 1; j < withIntervals.length; j++) {\n const A = withIntervals[i];\n const B = withIntervals[j];\n if (A.act.stage === B.act.stage) continue; // same-stage acts are already sequential, not a clash\n const overlaps = A.interval.start < B.interval.end && B.interval.start < A.interval.end;\n if (overlaps) {\n (map[A.act.id] = map[A.act.id] || []).push(B.act);\n (map[B.act.id] = map[B.act.id] || []).push(A.act);\n }\n }\n }\n return map;\n }, [dayActs]);\n\n // Cross-day overview per crew member: every act where they hold a ticket and/or are down\n // to join, sorted chronologically across all four days (not just the active day tab).\n const summaryByPerson = useMemo(() => {\n const dayIndex = Object.fromEntries(DAYS.map((d, i) => [d.key, i]));\n const sortKey = (a) => {\n const t = parseTimeToMinutes(a.time);\n return (dayIndex[a.day] ?? 9) * 10000 + (t === Infinity ? 9999 : t);\n };\n const result = {};\n crew.forEach((name) => {\n result[name] = acts\n .filter((a) => (a.ticketQty && a.ticketQty[name] > 0) || (a.interested || []).includes(name))\n .map((a) => ({ ...a, qty: (a.ticketQty && a.ticketQty[name]) || 0, joining: (a.interested || []).includes(name) }))\n .sort((a, b) => sortKey(a) - sortKey(b));\n });\n return result;\n }, [acts, crew]);\n\n const dayCount = (key) => acts.filter((a) => a.day === key).length;\n\n return (\n \n \n\n {/* Header */}\n

\n 25TH EDITION · ESPLANADE\n

\n BAYBEATS 2026\n

\n 3–6 SEP · THEATRES ON THE BAY\n

\n setShowInfo((v) => !v)}\n className=\"shrink-0 rounded-full p-2\"\n style={{ background: \"var(--panel)\", border: \"1px solid var(--line)\" }}\n aria-label=\"About this tracker\"\n >\n \n \n

\n\n {showInfo && (\n \n This tracker is shared — anyone with the link sees the same live data. Tap a crew name under\n an act to mark who's holding a ticket or who wants to join. Times marked TBC weren't in the\n preview lineup announcement — edit them once the full esplanade.com/baybeats programme confirms.\n Outdoor stages (LiveWire, Arena, Chillout) are free walk-in; Annexe & Powerhouse² are free\n but need registration, and a few may be ticketed via SISTIC — check the ticket tag per act.\n Acts outlined in orange, with a \"Clashes with…\" note, overlap in time with a set on another\n stage based on start time + duration — useful for spotting which acts you'll have to pick between.\n Each act also has \"Preview on YouTube / Spotify\" — these open a search for that band on each\n platform so you can scout their past songs before deciding who to catch live.\n \"Google Calendar\" opens a pre-filled event to save straight to Gmail's calendar; \"Apple Calendar\"\n downloads a .ics file you can open on iPhone/Mac to add it there. Both use each act's time,\n duration and stage automatically — acts still marked TBC need a confirmed time first.\n

\n )}\n\n {/* crew names */}\n

\n \n {crew.map((name, idx) => (\n renameCrew(idx, e.target.value)}\n className=\"bb-mono text-xs px-2 py-1 rounded outline-none\"\n style={{ background: \"var(--panel)\", border: \"1px solid var(--line)\", color: \"var(--text)\", width: \"80px\", minWidth: \"60px\" }}\n />\n ))}\n \n {saveState === \"saving\" ? \"saving…\" : saveState === \"saved\" ? \"synced\" : saveState === \"error\" ? \"save failed\" : \"\"}\n \n

\n\n {/* per-person overview: every show they're joining and/or have tickets for, across all 4 days */}\n

\n setShowSummary((v) => !v)}\n className=\"flex items-center gap-1.5 bb-mono text-[11px]\"\n style={{ color: \"var(--lime)\" }}\n >\n {showSummary ? \"\\u2212\" : \"+\"} YOUR LINEUP SO FAR\n \n {showSummary && (\n

\n {crew.map((name) => {\n const rows = summaryByPerson[name] || [];\n return (\n

\n \n {name}\n \n \n {rows.length} show{rows.length === 1 ? \"\" : \"s\"}\n \n

\n {rows.length === 0 ? (\n

\n No shows tracked yet\n

\n ) : (\n

\n {rows.map((r) => (\n

{r.act}

\n {r.date}\n ·\n {r.time}\n ·\n {r.stage}\n {r.qty > 0 && (\n \n · x{r.qty}\n \n )}\n {r.joining && (\n \n · joining\n \n )}\n

\n ))}\n

\n )}\n

\n );\n })}\n

\n )}\n

\n \n\n {/* Day tabs */}\n

\n {DAYS.map((d) => {\n const active = d.key === activeDay;\n return (\n setActiveDay(d.key)}\n className=\"bb-display px-4 py-2 rounded-t-lg shrink-0\"\n style={{\n background: active ? \"var(--panel)\" : \"transparent\",\n color: active ? \"var(--lime)\" : \"var(--muted)\",\n border: active ? \"1px solid var(--line)\" : \"1px solid transparent\",\n borderBottom: active ? \"1px solid var(--panel)\" : \"1px solid transparent\",\n marginBottom: \"-1px\",\n fontSize: \"18px\",\n }}\n >\n {d.label.toUpperCase()} {d.date}\n \n {dayCount(d.key)}\n \n \n );\n })}\n

\n\n {/* Act list */}\n

\n {dayActs.map((a) => {\n const meta = TICKET_META[a.ticket] || TICKET_META.unsure;\n const clashes = overlapMap[a.id] || [];\n const hasClash = clashes.length > 0;\n return (\n \n {hasClash && (\n \n \n \n Clashes with {clashes.map((c) => `${c.act} (${c.stage})`).join(\", \")}\n \n

\n )}\n

\n updateAct(a.id, { act: e.target.value })}\n className=\"bb-display text-xl w-full outline-none bg-transparent\"\n style={{ color: \"var(--text)\" }}\n />\n

\n \n \n updateAct(a.id, { time: e.target.value })}\n className=\"bg-transparent outline-none w-16\"\n style={{ color: \"var(--text)\" }}\n />\n \n \n \n updateAct(a.id, { stage: e.target.value })}\n className=\"bg-transparent outline-none\"\n style={{ color: STAGE_COLORS[a.stage] || \"var(--text)\" }}\n >\n {Object.keys(STAGE_COLORS).map((s) => (\n \n ))}\n \n \n updateAct(a.id, { duration: e.target.value })}\n className=\"bg-transparent outline-none flex-1 min-w-[120px]\"\n style={{ color: \"var(--muted)\" }}\n />\n

\n \n \n updateAct(a.id, { origin: e.target.value })}\n placeholder=\"origin\"\n className=\"bg-transparent outline-none w-28\"\n style={{ color: \"var(--text)\" }}\n />\n \n \n \n updateAct(a.id, { genre: e.target.value })}\n placeholder=\"genre\"\n className=\"bg-transparent outline-none flex-1\"\n style={{ color: \"var(--text)\" }}\n />\n \n

\n \n

\n\n {/* ticket type selector */}\n

\n updateAct(a.id, { ticket: e.target.value })}\n className=\"bb-mono text-[11px] px-2 py-1.5 rounded-full outline-none\"\n style={{ background: \"transparent\", border: `1px solid ${meta.color}`, color: meta.color }}\n >\n {Object.entries(TICKET_META).map(([k, v]) => (\n \n ))}\n \n

\n\n {/* preview past songs — links out to search results, no embedded/fabricated tracks */}\n {a.act !== \"G.A.S. Attack: Durian Edition (gear market)\" && (\n

\n \n Preview on YouTube\n \n \n Preview on Spotify\n \n

\n )}\n\n {/* add to calendar — Google (web link) and Apple/other (.ics download) */}\n {(() => {\n const canSchedule = !!getInterval(a);\n const gcalUrl = canSchedule ? buildGoogleCalUrl(a) : null;\n return (\n

\n {canSchedule ? (\n <>\n \n Google Calendar\n \n downloadICS(a)}\n className=\"bb-chip flex items-center gap-1.5 bb-mono text-[11px] px-2.5 py-1.5 rounded-full\"\n style={{ border: \"1px solid var(--line)\", color: \"var(--muted)\" }}\n >\n Apple Calendar (.ics)\n \n \n ) : (\n \n Set the exact time to enable \"add to calendar\"\n \n )}\n

\n );\n })()}\n\n {/* ticket quantities per crew member — only relevant when the act actually needs a\n ticket or registration, so free walk-in stages don't clutter the card */}\n {(a.ticket === \"reg\" || a.ticket === \"ticketed\") && (\n

\n \n \n tickets booked{\" \"}\n \n ({Object.values(a.ticketQty || {}).reduce((sum, n) => sum + n, 0)})\n \n \n

\n {crew.map((name) => {\n const qty = (a.ticketQty || {})[name] || 0;\n const on = qty > 0;\n return (\n \n \n {name}\n \n bumpTicketQty(a.id, name, -1)}\n disabled={qty === 0}\n className=\"bb-chip w-7 h-7 rounded-full flex items-center justify-center bb-mono text-sm leading-none\"\n style={{\n background: on ? \"#151220\" : \"var(--panel)\",\n color: on ? \"var(--lime)\" : \"var(--muted)\",\n opacity: qty === 0 ? 0.4 : 1,\n }}\n aria-label={`Remove one ${name} ticket`}\n >\n −\n \n \n {qty}\n \n bumpTicketQty(a.id, name, 1)}\n className=\"bb-chip w-7 h-7 rounded-full flex items-center justify-center bb-mono text-sm leading-none\"\n style={{ background: on ? \"#151220\" : \"var(--panel)\", color: on ? \"var(--lime)\" : \"var(--muted)\" }}\n aria-label={`Add one ${name} ticket`}\n >\n +\n \n

\n );\n })}\n

\n \n )}\n\n {/* who wants to join (non-ticketed / free stages) */}\n

\n \n {crew.map((name) => {\n const on = (a.interested || []).includes(name);\n return (\n toggleInterested(a.id, name)}\n className=\"bb-chip bb-mono text-[11px] px-2 py-1.5 rounded-full\"\n style={{\n background: on ? \"#c792ff\" : \"transparent\",\n color: on ? \"#151220\" : \"var(--muted)\",\n border: `1px solid ${on ? \"#c792ff\" : \"var(--line)\"}`,\n }}\n >\n {name}\n \n );\n })}\n

\n {(a.ticket === \"reg\" || a.ticket === \"ticketed\") && (\n <>\n \n tickets booked · \n \n )}\n \n wants to join\n

\n \n );\n })}\n\n \n ADD ACT / EVENT FOR {DAYS.find((d) => d.key === activeDay)?.label.toUpperCase()}\n \n \n \n );\n}","createdAt",["D",1787235915479],"branchVersion","branchId","63688892-e0e6-4a28-b6ae-380f04fd289f","id","38ea6a42-5c65-42b2-8705-3477b8a83aa7","baybeatstracker",["D",1787235890768],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Will delete after baybeats lol","imageUrl","25109d29-eb56-4b0c-a502-ae32966e50cf","pinnedFileId","21ae4068-9d88-11f1-b9e2-1607ee4eb77e","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","01a01f8d-a049-7208-ba41-a2212edfa27e","tursoName","38ea6a425c6542b287053477b8a83aa7","tursoHostname","38ea6a425c6542b287053477b8a83aa7-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789521041830],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_101":100,"_109":105},"org",{"_101":100,"_102":103,"_104":105,"_18":57,"_106":107,"_108":27},"branch",{"_13":90,"_34":91,"_45":44,"_92":46,"_93":-5,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":47,"_99":100},"isOwned",45,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","zeeb","handle","displayName","hazeerahb","avatar","https://avatars.githubusercontent.com/u/52589423?v=4","tier","free","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_45":46,"_34":47,"_40":154,"_49":-5,"_50":27,"_51":52,"_53":52,"_54":55,"_56":-5,"_18":57,"_58":59,"_60":25,"_61":-5,"_62":-5,"_63":64,"_65":66,"_67":68,"_69":70,"_71":155,"_73":-5,"_74":75,"_76":75,"_77":78,"_79":78,"_80":78,"_81":75,"_82":75,"_83":156,"_85":157,"_87":158,"_89":27},"tree",[149],"files",[149],"counts",{"_139":64,"_140":136,"_141":64,"_142":143,"_144":145},"contents",[131],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_45":132,"_34":29,"_32":33,"_133":-5,"_43":44,"_42":14,"_134":27,"_40":135,"_13":136,"_35":36,"_37":39,"_24":27,"_137":-5,"_28":138},"fb221cba-0f1f-4299-9367-e15f55b46d6c","parentId","latest",["D",1787235915479],1,"label",[29],"pulls","branches","forks","envVars",{"_146":64,"_148":64},"connections",{"_146":64,"_147":64},"count","unfilledCount","emptyCount",{"_45":132,"_34":29,"_32":33,"_133":-5,"_43":44,"_42":14,"_134":27,"_40":150,"_13":136,"_35":36,"_37":39,"_24":27,"_137":-5,"_151":152,"_28":153},["D",1787235915479],"children",[],[29],["D",1787235890768],["D",1789521041830],{"_101":100,"_109":105},{"_101":100,"_102":103,"_104":105,"_18":57,"_106":107,"_108":27},{"_13":90,"_34":91,"_45":44,"_92":46,"_93":-5,"_94":-5,"_95":-5,"_96":-5,"_97":-5,"_98":47,"_99":100},"ctx",{"_83":-5,"_128":192,"_193":194,"_195":196,"_197":27,"_198":27,"_199":27,"_200":25,"_201":-5,"_202":-7,"_203":-7,"_204":64,"_205":27,"_206":27,"_207":-5,"_208":27,"_209":27,"_210":27,"_211":-5},"ENV",{"_163":164,"_165":166,"_167":91,"_168":169,"_170":171,"_172":173,"_174":175,"_176":177,"_178":179,"_180":181,"_182":183,"_184":185,"_186":187,"_188":189,"_190":191},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v2