[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_336":337,"_338":339},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_247":-5,"_20":248,"_22":249,"_250":251,"_252":253,"_26":254,"_24":255,"_256":257,"_258":259,"_260":51,"_261":262,"_263":75,"_264":-5,"_265":-5,"_266":267},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":-5,"_31":32,"_33":34,"_35":-5},"handle","aminrzazad","name","assist-hub","branchName","main","version","path","frontend","project",{"_36":198,"_13":14,"_38":199,"_49":-5,"_200":51,"_52":53,"_201":53,"_202":203,"_204":-5,"_205":206,"_207":114,"_208":75,"_209":-5,"_210":-5,"_211":77,"_56":212,"_213":214,"_215":216,"_217":218,"_219":-5,"_220":221,"_222":221,"_223":224,"_225":224,"_226":224,"_227":221,"_228":221,"_229":230,"_231":232,"_233":234,"_50":51},"tree",[108,109,110,111],"file",{"_36":105,"_13":19,"_66":69,"_68":-5,"_70":71,"_72":73,"_74":75,"_38":106,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_18":107},"contents",[60,61,62,63],"upstream",{"_36":37,"_38":39,"_40":41,"_13":16,"_42":43,"_17":44,"_45":-5,"_46":-5,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59},"pull","ahead",13,"behind",3,"envVars","id","961078ea-f528-11ef-aa68-569c3dd06744","createdAt",["D",1740674013689],"updatedAt",["D",1785420707976],"projectId","96102714-f528-11ef-aa68-569c3dd06744",91,"forkedBranchId","forkedBranchVersion","lockfileKey","1785420708123-esm.town_v_templates_react-hono-starter@91-main","deletedAt","isOwned",false,"privacy","public","userHandle","templates","orgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","react-hono-starter",{"_36":99,"_13":100,"_66":101,"_68":69,"_70":71,"_72":73,"_74":75,"_38":102,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_18":104},{"_36":92,"_13":93,"_66":94,"_68":69,"_70":71,"_72":95,"_74":75,"_38":96,"_17":73,"_78":24,"_80":97,"_82":51,"_83":-5,"_18":98},{"_36":85,"_13":86,"_66":87,"_68":69,"_70":71,"_72":88,"_74":75,"_38":89,"_17":73,"_78":24,"_80":90,"_82":51,"_83":-5,"_18":91},{"_36":64,"_13":65,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_38":76,"_17":77,"_78":79,"_80":81,"_82":51,"_83":-5,"_18":84},"732a0958-55cc-11f1-a76e-ee650bb23af1","index.tsx","fileId","019e4f51-805e-7440-bcf5-84332495a9f0","parentId","019e4f51-805e-7440-bcf5-8aa726370d2a","branchId","73250764-55cc-11f1-a76e-ee650bb23af1","branchVersion",1,"latest",true,["D",1779447201825],0,"fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();","deleted","label",[19,65],"a5d2d57e-55cc-11f1-a5bf-ee650bb23af1","index.html","019e4f51-805e-7440-bcf5-83dad9eab088",8,["D",1779447286881],"\n\n \n \n \n Assist Hub\n \n \n \n \n

