\n \n \n\n",[],[147,213],"b968f6b4-487a-11f0-8aff-76b3cceeab13","UserList.tsx","b968f79a-487a-11f0-8aff-76b3cceeab13","5fae50f9-7d03-4f29-a772-7b21c26ce8cd",10,["D",1749835238228],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from 'https://esm.sh/react@18.2.0';\nimport type { User } from '../../shared/types.ts';\n\ninterface UserListProps {\n users: User[];\n currentUserId: string | null;\n}\n\nexport function UserList({ users, currentUserId }: UserListProps) {\n return (\n

\n 👥\n Postal Workers Online ({users.length}/10)\n

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

\n 📭\n

No postal workers online yet...

Be the first to join!

\n ) : (\n

\n {users.map((user) => (\n \n \n {user.name}\n {user.id === currentUserId && (\n 📍\n )}\n

\n ))}\n

\n )}\n \n

\n {users.length < 10 ? (\n

🚚 Waiting for more postal workers to join... ({10 - users.length} spots available)

\n ) : (\n

📮 Post office is full! Ready to start trivia!

\n )}\n

\n \n );\n}",[],[147,228,220],"components","b070de32-487a-11f0-bbee-76b3cceeab13","NameEntry.tsx","b070df40-487a-11f0-bbee-76b3cceeab13",9,["D",1749835223180],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from 'https://esm.sh/react@18.2.0';\n\ninterface NameEntryProps {\n onJoin: (name: string) => void;\n isConnecting: boolean;\n error: string | null;\n}\n\nexport function NameEntry({ onJoin, isConnecting, error }: NameEntryProps) {\n const [name, setName] = useState('');\n\n const handleSubmit = (e: React.FormEvent) => {\n e.preventDefault();\n if (name.trim() && !isConnecting) {\n onJoin(name.trim());\n }\n };\n\n return (\n

\n 📮\n Join the Postal Service Trivia Challenge\n

\n \n {error && (\n

\n {error}\n

\n )}\n \n

\n );\n}",[],[147,228,230],"cb7bb1de-487a-11f0-a437-76b3cceeab13","App.tsx","cb7bb2a6-487a-11f0-a437-76b3cceeab13",11,["D",1749835268549],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useRef } from 'https://esm.sh/react@18.2.0';\nimport type { User, WSMessage, WSClientMessage } from '../../shared/types.ts';\nimport { NameEntry } from './NameEntry.tsx';\nimport { UserList } from './UserList.tsx';\n\ndeclare global {\n interface Window {\n __INITIAL_DATA__?: {\n users: User[];\n };\n }\n}\n\nexport function App() {\n const [users, setUsers] = useState([]);\n const [currentUserId, setCurrentUserId] = useState(null);\n const [isConnected, setIsConnected] = useState(false);\n const [isConnecting, setIsConnecting] = useState(false);\n const [error, setError] = useState(null);\n const wsRef = useRef(null);\n\n // Load initial data\n useEffect(() => {\n if (window.__INITIAL_DATA__) {\n setUsers(window.__INITIAL_DATA__.users);\n }\n }, []);\n\n const connectWebSocket = () => {\n if (wsRef.current?.readyState === WebSocket.OPEN) {\n return;\n }\n\n const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';\n const wsUrl = `${protocol}//${window.location.host}/ws`;\n \n const ws = new WebSocket(wsUrl);\n wsRef.current = ws;\n\n ws.onopen = () => {\n console.log('WebSocket connected');\n setIsConnected(true);\n setError(null);\n };\n\n ws.onmessage = (event) => {\n try {\n const message: WSMessage = JSON.parse(event.data);\n handleWebSocketMessage(message);\n } catch (err) {\n console.error('Failed to parse WebSocket message:', err);\n }\n };\n\n ws.onclose = () => {\n console.log('WebSocket disconnected');\n setIsConnected(false);\n setCurrentUserId(null);\n \n // Attempt to reconnect after 3 seconds\n setTimeout(() => {\n if (!wsRef.current || wsRef.current.readyState === WebSocket.CLOSED) {\n connectWebSocket();\n }\n }, 3000);\n };\n\n ws.onerror = (error) => {\n console.error('WebSocket error:', error);\n setError('Connection error. Please try again.');\n setIsConnected(false);\n };\n };\n\n const handleWebSocketMessage = (message: WSMessage) => {\n switch (message.type) {\n case 'users_update':\n setUsers(message.users);\n break;\n case 'user_joined':\n setUsers(prev => {\n const exists = prev.some(u => u.id === message.user.id);\n return exists ? prev : [...prev, message.user];\n });\n break;\n case 'user_left':\n setUsers(prev => prev.filter(u => u.id !== message.userId));\n break;\n case 'error':\n setError(message.message);\n setIsConnecting(false);\n break;\n }\n };\n\n const sendMessage = (message: WSClientMessage) => {\n if (wsRef.current?.readyState === WebSocket.OPEN) {\n wsRef.current.send(JSON.stringify(message));\n }\n };\n\n const handleJoin = (name: string) => {\n setError(null);\n setIsConnecting(true);\n \n if (!isConnected) {\n connectWebSocket();\n }\n \n // Wait for connection then send join message\n const attemptJoin = () => {\n if (wsRef.current?.readyState === WebSocket.OPEN) {\n sendMessage({ type: 'join', name });\n // We'll get the user ID back from the server\n setCurrentUserId('pending'); // Temporary state\n } else {\n setTimeout(attemptJoin, 100);\n }\n };\n \n attemptJoin();\n };\n\n // Update current user ID when users list changes\n useEffect(() => {\n if (currentUserId === 'pending' && users.length > 0) {\n // Find the most recently joined user (highest joinedAt)\n const latestUser = users.reduce((latest, user) => \n user.joinedAt > latest.joinedAt ? user : latest\n );\n setCurrentUserId(latestUser.id);\n setIsConnecting(false);\n }\n }, [users, currentUserId]);\n\n // Initialize WebSocket connection\n useEffect(() => {\n connectWebSocket();\n \n return () => {\n if (wsRef.current) {\n wsRef.current.close();\n }\n };\n }, []);\n\n const currentUser = users.find(u => u.id === currentUserId);\n\n return (\n

