Merge branch 'hackclub:main' into main

src/lib/components/ParticipantSignUp.svelte

@@ -1,7 +1,11 @@
 <script lang="ts">
+	import { page } from '$app/stores';
+	
 	let submitted = false;
 	let fadeOut = false;
 	
+	$: city = $page.url.pathname.split('/')[1] || '';
+	
 	function handleFormSubmit(event: Event) {
 		event.preventDefault();
 		const form = event.target as HTMLFormElement;
@@ -13,7 +17,7 @@
 			headers: {
 				'Content-Type': 'application/json',
 			},
-			body: JSON.stringify({ email })
+			body: JSON.stringify({ email, city })
 		}).catch(error => {
 			console.warn('Failed to save email:', error);
 		});

src/routes/api/rsvp/+server.js

@@ -14,7 +14,7 @@ const base = AIRTABLE_API_KEY && AIRTABLE_BASE_ID
 
 export async function POST({ request, getClientAddress }) {
 	try {
-		const { email } = await request.json();
+		const { email, city } = await request.json();
 		
 		if (!email) {
 			return json({ error: 'Email is required' }, { status: 400 });
@@ -34,6 +34,7 @@ export async function POST({ request, getClientAddress }) {
 					fields: {
 						email,
 						ip,
+						city,
 					}
 				}
 			]);

src/routes/example/+page.svelte

@@ -9,7 +9,7 @@
 	// Configuration - Put your information here!
 	const eventName = "Example";
 	const eventLocation = "Example City";
-	const eventAddress = "1600 Pennsylvania Avenue, Washington, DC 20500";
+	const eventAddress = "1600 Pennsylvania Avenue, Washington, DC 20500"; // Leave this empty if you don't want an address
 	// These two are optional
 	const directionsURL = "https://www.google.com/maps/search/1600+pennsylvania+avenue+washington+dc/"
 	const contactLink = "mailto:example@daydream.hackclub.com"
@@ -26,9 +26,9 @@
 		{ image: "/example/logo7.png", name: "Sponsor 7", url: "https://example7.com" }
 	];
 	
