\n \n \n \n",[18,67],"dcbc05b2-5a7a-11f1-9476-ee650bb23af1",["D",1779961916093],[18,81],"pulls","branches",1,"forks","envVars",{"_197":26,"_199":26},"connections",{"_197":26,"_198":26},"count","unfilledCount","emptyCount",{"_35":167,"_13":18,"_65":93,"_45":-5,"_37":38,"_168":169,"_170":24,"_39":250,"_41":26,"_68":82,"_172":-5,"_69":30,"_173":-5,"_215":251,"_17":252},{"_35":186,"_13":81,"_65":80,"_45":93,"_37":38,"_168":75,"_170":24,"_39":247,"_41":26,"_68":82,"_172":-5,"_69":30,"_173":-5,"_215":248,"_17":249},{"_35":239,"_13":240,"_65":241,"_45":80,"_37":38,"_168":242,"_170":24,"_39":243,"_41":191,"_68":92,"_172":244,"_69":30,"_173":-5,"_215":245,"_17":246},{"_35":231,"_13":232,"_65":233,"_45":80,"_37":38,"_168":234,"_170":24,"_39":235,"_41":191,"_68":92,"_172":236,"_69":30,"_173":-5,"_215":237,"_17":238},{"_35":224,"_13":225,"_65":226,"_45":80,"_37":38,"_168":131,"_170":24,"_39":227,"_41":191,"_68":92,"_172":228,"_69":30,"_173":-5,"_215":229,"_17":230},{"_35":182,"_13":67,"_65":66,"_45":93,"_37":38,"_168":42,"_170":24,"_39":221,"_41":26,"_68":21,"_172":184,"_69":30,"_173":-5,"_215":222,"_17":223},{"_35":178,"_13":91,"_65":90,"_45":93,"_37":38,"_168":85,"_170":24,"_39":218,"_41":26,"_68":92,"_172":180,"_69":30,"_173":-5,"_215":219,"_17":220},{"_35":208,"_13":209,"_65":210,"_45":-5,"_37":38,"_168":211,"_170":24,"_39":212,"_41":42,"_68":213,"_172":214,"_69":30,"_173":-5,"_215":216,"_17":217},"a6de8680-5a7b-11f1-88df-ee650bb23af1","main.ts","beef6192-5a79-11f1-a40a-ee650bb23af1",16,["D",1779962255209],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nconst MIN_LENGTH = 3;\nconst MAX_LENGTH = 500;\n\nlet initialized = false;\nasync function initDb() {\n if (initialized) return;\n await sqlite.execute(`CREATE TABLE IF NOT EXISTS requests (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n text TEXT NOT NULL,\n created_at TEXT DEFAULT (datetime('now'))\n )`);\n initialized = true;\n}\n\nconst app = new Hono();\n\n// Serve frontend\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\n\n// View source\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// API: Get all requests (loaded on page open to show previous submissions)\napp.get(\"/api/requests\", async (c) => {\n await initDb();\n const result = await sqlite.execute(\"SELECT * FROM requests ORDER BY id DESC\");\n return c.json(result.rows);\n});\n\n// API: Submit a new request with validation\napp.post(\"/api/requests\", async (c) => {\n await initDb();\n\n let body: { text?: string };\n try {\n body = await c.req.json();\n } catch {\n return c.json({ error: \"Invalid JSON body\" }, 400);\n }\n\n const text = (body.text ?? \"\").trim();\n\n // Validation: reject empty / whitespace-only\n if (!text) {\n return c.json({ error: \"Request text cannot be empty.\" }, 400);\n }\n // Validation: minimum length\n if (text.length < MIN_LENGTH) {\n return c.json({ error: `Request must be at least ${MIN_LENGTH} characters.` }, 400);\n }\n // Validation: maximum length\n if (text.length > MAX_LENGTH) {\n return c.json({ error: `Request must be ${MAX_LENGTH} characters or fewer.` }, 400);\n }\n\n const result = await sqlite.execute({\n sql: \"INSERT INTO requests (text) VALUES (?)\",\n args: [text],\n });\n\n // Return the newly created row\n const row = await sqlite.execute({\n sql: \"SELECT * FROM requests WHERE id = ?\",\n args: [Number(result.lastInsertRowid)],\n });\n\n return c.json(row.rows[0], 201);\n});\n\n// API: Delete a request\napp.delete(\"/api/requests/:id\", async (c) => {\n await initDb();\n const id = Number(c.req.param(\"id\"));\n if (isNaN(id)) return c.json({ error: \"Invalid ID\" }, 400);\n\n const result = await sqlite.execute({\n sql: \"DELETE FROM requests WHERE id = ?\",\n args: [id],\n });\n\n if (result.rowsAffected === 0) {\n return c.json({ error: \"Request not found\" }, 404);\n }\n return c.json({ ok: true });\n});\n\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n","children",[],[209],["D",1779961919717],[],[18,91],["D",1779961915851],[],[18,67],"b9ef4250-5a7b-11f1-b6e7-ee650bb23af1","RequestList.tsx","e910ea4e-5a7a-11f1-8d44-ee650bb23af1",["D",1779962287191],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface AssistanceRequest {\n id: number;\n text: string;\n created_at: string;\n}\n\ninterface Props {\n requests: AssistanceRequest[];\n onDelete: (id: number) => void;\n}\n\nexport function RequestList({ requests, onDelete }: Props) {\n const [confirmId, setConfirmId] = useState(null);\n\n if (requests.length === 0) {\n return (\n

📭

No requests yet. Submit one above!

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

\n Saved Requests ({requests.length})\n

\n {requests.map((req) => (\n \n

{req.text}

\n #{req.id} · {new Date(req.created_at + \"Z\").toLocaleString()}\n

\n {confirmId === req.id ? (\n

\n { onDelete(req.id); setConfirmId(null); }}\n class=\"text-xs px-2 py-1 bg-red-500 text-white rounded hover:bg-red-600 transition-colors\"\n >\n Confirm\n \n setConfirmId(null)}\n class=\"text-xs px-2 py-1 bg-gray-200 text-gray-600 rounded hover:bg-gray-300 transition-colors\"\n >\n Cancel\n \n

\n ) : (\n setConfirmId(req.id)}\n class=\"text-gray-300 hover:text-red-500 transition-colors shrink-0\"\n title=\"Delete request\"\n >\n ✕\n \n )}\n

\n ))}\n \n );\n}\n",[],[18,81,225],"add10012-5a7b-11f1-835f-ee650bb23af1","RequestForm.tsx","e6aa3670-5a7a-11f1-97b2-ee650bb23af1",17,["D",1779962266863],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nconst MIN_LENGTH = 3;\nconst MAX_LENGTH = 500;\n\ninterface Props {\n onSubmit: (text: string) => Promise;\n}\n\nexport function RequestForm({ onSubmit }: Props) {\n const [text, setText] = useState(\"\");\n const [submitting, setSubmitting] = useState(false);\n const [error, setError] = useState(null);\n const [success, setSuccess] = useState(false);\n\n const trimmed = text.trim();\n const charCount = trimmed.length;\n const isValid = charCount >= MIN_LENGTH && charCount <= MAX_LENGTH;\n\n async function handleSubmit(e: Event) {\n e.preventDefault();\n setError(null);\n setSuccess(false);\n\n if (!isValid || submitting) return;\n\n setSubmitting(true);\n const err = await onSubmit(text);\n if (err) {\n setError(err);\n } else {\n setText(\"\");\n setSuccess(true);\n setTimeout(() => setSuccess(false), 2000);\n }\n setSubmitting(false);\n }\n\n return (\n

\n {\n setText((e.target as HTMLInputElement).value);\n setError(null);\n setSuccess(false);\n }}\n placeholder=\"Type your assistance request...\"\n maxLength={MAX_LENGTH}\n class={`w-full px-4 py-3 border rounded-lg focus:outline-none focus:ring-2 focus:border-transparent text-base ${\n error ? \"border-red-400 focus:ring-red-400\" : \"border-gray-300 focus:ring-blue-500\"\n }`}\n disabled={submitting}\n />\n

