function App() { const data = window.SS_DATA; const [moodId, setMoodId] = useState(data.moods[0].id); const [city, setCity] = useState("Amsterdam"); const [selectedEventId, setSelectedEventId] = useState(data.events[0].id); const [activeTerm, setActiveTerm] = useState(data.glossary[0].term); const [firstTimerOnly, setFirstTimerOnly] = useState(true); const [savedEventIds, setSavedEventIds] = useState([data.events[0].id]); const [checklistDone, setChecklistDone] = useState(["vibe", "first-timer"]); const [isSignedIn, setIsSignedIn] = useState(false); const [linkedAccounts, setLinkedAccounts] = useState(["google"]); const [inspectListing, setInspectListing] = useState(null); const [doorHelpActive, setDoorHelpActive] = useState(false); const progress = useScrollProgress(); const selectedMood = data.moods.find((mood) => mood.id === moodId); const filteredEvents = useMemo(() => { return data.events.filter((event) => { const cityMatch = city === "All" || event.city === city; const firstTimerMatch = !firstTimerOnly || event.firstTimer; return event.mood === moodId && cityMatch && firstTimerMatch; }); }, [moodId, city, firstTimerOnly]); const selectedEvent = data.events.find((event) => event.id === selectedEventId) || filteredEvents[0] || data.events[0]; const activeGlossary = data.glossary.find((item) => item.term === activeTerm) || data.glossary[0]; const savedEvents = data.events.filter((event) => savedEventIds.includes(event.id)); const checklistProgress = Math.round((checklistDone.length / data.checklist.length) * 100); const toggleSaved = (id) => { setSavedEventIds((ids) => ids.includes(id) ? ids.filter((item) => item !== id) : [...ids, id]); }; const toggleChecklist = (id) => { setChecklistDone((ids) => ids.includes(id) ? ids.filter((item) => item !== id) : [...ids, id]); }; const toggleLinkedAccount = (id) => { setLinkedAccounts((ids) => ids.includes(id) ? ids.filter((item) => item !== id) : [...ids, id]); }; const openSignInPopup = (mode) => { const width = 500; const height = 600; const left = (window.screen.width - width) / 2; const top = (window.screen.height - height) / 2; const popup = window.open("", "Sign In", `width=${width},height=${height},left=${left},top=${top},status=no,menubar=no,toolbar=no`); if (popup) { popup.document.open(); popup.document.write(` ${mode === "create" ? "Create Account" : "Sign In"} | Skirts & Sparkles

${mode === "create" ? "Create Account" : "Sign In"}

${mode === "create" ? "Save nights, link accounts, and keep tickets close." : "Access saved nights, alerts, and linked accounts."}

`); popup.document.close(); } }; useEffect(() => { if (!filteredEvents.some((event) => event.id === selectedEventId) && filteredEvents[0]) { setSelectedEventId(filteredEvents[0].id); } }, [filteredEvents, selectedEventId]); useEffect(() => { const jumpToHash = () => { const target = window.location.hash && document.querySelector(window.location.hash); if (target) target.scrollIntoView(); }; requestAnimationFrame(jumpToHash); window.addEventListener("hashchange", jumpToHash); return () => window.removeEventListener("hashchange", jumpToHash); }, []); const openCheckoutPopup = (event) => { const width = 500; const height = 650; const left = (window.screen.width - width) / 2; const top = (window.screen.height - height) / 2; const popup = window.open("", "Checkout", `width=${width},height=${height},left=${left},top=${top},status=no,menubar=no,toolbar=no`); if (popup) { popup.document.open(); popup.document.write(` Checkout | ${event.title}

Secure Checkout

${event.title} · ${event.venue}
1x General Admission EUR ${event.price}
Protected by Fair Price Guarantee.
A fresh QR ticket code will be generated and re-issued 48 hours before doors.
`); popup.document.close(); } }; useEffect(() => { const handleMessage = (event) => { if (event.data && event.data.type === 'AUTH_SUCCESS') { setIsSignedIn(true); } if (event.data && event.data.type === 'TICKET_PURCHASE_SUCCESS') { const boughtId = event.data.eventId; setSavedEventIds((ids) => ids.includes(boughtId) ? ids : [...ids, boughtId]); alert("Success! Your ticket is reserved. Find it in your My Tix hub."); } }; window.addEventListener('message', handleMessage); return () => window.removeEventListener('message', handleMessage); }, []); return (
People arriving at an Amsterdam music venue at night

Netherlands music nights

Dutch nightlife, translated.

Find a music night that matches your vibe, complete with plain-English guides, night-transit warnings, and 100% secure ticket resale.

Start exploring
Amsterdam 47 events this week 18 fair resale listings live
first-timer filters my tix dashboard pre-night checklist fair resale cap venue practicals lingo translator night bus nudges fresh QR tickets first-timer filters fair resale cap venue practicals
Pick a vibe. We will keep the travel, timing, and ticket details clear.
Browse mode {firstTimerOnly ? "First-timer mode is active" : "Showing all events"}

{firstTimerOnly ? "Showing low-pressure venues, earlier starts, and simple transport options." : "Showing the full list, including later starts, louder crowds, and clubbing institutions."}

{data.moods.map((mood) => ( ))}
{["All", ...data.cities].map((item) => ( setCity(item)}> {item} ))}
{filteredEvents.length ? filteredEvents.map((event) => ( )) : (
We couldn't find a perfect match Dutch nightlife is always shifting, and sometimes specific combinations are taking a breather. Try widening your search, or reset your filters to see all available music nights.
)}
Tick off the basics before you leave.
{checklistProgress === 100 ? "Fully ready" : `${checklistProgress}% ready`}
{checklistProgress === 100 ? "✓" : `${checklistDone.length}/${data.checklist.length}`}

{checklistProgress === 100 ? `🎉 You are fully scene-ready! Earplugs are packed, transport is planned, and your ticket is safe. Enjoy ${selectedEvent.title}!` : `${selectedEvent.title} is looking doable. Tick off the practicals and your night gets much easier.`}

{data.checklist.map((item) => ( ))}
Fair prices, verified sellers, and a fresh QR before the event.
{data.trust.map((item) => (
{item.stat} {item.label}

{item.detail}

))}
Live resale board Warehouse West · Sat 13 Jun
{[64, 58, 61].map((price, index) => (
Seller {index + 1} EUR {price} {price <= 58 ? "face value" : "inside fair cap"}
))}
Tap any club term to decode the scene language instantly.
{data.glossary.map((item) => ( setActiveTerm(item.term)} /> ))}
Quick meaning