\n \n \n \n\n",[19,86],"a87ee696-55cc-11f1-a5bf-ee650bb23af1","favicon.svg","019e4f51-805e-7440-bcf5-7e167d7a24d3",10,["D",1779447291365],"\n\n",[19,93],"7329faf8-55cc-11f1-a76e-ee650bb23af1","components","019e4f51-805e-7440-bcf5-7a6c1257b90e",["D",1779447201825],"directory",[19,100],"732a0ee4-55cc-11f1-a76e-ee650bb23af1",["D",1779447201825],[19],{"_36":105,"_13":19,"_66":69,"_68":-5,"_70":71,"_72":73,"_74":75,"_38":144,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":145,"_18":146},{"_36":129,"_13":130,"_66":131,"_68":-5,"_70":71,"_72":132,"_74":75,"_38":133,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":134,"_18":135},{"_36":121,"_13":122,"_66":123,"_68":-5,"_70":71,"_72":124,"_74":75,"_38":125,"_17":73,"_78":24,"_80":126,"_82":51,"_83":-5,"_118":127,"_18":128},{"_36":112,"_13":113,"_66":114,"_68":-5,"_70":71,"_72":34,"_74":75,"_38":115,"_17":73,"_78":116,"_80":117,"_82":51,"_83":-5,"_118":119,"_18":120},"7df65df0-55cc-11f1-b99b-ee650bb23af1","index.ts","019e4f51-805e-7440-bcf5-9265ecc8df16",["D",1779447220004],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { initDB, sqlite } from \"./shared/db.ts\";\n\nconst app = new Hono();\n\n// Initialize DB on first request\nlet dbReady = false;\napp.use(\"*\", async (_c, next) => {\n if (!dbReady) {\n await initDB();\n dbReady = true;\n }\n await next();\n});\n\n// --- Static files ---\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// --- Requests API ---\napp.get(\"/api/requests\", async (c) => {\n const result = await sqlite.execute(\"SELECT * FROM requests ORDER BY created_at DESC\");\n return c.json(result.rows);\n});\n\napp.post(\"/api/requests\", async (c) => {\n const body = await c.req.json();\n const text = (body.text || \"\").trim();\n if (!text) {\n return c.json({ error: \"Request text cannot be empty\" }, 400);\n }\n const result = await sqlite.execute({\n sql: \"INSERT INTO requests (text) VALUES (?) RETURNING *\",\n args: [text],\n });\n return c.json(result.rows[0], 201);\n});\n\napp.delete(\"/api/requests/:id\", async (c) => {\n const id = Number(c.req.param(\"id\"));\n await sqlite.execute({ sql: \"DELETE FROM requests WHERE id = ?\", args: [id] });\n return c.json({ ok: true });\n});\n\n// --- Chat API ---\napp.get(\"/api/chat\", async (c) => {\n const result = await sqlite.execute(\n \"SELECT * FROM chat_messages ORDER BY created_at ASC LIMIT 200\"\n );\n return c.json(result.rows);\n});\n\napp.post(\"/api/chat\", async (c) => {\n const body = await c.req.json();\n const username = (body.username || \"\").trim();\n const message = (body.message || \"\").trim();\n if (!username || !message) {\n return c.json({ error: \"Username and message are required\" }, 400);\n }\n const result = await sqlite.execute({\n sql: \"INSERT INTO chat_messages (username, message) VALUES (?, ?) RETURNING *\",\n args: [username, message],\n });\n return c.json(result.rows[0], 201);\n});\n\n// --- SSE for real-time chat polling ---\napp.get(\"/api/chat/stream\", async (c) => {\n const lastId = Number(c.req.query(\"after\") || \"0\");\n const result = await sqlite.execute({\n sql: \"SELECT * FROM chat_messages WHERE id > ? ORDER BY created_at ASC\",\n args: [lastId],\n });\n return c.json(result.rows);\n});\n\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n","children",[],[113],"ba85f14a-55cc-11f1-88ba-ee650bb23af1","README.md","019e4f51-805e-7440-bcf5-8da70fd21c85",11,["D",1779447321561],"# 🛟 Assist Hub\n\nA real-time assistance request tracker and chat app built on Val Town.\n\n## Features\n\n- **📋 Requests Tab** — Submit, view, and delete assistance requests. All requests persist in SQLite with timestamps.\n- **💬 Chat Tab** — Join with a username and send messages. Messages sync across users via polling (every 2 seconds). Chat history persists across sessions.\n- **🔔 Toast Notifications** — Visual confirmations for all actions (submit, delete, join, errors).\n- **📱 Responsive** — Works on mobile and desktop with flex layouts.\n- **✅ Validation** — Empty submissions are rejected on both client and server.\n\n## Architecture\n\n```mermaid\ngraph LR\n Browser -->|\"GET /\"| Hono[\"index.ts (Hono)\"]\n Hono -->|serves| HTML[\"index.html\"]\n HTML -->|loads| React[\"React App\"]\n React -->|\"GET/POST\"| API[\"/api/requests\"]\n React -->|\"GET/POST\"| Chat[\"/api/chat\"]\n React -->|\"GET (poll)\"| Stream[\"/api/chat/stream\"]\n API --> SQLite[(SQLite DB)]\n Chat --> SQLite\n Stream --> SQLite\n```\n\n## File Structure\n\n```\nindex.ts ← Hono server (API + static files)\nshared/\n db.ts ← SQLite schema & init\nfrontend/\n index.html ← HTML shell\n index.tsx ← React entrypoint\n favicon.svg ← App icon\n components/\n App.tsx ← Root layout + tab navigation\n RequestsTab.tsx ← Submit & view requests\n ChatTab.tsx ← Real-time chat with username\n Toast.tsx ← Toast notification system\n```\n\n## API\n\n| Method | Path | Description |\n|--------|------|-------------|\n| `GET` | `/api/requests` | List all requests (newest first) |\n| `POST` | `/api/requests` | Create request (`{ text }`) |\n| `DELETE` | `/api/requests/:id` | Delete a request |\n| `GET` | `/api/chat` | Get last 200 chat messages |\n| `POST` | `/api/chat` | Send message (`{ username, message }`) |\n| `GET` | `/api/chat/stream?after=ID` | Poll for new messages after ID |\n",[],[122],"77e6aa50-55cc-11f1-b99b-ee650bb23af1","shared","b2adb296-1951-41d0-87ba-227010ce6b5c",2,["D",1779447209839],[136],[130],{"_36":137,"_13":138,"_66":139,"_68":131,"_70":71,"_72":132,"_74":75,"_38":140,"_17":77,"_78":79,"_80":141,"_82":51,"_83":-5,"_118":142,"_18":143},"77e6873c-55cc-11f1-b99b-ee650bb23af1","db.ts","77e687e6-55cc-11f1-b99b-ee650bb23af1",["D",1779447209839],"import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\n\nexport async function initDB() {\n await sqlite.batch([\n {\n sql: `CREATE TABLE IF NOT EXISTS requests (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n text TEXT NOT NULL,\n created_at TEXT NOT NULL DEFAULT (datetime('now'))\n )`,\n },\n {\n sql: `CREATE TABLE IF NOT EXISTS chat_messages (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n username TEXT NOT NULL,\n message TEXT NOT NULL,\n created_at TEXT NOT NULL DEFAULT (datetime('now'))\n )`,\n },\n ]);\n}\n\nexport { sqlite };\n",[],[130,138],["D",1779447201825],[147,148,149,150],[19],{"_36":99,"_13":100,"_66":101,"_68":69,"_70":71,"_72":73,"_74":75,"_38":160,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":161,"_18":162},{"_36":92,"_13":93,"_66":94,"_68":69,"_70":71,"_72":95,"_74":75,"_38":157,"_17":73,"_78":24,"_80":97,"_82":51,"_83":-5,"_118":158,"_18":159},{"_36":85,"_13":86,"_66":87,"_68":69,"_70":71,"_72":88,"_74":75,"_38":154,"_17":73,"_78":24,"_80":90,"_82":51,"_83":-5,"_118":155,"_18":156},{"_36":64,"_13":65,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_38":151,"_17":77,"_78":79,"_80":81,"_82":51,"_83":-5,"_118":152,"_18":153},["D",1779447201825],[],[19,65],["D",1779447286881],[],[19,86],["D",1779447291365],[],[19,93],["D",1779447201825],[163,164,165,166],[19,100],{"_36":190,"_13":191,"_66":192,"_68":101,"_70":71,"_72":193,"_74":75,"_38":194,"_17":73,"_78":79,"_80":195,"_82":51,"_83":-5,"_118":196,"_18":197},{"_36":182,"_13":183,"_66":184,"_68":101,"_70":71,"_72":185,"_74":75,"_38":186,"_17":73,"_78":79,"_80":187,"_82":51,"_83":-5,"_118":188,"_18":189},{"_36":175,"_13":176,"_66":177,"_68":101,"_70":71,"_72":32,"_74":75,"_38":178,"_17":73,"_78":79,"_80":179,"_82":51,"_83":-5,"_118":180,"_18":181},{"_36":167,"_13":168,"_66":169,"_68":101,"_70":71,"_72":170,"_74":75,"_38":171,"_17":73,"_78":79,"_80":172,"_82":51,"_83":-5,"_118":173,"_18":174},"26077a32-55ce-11f1-b7ea-ee650bb23af1","Toast.tsx","88cb190a-55cc-11f1-b99b-ee650bb23af1",14,["D",1779447931109],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createContext, useCallback, useContext, useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\ntype ToastType = \"success\" | \"error\" | \"info\";\ninterface ToastMsg {\n id: number;\n text: string;\n type: ToastType;\n}\n\ninterface ToastCtx {\n show: (text: string, type?: ToastType) => void;\n}\n\nconst Ctx = createContext({ show: () => {} });\n\nexport function useToast() {\n return useContext(Ctx);\n}\n\nlet nextId = 0;\n\nexport function ToastProvider({ children }: { children: any }) {\n const [toasts, setToasts] = useState([]);\n\n const show = useCallback((text: string, type: ToastType = \"success\") => {\n const id = nextId++;\n setToasts((prev) => [...prev, { id, text, type }]);\n setTimeout(() => {\n setToasts((prev) => prev.filter((t) => t.id !== id));\n }, 3000);\n }, []);\n\n return (\n \n {children}\n {/* Render portal */}\n

\n {toasts.map((t) => (\n \n {t.type === \"success\" ? \"✅\" : t.type === \"error\" ? \"❌\" : \"ℹ️\"} {t.text}\n

\n ))}\n \n \n );\n}\n\nexport function Toast() {\n return null; // Toasts are rendered by the provider\n}\n",[],[19,100,168],"23049c5c-55ce-11f1-b73e-ee650bb23af1","RequestsTab.tsx","9236bef4-55cc-11f1-a92c-ee650bb23af1",["D",1779447926419],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { useToast } from \"./Toast.tsx\";\n\ninterface AssistRequest {\n id: number;\n text: string;\n created_at: string;\n}\n\nexport function RequestsTab() {\n const [requests, setRequests] = useState([]);\n const [text, setText] = useState(\"\");\n const [loading, setLoading] = useState(true);\n const [submitting, setSubmitting] = useState(false);\n const [deletingId, setDeletingId] = useState(null);\n const { show } = useToast();\n\n // Load requests on mount\n useEffect(() => {\n fetch(\"/api/requests\")\n .then((r) => {\n if (!r.ok) throw new Error(\"Server error\");\n return r.json();\n })\n .then((data) => setRequests(data))\n .catch(() => show(\"Failed to load requests\", \"error\"))\n .finally(() => setLoading(false));\n }, []);\n\n const handleSubmit = async (e: Event) => {\n e.preventDefault();\n const trimmed = text.trim();\n if (!trimmed) {\n show(\"Please enter a request before submitting\", \"error\");\n return;\n }\n setSubmitting(true);\n try {\n const res = await fetch(\"/api/requests\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ text: trimmed }),\n });\n if (!res.ok) {\n const err = await res.json();\n throw new Error(err.error || \"Failed to submit\");\n }\n const newReq = await res.json();\n setRequests((prev) => [newReq, ...prev]);\n setText(\"\");\n show(\"Request submitted!\");\n } catch (err: any) {\n show(err.message || \"Something went wrong\", \"error\");\n } finally {\n setSubmitting(false);\n }\n };\n\n const handleDelete = async (id: number) => {\n if (deletingId === id) {\n // Second click = confirm\n try {\n await fetch(`/api/requests/${id}`, { method: \"DELETE\" });\n setRequests((prev) => prev.filter((r) => r.id !== id));\n show(\"Request removed\");\n } catch {\n show(\"Failed to delete\", \"error\");\n }\n setDeletingId(null);\n } else {\n // First click = ask to confirm\n setDeletingId(id);\n // Auto-reset after 3 seconds\n setTimeout(() => setDeletingId((curr) => (curr === id ? null : curr)), 3000);\n }\n };\n\n const formatDate = (iso: string) => {\n const d = new Date(iso + \"Z\");\n return d.toLocaleString();\n };\n\n const charsLeft = 500 - text.length;\n\n return (\n

\n {/* Submit Form */}\n \n\n {/* Requests List */}\n

\n Previous Requests{\" \"}\n {!loading && ({requests.length})}\n

\n\n {loading ? (\n

\n ) : requests.length === 0 ? (\n

No requests yet. Submit one above! 👆

\n ) : (\n

\n
\n
{req.text}
\n
🕐 {formatDate(req.created_at)}
\n
\n handleDelete(req.id)}\n class={`text-lg transition-colors cursor-pointer flex-shrink-0 ${\n deletingId === req.id\n ? \"text-red-500\"\n : \"text-gray-300 hover:text-red-500\"\n }`}\n title={deletingId === req.id ? \"Click again to confirm delete\" : \"Delete\"}\n >\n {deletingId === req.id ? \"🗑️\" : \"✕\"}\n \n

\n )}\n

\n );\n}\n",[],[19,100,176],"18135716-55ce-11f1-b7ea-ee650bb23af1","ChatTab.tsx","a2254c9a-55cc-11f1-a5bf-ee650bb23af1",12,["D",1779447908032],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { useToast } from \"./Toast.tsx\";\n\ninterface ChatMessage {\n id: number;\n username: string;\n message: string;\n created_at: string;\n}\n\nexport function ChatTab() {\n const [username, setUsername] = useState(() => localStorage.getItem(\"chat_user\") || \"\");\n const [joined, setJoined] = useState(() => !!localStorage.getItem(\"chat_user\"));\n const [messages, setMessages] = useState([]);\n const [input, setInput] = useState(\"\");\n const [sending, setSending] = useState(false);\n const [loading, setLoading] = useState(true);\n const [onlineCount, setOnlineCount] = useState(0);\n const messagesEndRef = useRef(null);\n const lastIdRef = useRef(0);\n const pollRef = useRef(0);\n const inputRef = useRef(null);\n const { show } = useToast();\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n };\n\n // Load initial messages\n useEffect(() => {\n if (!joined) return;\n fetch(\"/api/chat\")\n .then((r) => r.json())\n .then((data: ChatMessage[]) => {\n setMessages(data);\n if (data.length > 0) lastIdRef.current = data[data.length - 1].id;\n // Count unique users active in last 5 min\n const fiveMinAgo = Date.now() - 5 * 60 * 1000;\n const recentUsers = new Set(\n data.filter((m) => new Date(m.created_at + \"Z\").getTime() > fiveMinAgo).map((m) => m.username),\n );\n setOnlineCount(Math.max(recentUsers.size, 1));\n })\n .catch(() => show(\"Failed to load chat\", \"error\"))\n .finally(() => setLoading(false));\n }, [joined]);\n\n // Poll for new messages every 2s with dedup\n useEffect(() => {\n if (!joined) return;\n const poll = async () => {\n try {\n const res = await fetch(`/api/chat/stream?after=${lastIdRef.current}`);\n const newMsgs: ChatMessage[] = await res.json();\n if (newMsgs.length > 0) {\n setMessages((prev) => {\n const existingIds = new Set(prev.map((m) => m.id));\n const fresh = newMsgs.filter((m) => !existingIds.has(m.id));\n if (fresh.length === 0) return prev;\n return [...prev, ...fresh];\n });\n lastIdRef.current = newMsgs[newMsgs.length - 1].id;\n }\n } catch {\n // silently retry\n }\n };\n pollRef.current = setInterval(poll, 2000) as unknown as number;\n return () => clearInterval(pollRef.current);\n }, [joined]);\n\n // Scroll on new messages\n useEffect(() => {\n scrollToBottom();\n }, [messages]);\n\n // Focus input after joining\n useEffect(() => {\n if (joined && inputRef.current) {\n inputRef.current.focus();\n }\n }, [joined, loading]);\n\n const handleJoin = (e: Event) => {\n e.preventDefault();\n const name = username.trim();\n if (!name) {\n show(\"Please enter a username\", \"error\");\n return;\n }\n if (name.length < 2) {\n show(\"Username must be at least 2 characters\", \"error\");\n return;\n }\n localStorage.setItem(\"chat_user\", name);\n setUsername(name);\n setJoined(true);\n show(`Welcome, ${name}!`, \"info\");\n };\n\n const handleSend = async (e: Event) => {\n e.preventDefault();\n const msg = input.trim();\n if (!msg) return;\n setSending(true);\n try {\n const res = await fetch(\"/api/chat\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ username, message: msg }),\n });\n if (!res.ok) throw new Error(\"Failed to send\");\n const newMsg = await res.json();\n setMessages((prev) => {\n if (prev.some((m) => m.id === newMsg.id)) return prev;\n return [...prev, newMsg];\n });\n lastIdRef.current = Math.max(lastIdRef.current, newMsg.id);\n setInput(\"\");\n inputRef.current?.focus();\n } catch {\n show(\"Failed to send message\", \"error\");\n } finally {\n setSending(false);\n }\n };\n\n const handleLeave = () => {\n localStorage.removeItem(\"chat_user\");\n setJoined(false);\n setUsername(\"\");\n setMessages([]);\n lastIdRef.current = 0;\n clearInterval(pollRef.current);\n show(\"Left the chat\");\n };\n\n const formatTime = (iso: string) => {\n const d = new Date(iso + \"Z\");\n return d.toLocaleTimeString([], { hour: \"2-digit\", minute: \"2-digit\" });\n };\n\n // --- Join screen ---\n if (!joined) {\n return (\n