\n \n {error\n ? error\n : trimmed.length > 0 && trimmed.length < MIN_LENGTH\n ? `At least ${MIN_LENGTH} characters required`\n : \"\\u00A0\"}\n \n MAX_LENGTH ? \"text-red-500\" : \"text-gray-400\"}`}>\n {charCount > 0 ? `${charCount}/${MAX_LENGTH}` : \"\"}\n \n

\n \n {submitting ? \"Sending...\" : \"Submit\"}\n \n \n {success && (\n

✅ Request submitted successfully!

\n )}\n

\n );\n}\n",[],[18,81,232],"b48625c2-5a7b-11f1-835f-ee650bb23af1","App.tsx","e266f7f6-5a7a-11f1-846d-ee650bb23af1",18,["D",1779962278108],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { RequestForm } from \"./RequestForm.tsx\";\nimport { RequestList } from \"./RequestList.tsx\";\n\ninterface AssistanceRequest {\n id: number;\n text: string;\n created_at: string;\n}\n\nexport function App() {\n const [requests, setRequests] = useState([]);\n const [loading, setLoading] = useState(true);\n const [loadError, setLoadError] = useState(null);\n\n // Load saved requests from SQLite when the page opens\n useEffect(() => {\n fetchRequests();\n }, []);\n\n async function fetchRequests() {\n try {\n const res = await fetch(\"/api/requests\");\n if (!res.ok) throw new Error(\"Failed to load requests\");\n const data = await res.json();\n setRequests(data);\n setLoadError(null);\n } catch (err) {\n setLoadError(\"Could not load requests. Please refresh.\");\n } finally {\n setLoading(false);\n }\n }\n\n // Returns an error message string, or null on success\n async function handleSubmit(text: string): Promise {\n try {\n const res = await fetch(\"/api/requests\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ text }),\n });\n\n if (!res.ok) {\n const data = await res.json();\n return data.error || \"Submission failed.\";\n }\n\n // Refresh list to show the new request persisted in the database\n await fetchRequests();\n return null;\n } catch {\n return \"Network error. Please try again.\";\n }\n }\n\n async function handleDelete(id: number) {\n try {\n const res = await fetch(`/api/requests/${id}`, { method: \"DELETE\" });\n if (res.ok) {\n setRequests((prev) => prev.filter((r) => r.id !== id));\n }\n } catch {\n // silently fail\n }\n }\n\n return (\n