-	// Schedule Configuration - You don't need to use this schedule, this is just an example!
-	const scheduleData = {
-		saturday: {
+	// Schedule Configuration - You don't need to use this exact schedule, this is just an example!
+	const scheduleData: { title: string; items: { event: string; time: string; }[] }[] = [
+		{
 			title: "Saturday, September 27th",
 			items: [
 				{ event: "Doors open", time: "11:00 AM" },
@@ -43,7 +43,7 @@
 				{ event: "Midnight surprise", time: "12:00 AM" }
 			]
 		},
-		sunday: {
+		{
 			title: "Sunday, September 28th",
 			items: [
 				{ event: "Breakfast", time: "8:00 AM" },
@@ -51,7 +51,7 @@
 				{ event: "Closing ceremony", time: "12:00 PM" }
 			]
 		}
-	};
+	];
 
 	
 	import { onMount } from "svelte";
@@ -960,43 +960,25 @@ Mumbai`.split("\n")
 				
 				<!-- Schedule Content -->
 				<div class="relative z-10">
-					<!-- Saturday Section -->
-					<div class="mb-8 bg-white/50 py-6 -mx-8">
-						<h3 class="text-2xl font-sans font-bold text-[#335969] mb-6 text-center px-8 max-sm:text-xl max-sm:px-4">
-							{scheduleData.saturday.title}
-						</h3>
-						
-						<div class="max-w-xl mx-auto px-4">
-							{#each scheduleData.saturday.items as item, index}
-								<div class="flex items-center justify-between py-2">
-									<span class="text-lg font-sans text-[#477783]">{item.event}</span>
-									<span class="text-lg font-sans text-[#477783]">{item.time}</span>
-								</div>
-								{#if index < scheduleData.saturday.items.length - 1}
-									<div class="h-[2px] bg-white/30"></div>
-								{/if}
-							{/each}
+					{#each scheduleData as day, dayIndex}
+						<div class="bg-white/50 py-6 -mx-8 {dayIndex < scheduleData.length - 1 ? 'mb-8' : ''}">
+							<h3 class="text-2xl font-sans font-bold text-[#335969] mb-6 text-center px-8 max-sm:text-xl max-sm:px-4">
+								{day.title}
+							</h3>
+							
+							<div class="max-w-xl mx-auto px-4">
+								{#each day.items as item, index}
+									<div class="flex items-center justify-between py-2">
+										<span class="text-lg font-sans text-[#477783]">{item.event}</span>
+										<span class="text-lg font-sans text-[#477783]">{item.time}</span>
+									</div>
+									{#if index < day.items.length - 1}
+										<div class="h-[2px] bg-white/30"></div>
+									{/if}
+								{/each}
+							</div>
 						</div>
-					</div>
-					
-					<!-- Sunday Section -->
-					<div class="bg-white/50 py-6 -mx-8">
-						<h3 class="text-2xl font-sans font-bold text-[#335969] mb-6 text-center px-8 max-sm:text-xl max-sm:px-4">
-							{scheduleData.sunday.title}
-						</h3>
-						
-						<div class="max-w-xl mx-auto px-4">
-							{#each scheduleData.sunday.items as item, index}
-								<div class="flex items-center justify-between py-2">
-									<span class="text-lg font-sans text-[#477783]">{item.event}</span>
-									<span class="text-lg font-sans text-[#477783]">{item.time}</span>
-								</div>
-								{#if index < scheduleData.sunday.items.length - 1}
-									<div class="h-[2px] bg-white/30"></div>
-								{/if}
-							{/each}
-						</div>
-					</div>
+					{/each}
 				</div>
 			</div>
 			
@@ -1230,7 +1212,7 @@ Mumbai`.split("\n")
 			<!-- Map container with cloudy edges -->
 			<div class="relative w-full h-156 overflow-hidden bg-transparent">
 				<iframe 
-					src="/event-map?location={encodeURIComponent(eventAddress)}"
+					src={eventAddress ? "/event-map?location={encodeURIComponent(eventAddress)}" : "/map"}
 					class="w-full h-full border-0 bg-[#acd4e0]"
 					style="
 						mask-image: 
@@ -1321,13 +1303,15 @@ Mumbai`.split("\n")
 				</iframe>
 			</div>
 			
-			<p class="text-center font-sans text-2xl pt-12 max-sm:text-xl text-[#60574b] z-10000">
-				{#if directionsURL}
-					Daydream {eventName} is taking place at <a class="underline text-pink" href={directionsURL}>{eventAddress}</a>!
-				{:else}
-					Daydream {eventName} is taking place at <span class="underline">{eventAddress}</span>!
-				{/if}
-			</p>
+			{#if eventAddress}
+				<p class="text-center font-sans text-2xl pt-12 max-sm:text-xl text-[#60574b] z-10000">
+					{#if directionsURL}
+						Daydream {eventName} is taking place at <a class="underline text-pink" href={directionsURL}>{eventAddress}</a>!
+					{:else}
+						Daydream {eventName} is taking place at <span class="underline">{eventAddress}</span>!
+					{/if}
+				</p>
+			{/if}
 		</div>
 	</div>
 

src/routes/map/+page.server.js

@@ -11,20 +11,26 @@ export async function load() {
 	}
 
 	try {
-		// Fetch approved events from Airtable
-		const airtableUrl = `https://api.airtable.com/v0/${AIRTABLE_BASE_ID}/events?filterByFormula={triage_status}="Approved"`;
-		const airtableResponse = await fetch(airtableUrl, {
-			headers: {
-				'Authorization': `Bearer ${AIRTABLE_API_KEY}`
+		// Fetch all approved events from Airtable with pagination
+		const events = [];
+		let offset = null;
+		
+		do {
+			const airtableUrl = `https://api.airtable.com/v0/${AIRTABLE_BASE_ID}/events?filterByFormula={triage_status}="Approved"${offset ? `&offset=${offset}` : ''}`;
+			const airtableResponse = await fetch(airtableUrl, {
+				headers: {
+					'Authorization': `Bearer ${AIRTABLE_API_KEY}`
+				}
+			});
+
+			if (!airtableResponse.ok) {
+				throw new Error(`Airtable API error: ${airtableResponse.status}`);
 			}
-		});
 
-		if (!airtableResponse.ok) {
-			throw new Error(`Airtable API error: ${airtableResponse.status}`);
-		}
-
-		const airtableData = await airtableResponse.json();
-		const events = airtableData.records;
+			const airtableData = await airtableResponse.json();
+			events.push(...airtableData.records);
+			offset = airtableData.offset;
+		} while (offset);
 
 		// Geocode each event location
 		const locations = [];