\n {/* Connection Status */}\n

\n \n {isConnected ? 'Connected to Post Office' : 'Connecting...'}\n

\n\n {/* Header */}\n

📮 USPS TRIVIA CHALLENGE

Test Your Postal Service Knowledge

\n\n {/* Main Content */}\n {!currentUser ? (\n \n ) : (\n <>\n

\n 👋\n Welcome, {currentUser.name}!\n

🎯 You're now in the post office!

Trivia questions coming soon...

\n \n \n \n )}\n

\n );\n}",[],[147,228,238],"b070eefe-487a-11f0-bbee-76b3cceeab13",["D",1749835223180],[177,178,179],[147,228],["D",1749835178513],[176,180,181,182],[147],"9127fa10-487a-11f0-8b45-76b3cceeab13","index.ts",6,["D",1749835170695],"import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { upgradeWebSocket } from \"https://esm.sh/hono@3.11.7/deno\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { runMigrations } from \"./database/migrations.ts\";\nimport { getActiveUsers } from \"./database/queries.ts\";\nimport { handleWebSocket } from \"./routes/websocket.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Initialize database\nawait runMigrations();\n\n// WebSocket endpoint\napp.get('/ws', upgradeWebSocket((c) => ({\n onOpen: handleWebSocket\n})));\n\n// API endpoints\napp.get('/api/users', async (c) => {\n const users = await getActiveUsers();\n return c.json({ users });\n});\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Serve main page with initial data\napp.get(\"/\", async (c) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n // Inject initial data\n const users = await getActiveUsers();\n const initialData = { users };\n const dataScript = ``;\n \n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n});\n\nexport default app.fetch;",[],[153,253],"89bfe152-487a-11f0-a94d-76b3cceeab13","websocket.ts","89bfe224-487a-11f0-a94d-76b3cceeab13","6632b6df-bc4c-494c-a4ec-af84ee2c1d2e",5,["D",1749835158263],"import type { WSMessage, WSClientMessage, User } from \"../../shared/types.ts\";\nimport { addUser, removeUser, getActiveUsers, updateUserLastSeen } from \"../database/queries.ts\";\n\n// Store active WebSocket connections\nconst connections = new Map();\n\nexport function handleWebSocket(ws: WebSocket) {\n let userId: string | null = null;\n \n ws.onopen = () => {\n console.log('WebSocket connection opened');\n };\n \n ws.onmessage = async (event) => {\n try {\n const message: WSClientMessage = JSON.parse(event.data);\n \n switch (message.type) {\n case 'join':\n if (message.name && message.name.trim()) {\n userId = crypto.randomUUID();\n const user: User = {\n id: userId,\n name: message.name.trim(),\n joinedAt: Date.now(),\n isActive: true\n };\n \n // Check if we're at capacity (10 users max)\n const activeUsers = await getActiveUsers();\n if (activeUsers.length >= 10) {\n sendMessage(ws, { type: 'error', message: 'Game is full! Maximum 10 players allowed.' });\n return;\n }\n \n // Add user to database and connections\n await addUser(user);\n connections.set(userId, ws);\n \n // Broadcast user joined to all clients\n const updatedUsers = await getActiveUsers();\n broadcastToAll({ type: 'user_joined', user });\n broadcastToAll({ type: 'users_update', users: updatedUsers });\n \n console.log(`User ${user.name} joined with ID ${userId}`);\n }\n break;\n \n case 'leave':\n if (userId) {\n await handleUserLeave(userId);\n }\n break;\n }\n } catch (error) {\n console.error('WebSocket message error:', error);\n sendMessage(ws, { type: 'error', message: 'Invalid message format' });\n }\n };\n \n ws.onclose = async () => {\n if (userId) {\n await handleUserLeave(userId);\n }\n console.log('WebSocket connection closed');\n };\n \n ws.onerror = (error) => {\n console.error('WebSocket error:', error);\n };\n \n // Send periodic heartbeat to keep connection alive\n const heartbeat = setInterval(() => {\n if (ws.readyState === WebSocket.OPEN && userId) {\n updateUserLastSeen(userId);\n } else {\n clearInterval(heartbeat);\n }\n }, 30000); // 30 seconds\n}\n\nasync function handleUserLeave(userId: string) {\n connections.delete(userId);\n await removeUser(userId);\n \n const updatedUsers = await getActiveUsers();\n broadcastToAll({ type: 'user_left', userId });\n broadcastToAll({ type: 'users_update', users: updatedUsers });\n \n console.log(`User ${userId} left`);\n}\n\nfunction sendMessage(ws: WebSocket, message: WSMessage) {\n if (ws.readyState === WebSocket.OPEN) {\n ws.send(JSON.stringify(message));\n }\n}\n\nfunction broadcastToAll(message: WSMessage) {\n connections.forEach((ws) => {\n sendMessage(ws, message);\n });\n}\n\n// Cleanup inactive users periodically\nsetInterval(async () => {\n const activeUsers = await getActiveUsers();\n const connectedUserIds = new Set(connections.keys());\n \n // Remove users who are in DB but not connected\n for (const user of activeUsers) {\n if (!connectedUserIds.has(user.id)) {\n await removeUser(user.id);\n }\n }\n}, 60000); // Every minute",[],[153,268,260],"routes","89bff9a8-487a-11f0-a94d-76b3cceeab13",["D",1749835158263],[173],[153,268],"7d9c5aea-487a-11f0-810d-76b3cceeab13","queries.ts","7d9c5bbc-487a-11f0-810d-76b3cceeab13","3b28ec05-0c71-4810-a4d1-e1c4f1963b39",4,["D",1749835137903],"import { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\nimport { USERS_TABLE } from \"./migrations.ts\";\nimport type { User } from \"../../shared/types.ts\";\n\nexport async function addUser(user: User): Promise {\n await sqlite.execute(\n `INSERT OR REPLACE INTO ${USERS_TABLE} (id, name, joined_at, last_seen, is_active) \n VALUES (?, ?, ?, ?, ?)`,\n [user.id, user.name, user.joinedAt, Date.now(), 1]\n );\n}\n\nexport async function removeUser(userId: string): Promise {\n await sqlite.execute(\n `UPDATE ${USERS_TABLE} SET is_active = 0 WHERE id = ?`,\n [userId]\n );\n}\n\nexport async function getActiveUsers(): Promise {\n const result = await sqlite.execute(\n `SELECT id, name, joined_at as joinedAt, is_active as isActive \n FROM ${USERS_TABLE} \n WHERE is_active = 1 \n ORDER BY joined_at ASC`\n );\n \n return result.rows.map(row => ({\n id: row.id as string,\n name: row.name as string,\n joinedAt: row.joinedAt as number,\n isActive: Boolean(row.isActive)\n }));\n}\n\nexport async function updateUserLastSeen(userId: string): Promise {\n await sqlite.execute(\n `UPDATE ${USERS_TABLE} SET last_seen = ? WHERE id = ?`,\n [Date.now(), userId]\n );\n}\n\nexport async function cleanupInactiveUsers(): Promise {\n // Remove users who haven't been seen in 5 minutes\n const fiveMinutesAgo = Date.now() - (5 * 60 * 1000);\n await sqlite.execute(\n `UPDATE ${USERS_TABLE} SET is_active = 0 WHERE last_seen < ?`,\n [fiveMinutesAgo]\n );\n}",[],[153,282,274],"database","76333ff8-487a-11f0-b784-76b3cceeab13","migrations.ts","763340c0-487a-11f0-b784-76b3cceeab13",["D",1749835125467],"import { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\n\nconst USERS_TABLE = 'usps_trivia_users_v1';\n\nexport async function runMigrations() {\n // Create users table for tracking active sessions\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${USERS_TABLE} (\n id TEXT PRIMARY KEY,\n name TEXT NOT NULL,\n joined_at INTEGER NOT NULL,\n last_seen INTEGER NOT NULL,\n is_active BOOLEAN DEFAULT 1\n )\n `);\n \n console.log('Database migrations completed');\n}\n\nexport { USERS_TABLE };",[],[153,282,284],"76334b60-487a-11f0-b784-76b3cceeab13",["D",1749835125467],[170,171],[153,282],["D",1749835125467],[169,172,174],[153],["D",1749834559473],{"_95":94,"_102":98},{"_95":94,"_96":-5,"_97":98,"_18":53,"_99":100,"_101":24},{"_13":84,"_31":85,"_42":41,"_86":43,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":44,"_93":94},"ctx",{"_77":-5,"_122":334,"_335":336,"_337":338,"_339":24,"_340":24,"_341":24,"_342":57,"_343":-5,"_344":-7,"_345":-7,"_346":61,"_347":24,"_348":24,"_349":-5,"_350":24,"_351":24,"_352":24,"_353":-5},"ENV",{"_305":306,"_307":308,"_309":85,"_310":311,"_312":313,"_314":315,"_316":317,"_318":319,"_320":321,"_322":323,"_324":325,"_326":327,"_328":329,"_330":331,"_332":333},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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 · v12