{activeGlossary.term}

{activeGlossary.plain}

Tickets, alerts, routes, and door help in one place.
{data.myTix.ticket.status} {selectedEvent.firstTimer ? "first-timer OK" : "scene-ready"}

{selectedEvent.title}

{selectedEvent.venue} · {selectedEvent.date} · {selectedEvent.time}

QR {data.myTix.ticket.qr}
Support {data.myTix.ticket.support}
Reminder {data.myTix.ticket.reminder}
{isSignedIn ? "Your connected accounts are ready." : "Sign in when you are ready. There's no pressure and we won't spam you - promise!"}
Status

{isSignedIn ? "Signed in" : "Not signed in yet"}

{isSignedIn ? "Saved nights, alerts, and linked accounts are active." : "Sign in to save nights and connect accounts."}

{!isSignedIn && ( )}
QR, route, reminders, and support stay close.
Concierge before the event Ticket wallet at the venue Help mode under pressure
setDoorHelpActive(!doorHelpActive)} />

Find the night. Keep the ticket. Get home easy.

Back to top
{inspectListing && (
setInspectListing(null)}>
event.stopPropagation()}>

Resale ticket

{inspectListing.seller}

Price EUR {inspectListing.price}
Status {inspectListing.status}
Protection Fresh QR before doors
)}
); } ReactDOM.createRoot(document.getElementById("root")).render();