💬

Join the Chat

Pick a username to start chatting

\n );\n }\n\n // --- Chat screen ---\n return (\n \n {/* Chat header */}\n

\n \n Chatting as {username}\n \n {onlineCount > 0 && (\n \n \n {onlineCount} recent\n \n )}\n

\n \n Leave Chat\n \n

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

\n {loading ? (\n

Loading messages...

\n ) : messages.length === 0 ? (\n

No messages yet. Say hello! 👋

\n ) : (\n messages.map((msg) => {\n const isMe = msg.username === username;\n return (\n

\n {!isMe &&

{msg.username}

}\n \n {msg.message}\n

\n {formatTime(msg.created_at)}\n

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

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

\n setInput(e.target.value)}\n placeholder=\"Type a message... (Enter to send)\"\n class=\"flex-1 px-4 py-2.5 border border-gray-300 rounded-full focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent text-sm\"\n maxLength={1000}\n />\n \n ▶\n \n \n \n );\n}\n",[],[19,100,183],"83ab14ca-55cc-11f1-a5bf-ee650bb23af1","App.tsx","019e4f51-805e-7440-bcf5-703f0512ce26",4,["D",1779447229580],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport { RequestsTab } from \"./RequestsTab.tsx\";\nimport { ChatTab } from \"./ChatTab.tsx\";\nimport { Toast, ToastProvider, useToast } from \"./Toast.tsx\";\n\nconst TABS = [\"Requests\", \"Chat\"] as const;\ntype Tab = (typeof TABS)[number];\n\nfunction AppInner() {\n const [activeTab, setActiveTab] = useState(\"Requests\");\n\n return (\n

\n {/* Header */}\n

\n 🛟 Assist Hub\n

\n\n {/* Tab Navigation */}\n

\n {TABS.map((tab) => (\n setActiveTab(tab)}\n class={`px-5 py-3 font-medium text-sm border-b-2 transition-colors cursor-pointer ${\n activeTab === tab\n ? \"border-blue-500 text-blue-600\"\n : \"border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300\"\n }`}\n >\n {tab === \"Requests\" ? \"📋\" : \"💬\"} {tab}\n \n ))}\n

\n\n {/* Content */}\n

\n {activeTab === \"Requests\" ? : }\n

\n\n {/* Footer */}\n \n\n \n

\n );\n}\n\nexport function App() {\n return (\n \n \n \n );\n}\n",[],[19,100,191],"73200994-55cc-11f1-a76e-ee650bb23af1",["D",1779447201825],"legacyEnvVars","httpPrivacy","description","Real-time assistance request tracker + chat app","imageUrl","userId","ee5ed74c-a7e6-45dc-8d90-a176c84e74ff","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","019e4f4d-0a71-76e9-81ee-eaf8748fe78c","tursoName","7320099455cc11f1a76eee650bb23af1","tursoHostname","7320099455cc11f1a76eee650bb23af1-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789471840176],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_246":242},"org",{"_11":12,"_239":240,"_241":242,"_205":206,"_243":244,"_245":51},"branch",{"_17":170,"_13":16,"_36":71,"_42":198,"_45":37,"_46":235,"_236":53,"_237":43,"_238":57,"_58":14,"_54":12},88,"forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","displayName","Amin Rzazadə","avatar","https://lh3.googleusercontent.com/a/ACg8ocIvbQMI3giR2j9jJMtVY-gW6KQISBys18TcGMxoZL4qlIHKkQ=s96-c","tier","free","canRestrictVals","profileImageUrl","adoptOrgId",{"_36":198,"_13":14,"_38":331,"_49":-5,"_200":51,"_52":53,"_201":53,"_202":203,"_204":-5,"_205":206,"_207":114,"_208":75,"_209":-5,"_210":-5,"_211":77,"_56":212,"_213":214,"_215":216,"_217":332,"_219":-5,"_220":221,"_222":221,"_223":224,"_225":224,"_226":224,"_227":221,"_228":221,"_229":333,"_231":334,"_233":335,"_50":51},[292,301,303,304],"files",[292,293,294,295,296,297,298,299,300,301,302,303,304],"counts",{"_283":77,"_284":73,"_285":77,"_35":286,"_287":288},[275,276,277,278],{"_36":105,"_13":19,"_66":69,"_68":-5,"_70":71,"_72":73,"_74":75,"_38":106,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_18":274},"upstreamProject",{"_36":43,"_13":59,"_202":270,"_204":271,"_52":53,"_229":272},"upstreamBranch",{"_36":37,"_38":268,"_40":269,"_13":16,"_42":43,"_17":44,"_45":-5,"_46":-5,"_47":48,"_49":-5,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],["D",1785420707976],"Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789531199&sig=c3082dd86ea52a30fbf464ba0f44a3fec10dd3791f436c3bf6ebddd1bfbb94d7",{"_11":55,"_246":273},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789531199&sig=c4c4bdc5c2acbb6312e40d49bdb32dbf55ef8c86dbe1955b3579126e34f9a554",[19],{"_36":99,"_13":100,"_66":101,"_68":69,"_70":71,"_72":73,"_74":75,"_38":102,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_18":282},{"_36":92,"_13":93,"_66":94,"_68":69,"_70":71,"_72":95,"_74":75,"_38":96,"_17":73,"_78":24,"_80":97,"_82":51,"_83":-5,"_18":281},{"_36":85,"_13":86,"_66":87,"_68":69,"_70":71,"_72":88,"_74":75,"_38":89,"_17":73,"_78":24,"_80":90,"_82":51,"_83":-5,"_18":280},{"_36":64,"_13":65,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_38":76,"_17":77,"_78":79,"_80":81,"_82":51,"_83":-5,"_18":279},[19,65],[19,86],[19,93],[19,100],"pulls","branches","forks",{"_289":77,"_291":77},"connections",{"_289":77,"_290":77},"count","unfilledCount","emptyCount",{"_36":105,"_13":19,"_66":69,"_68":-5,"_70":71,"_72":73,"_74":75,"_38":144,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":329,"_18":330},{"_36":99,"_13":100,"_66":101,"_68":69,"_70":71,"_72":73,"_74":75,"_38":160,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":327,"_18":328},{"_36":190,"_13":191,"_66":192,"_68":101,"_70":71,"_72":193,"_74":75,"_38":194,"_17":73,"_78":79,"_80":195,"_82":51,"_83":-5,"_118":325,"_18":326},{"_36":182,"_13":183,"_66":184,"_68":101,"_70":71,"_72":185,"_74":75,"_38":186,"_17":73,"_78":79,"_80":187,"_82":51,"_83":-5,"_118":323,"_18":324},{"_36":175,"_13":176,"_66":177,"_68":101,"_70":71,"_72":32,"_74":75,"_38":178,"_17":73,"_78":79,"_80":179,"_82":51,"_83":-5,"_118":321,"_18":322},{"_36":167,"_13":168,"_66":169,"_68":101,"_70":71,"_72":170,"_74":75,"_38":171,"_17":73,"_78":79,"_80":172,"_82":51,"_83":-5,"_118":319,"_18":320},{"_36":92,"_13":93,"_66":94,"_68":69,"_70":71,"_72":95,"_74":75,"_38":157,"_17":73,"_78":24,"_80":97,"_82":51,"_83":-5,"_118":317,"_18":318},{"_36":85,"_13":86,"_66":87,"_68":69,"_70":71,"_72":88,"_74":75,"_38":154,"_17":73,"_78":24,"_80":90,"_82":51,"_83":-5,"_118":315,"_18":316},{"_36":64,"_13":65,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_38":151,"_17":77,"_78":79,"_80":81,"_82":51,"_83":-5,"_118":313,"_18":314},{"_36":129,"_13":130,"_66":131,"_68":-5,"_70":71,"_72":132,"_74":75,"_38":133,"_17":77,"_78":103,"_80":-5,"_82":51,"_83":-5,"_118":311,"_18":312},{"_36":137,"_13":138,"_66":139,"_68":131,"_70":71,"_72":132,"_74":75,"_38":140,"_17":77,"_78":79,"_80":141,"_82":51,"_83":-5,"_118":309,"_18":310},{"_36":121,"_13":122,"_66":123,"_68":-5,"_70":71,"_72":124,"_74":75,"_38":125,"_17":73,"_78":24,"_80":126,"_82":51,"_83":-5,"_118":307,"_18":308},{"_36":112,"_13":113,"_66":114,"_68":-5,"_70":71,"_72":34,"_74":75,"_38":115,"_17":73,"_78":116,"_80":117,"_82":51,"_83":-5,"_118":305,"_18":306},[],[113],[],[122],[],[130,138],[302],[130],[],[19,65],[],[19,86],[],[19,93],[],[19,100,168],[],[19,100,176],[],[19,100,183],[],[19,100,191],[294,295,296,297],[19,100],[293,298,299,300],[19],["D",1779447201825],["D",1789471840176],{"_11":12,"_246":242},{"_11":12,"_239":240,"_241":242,"_205":206,"_243":244,"_245":51},{"_17":170,"_13":16,"_36":71,"_42":198,"_45":37,"_46":235,"_236":53,"_237":43,"_238":57,"_58":14,"_54":12},"ctx",{"_229":-5,"_265":369,"_370":371,"_372":373,"_374":51,"_375":51,"_376":51,"_377":75,"_378":-5,"_379":-7,"_380":-7,"_381":77,"_382":51,"_383":51,"_384":-5,"_385":51,"_386":51,"_387":51,"_388":-5},"ENV",{"_340":341,"_342":343,"_344":16,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356,"_357":358,"_359":360,"_361":362,"_363":364,"_365":366,"_367":368},"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"]

Submit a Request

\n Previous Requests{\" \"}\n {!loading && ({requests.length})}\n

Join the Chat