\n \n \n \n",[],[146,199],"dc139afe-3995-11f1-a080-42b51c65c3df","favicon.svg","019d966b-88ca-7498-923c-1ab280b019f8",["D",1776345122900],"\n",[],[146,207],"e3e89268-3998-11f1-b26a-42b51c65c3df","QROverlay.tsx","e3e89308-3998-11f1-b26a-42b51c65c3df","019d966b-88ca-7498-923c-164f218852cd",13,["D",1776346424661],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport QRCode from \"https://esm.sh/qrcode@1.5.4?bundle-deps\";\n\nexport function QROverlay({ visible }: { visible: boolean }) {\n const [dataUrl, setDataUrl] = useState(null);\n\n useEffect(() => {\n QRCode.toDataURL(window.location.href, { width: 256, margin: 2 })\n .then(setDataUrl)\n .catch(console.error);\n }, []);\n\n if (!visible || !dataUrl) return null;\n\n return (\n

\n $\"QR$ \n

\n );\n}\n",[],[146,222,214],"components","3d75e5a8-3997-11f1-b7e9-42b51c65c3df","Counter.tsx","3d75e6a2-3997-11f1-b7e9-42b51c65c3df",["D",1776345715901],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function Counter() {\n const [count, setCount] = useState(0);\n return (\n

\n Clicked\n setCount((c) => c + 1)}\n class=\"bg-blue-500 hover:bg-blue-600 text-white font-medium px-4 py-2 rounded-lg transition-colors cursor-pointer\"\n >\n {count}\n \n times\n

\n );\n}\n",[],[146,222,224],"11337944-399a-11f1-9a51-42b51c65c3df","App.tsx","019d966b-88ca-7498-923c-1036c341cd64",["D",1776346930133],18,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect, useRef } from \"https://esm.sh/react@18.2.0\";\nimport { QROverlay } from \"./QROverlay.tsx\";\nimport { playRandomBlip } from \"../sounds.ts\";\n\ntype Message = {\n id: number;\n username: string;\n text: string;\n image_key: string | null;\n created_at: string;\n status: string | null;\n score: number | null;\n reasoning: string | null;\n};\n\nexport function App() {\n const [messages, setMessages] = useState([]);\n const [text, setText] = useState(\"\");\n const [username, setUsername] = useState(() => localStorage.getItem(\"chat-username\") || \"\");\n const [joined, setJoined] = useState(() => !!localStorage.getItem(\"chat-username\"));\n const [showQR, setShowQR] = useState(true);\n const [uploading, setUploading] = useState(false);\n const fileRef = useRef(null);\n const prevCountRef = useRef(0);\n\n // Poll for messages every second\n useEffect(() => {\n if (!joined) return;\n const fetchMessages = () => {\n fetch(`/api/messages?username=${encodeURIComponent(username)}`)\n .then((r) => r.json())\n .then((data) => setMessages(data))\n .catch(console.error);\n };\n fetchMessages();\n const id = setInterval(fetchMessages, 1000);\n return () => clearInterval(id);\n }, [joined, username]);\n\n // Play a random blip when new messages arrive\n useEffect(() => {\n if (messages.length > prevCountRef.current && prevCountRef.current > 0) {\n playRandomBlip();\n }\n prevCountRef.current = messages.length;\n }, [messages.length]);\n\n // NOTE: Do NOT add auto-scroll here — it hijacks the user's scroll position\n // and makes it impossible to read older messages while new ones arrive.\n\n const handleJoin = (e: React.FormEvent) => {\n e.preventDefault();\n if (!username.trim()) return;\n localStorage.setItem(\"chat-username\", username.trim());\n setJoined(true);\n };\n\n const handleSend = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!text.trim()) return;\n const msg = text.trim();\n setText(\"\");\n await fetch(\"/api/messages\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ username, text: msg }),\n });\n };\n\n const handlePhoto = async (e: React.ChangeEvent) => {\n const file = e.target.files?.[0];\n if (!file) return;\n setUploading(true);\n try {\n const form = new FormData();\n form.append(\"username\", username);\n form.append(\"photo\", file);\n await fetch(\"/api/upload\", { method: \"POST\", body: form });\n } catch (err) {\n console.error(\"Upload failed:\", err);\n } finally {\n setUploading(false);\n // Reset the file input so the same file can be re-selected\n if (fileRef.current) fileRef.current.value = \"\";\n }\n };\n\n if (!joined) {\n return (\n

\n );\n }\n\n return (\n

\n {/* Header */}\n

💬 Chat

\n \n setShowQR(!showQR)}\n class=\"px-2 py-1 rounded bg-gray-100 hover:bg-gray-200 text-xs\"\n >\n {showQR ? \"Hide QR\" : \"Show QR\"}\n \n {username} · source\n \n

\n\n \n\n {/* Messages */}\n

\n {messages.length === 0 && (\n

No messages yet. Say hi! 👋

\n )}\n {messages.map((m) => {\n const isOwn = m.username === username;\n const isRejected = m.score !== null && m.score < 50;\n\n // Rejected message visible only to sender\n if (isRejected && isOwn) {\n return (\n

⚠️ Message not sent

{m.text}

{m.reasoning || \"This message was flagged by our content filter.\"}

\n );\n }\n\n return (\n

\n \n {!isOwn && (\n

{m.username}

\n )}\n {m.image_key\n ? $\"photo\"$ \n :

{m.text}

}\n

\n );\n })}\n

\n\n {/* Input */}\n

\n {/* Hidden file input for camera/gallery */}\n \n fileRef.current?.click()}\n disabled={uploading}\n class=\"w-10 h-10 flex items-center justify-center rounded-full bg-gray-100 hover:bg-gray-200 text-lg shrink-0 disabled:opacity-50\"\n title=\"Send a photo\"\n >\n {uploading ? \"⏳\" : \"📷\"}\n \n setText(e.target.value)}\n placeholder=\"Type a message...\"\n class=\"flex-1 border rounded-full px-4 py-2 outline-none focus:ring-2 focus:ring-blue-400 text-sm\"\n // NOTE: Do NOT add autoFocus here — it causes scroll/focus issues on mobile\n // and fights with the 1-second polling re-renders.\n />\n \n \n \n );\n}\n",[],[146,222,231],"dc139946-3995-11f1-a080-42b51c65c3df",["D",1776345122900],[163,164,165],[146,222],["D",1776345122900],[162,166,167,168,169],[146],["D",1776345122900],["D",1789501263826],{"_16":17,"_86":82},{"_16":17,"_80":-5,"_81":82,"_33":34,"_83":84,"_85":26},{"_68":69,"_20":70,"_18":71,"_72":19,"_73":-5,"_74":-5,"_75":-5,"_76":-5,"_77":-5,"_78":21,"_79":17},"ctx",{"_61":-5,"_107":283,"_284":285,"_286":287,"_288":26,"_289":26,"_290":26,"_291":38,"_292":-5,"_293":-7,"_294":-7,"_295":42,"_296":26,"_297":26,"_298":-5,"_299":26,"_300":26,"_301":26,"_302":-5},"ENV",{"_254":255,"_256":257,"_258":70,"_259":260,"_261":262,"_263":264,"_265":266,"_267":268,"_269":270,"_271":272,"_273":274,"_275":276,"_277":278,"_279":280,"_281":282},"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"]

Search