📋 Assistance Requests

\n Submit a request and it will be saved permanently\n

\n\n \n\n {loadError ? (\n

{loadError}

\n ) : loading ? (\n

Loading saved requests...

\n ) : (\n \n )}\n\n

\n view source\n {\" · \"}\n Requests persist in Val Town SQLite\n

\n );\n}\n",[],[18,81,240],["D",1779961916093],[202,203,204],[18,81],["D",1779961910578],[201,205,206],[18],["D",1779961427722],["D",1789558275908],{"_11":12,"_145":72},{"_11":12,"_140":141,"_71":72,"_31":70,"_142":143,"_144":30},{"_41":131,"_13":16,"_35":38,"_132":95,"_133":-5,"_134":-5,"_135":-5,"_136":-5,"_137":-5,"_138":14,"_139":12},"ctx",{"_55":-5,"_164":291,"_292":293,"_294":295,"_296":30,"_297":30,"_298":30,"_299":24,"_300":-5,"_301":-7,"_302":-7,"_303":26,"_304":30,"_305":30,"_306":-5,"_307":30,"_308":30,"_309":30,"_310":-5},"ENV",{"_262":263,"_264":265,"_266":16,"_267":268,"_269":270,"_271":272,"_273":274,"_275":276,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290},"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"]

History · frontend