[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_317":318,"_319":320},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_236":-5,"_20":237,"_22":238,"_239":240,"_241":242,"_26":243,"_24":244,"_245":246,"_247":248,"_249":51,"_250":251,"_252":71,"_253":-5,"_254":-5,"_255":256},"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/index.html","project",{"_36":187,"_13":14,"_38":188,"_49":-5,"_189":51,"_52":53,"_190":53,"_191":192,"_193":-5,"_194":195,"_196":87,"_197":71,"_198":-5,"_199":-5,"_200":107,"_56":201,"_202":203,"_204":205,"_206":207,"_208":-5,"_209":210,"_211":210,"_212":213,"_214":213,"_215":213,"_216":210,"_217":210,"_218":219,"_220":221,"_222":223,"_50":51},"tree",[81,82,83,84],"file",{"_36":60,"_13":61,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_38":72,"_17":73,"_74":24,"_75":76,"_77":51,"_78":-5,"_18":79},"contents",[],"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","a5d2d57e-55cc-11f1-a5bf-ee650bb23af1","index.html","fileId","019e4f51-805e-7440-bcf5-83dad9eab088","parentId","019e4f51-805e-7440-bcf5-8aa726370d2a","branchId","73250764-55cc-11f1-a76e-ee650bb23af1","branchVersion",8,"latest",true,["D",1779447286881],1,"fileType","content","\n\n \n \n \n Assist Hub\n \n \n \n \n

\n \n \n \n\n","deleted","label",[80,61],"frontend",{"_36":120,"_13":80,"_62":65,"_64":-5,"_66":67,"_68":73,"_70":71,"_38":121,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":122,"_18":123},{"_36":102,"_13":103,"_62":104,"_64":-5,"_66":67,"_68":105,"_70":71,"_38":106,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":109,"_18":110},{"_36":94,"_13":95,"_62":96,"_64":-5,"_66":67,"_68":97,"_70":71,"_38":98,"_17":73,"_74":24,"_75":99,"_77":51,"_78":-5,"_91":100,"_18":101},{"_36":85,"_13":86,"_62":87,"_64":-5,"_66":67,"_68":34,"_70":71,"_38":88,"_17":73,"_74":89,"_75":90,"_77":51,"_78":-5,"_91":92,"_18":93},"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",[],[86],"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",[],[95],"77e6aa50-55cc-11f1-b99b-ee650bb23af1","shared","b2adb296-1951-41d0-87ba-227010ce6b5c",2,["D",1779447209839],0,"directory",[111],[103],{"_36":112,"_13":113,"_62":114,"_64":104,"_66":67,"_68":105,"_70":71,"_38":115,"_17":107,"_74":116,"_75":117,"_77":51,"_78":-5,"_91":118,"_18":119},"77e6873c-55cc-11f1-b99b-ee650bb23af1","db.ts","77e687e6-55cc-11f1-b99b-ee650bb23af1",["D",1779447209839],"script","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",[],[103,113],"732a0ee4-55cc-11f1-a76e-ee650bb23af1",["D",1779447201825],[124,125,126,127],[80],{"_36":146,"_13":147,"_62":148,"_64":65,"_66":67,"_68":73,"_70":71,"_38":149,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":150,"_18":151},{"_36":138,"_13":139,"_62":140,"_64":65,"_66":67,"_68":141,"_70":71,"_38":142,"_17":73,"_74":24,"_75":143,"_77":51,"_78":-5,"_91":144,"_18":145},{"_36":60,"_13":61,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_38":135,"_17":73,"_74":24,"_75":76,"_77":51,"_78":-5,"_91":136,"_18":137},{"_36":128,"_13":129,"_62":130,"_64":65,"_66":67,"_68":73,"_70":71,"_38":131,"_17":107,"_74":116,"_75":132,"_77":51,"_78":-5,"_91":133,"_18":134},"732a0958-55cc-11f1-a76e-ee650bb23af1","index.tsx","019e4f51-805e-7440-bcf5-84332495a9f0",["D",1779447201825],"/** @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();",[],[80,129],["D",1779447286881],[],[80,61],"a87ee696-55cc-11f1-a5bf-ee650bb23af1","favicon.svg","019e4f51-805e-7440-bcf5-7e167d7a24d3",10,["D",1779447291365],"\n\n",[],[80,139],"7329faf8-55cc-11f1-a76e-ee650bb23af1","components","019e4f51-805e-7440-bcf5-7a6c1257b90e",["D",1779447201825],[152,153,154,155],[80,147],{"_36":179,"_13":180,"_62":181,"_64":148,"_66":67,"_68":182,"_70":71,"_38":183,"_17":73,"_74":116,"_75":184,"_77":51,"_78":-5,"_91":185,"_18":186},{"_36":171,"_13":172,"_62":173,"_64":148,"_66":67,"_68":174,"_70":71,"_38":175,"_17":73,"_74":116,"_75":176,"_77":51,"_78":-5,"_91":177,"_18":178},{"_36":164,"_13":165,"_62":166,"_64":148,"_66":67,"_68":32,"_70":71,"_38":167,"_17":73,"_74":116,"_75":168,"_77":51,"_78":-5,"_91":169,"_18":170},{"_36":156,"_13":157,"_62":158,"_64":148,"_66":67,"_68":159,"_70":71,"_38":160,"_17":73,"_74":116,"_75":161,"_77":51,"_78":-5,"_91":162,"_18":163},"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",[],[80,147,157],"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",[],[80,147,165],"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",[],[80,147,172],"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",[],[80,147,180],"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",1789558275908],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_235":231},"org",{"_11":12,"_228":229,"_230":231,"_194":195,"_232":233,"_234":51},"branch",{"_17":159,"_13":16,"_36":67,"_42":187,"_45":37,"_46":224,"_225":53,"_226":43,"_227":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":187,"_13":14,"_38":312,"_49":-5,"_189":51,"_52":53,"_190":53,"_191":192,"_193":-5,"_194":195,"_196":87,"_197":71,"_198":-5,"_199":-5,"_200":107,"_56":201,"_202":203,"_204":205,"_206":313,"_208":-5,"_209":210,"_211":210,"_212":213,"_214":213,"_215":213,"_216":210,"_217":210,"_218":314,"_220":315,"_222":316,"_50":51},[273,282,284,285],"files",[273,274,275,276,277,278,279,280,281,282,283,284,285],"counts",{"_264":107,"_265":73,"_266":107,"_35":267,"_268":269},[],{"_36":60,"_13":61,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_38":72,"_17":73,"_74":24,"_75":76,"_77":51,"_78":-5,"_18":263},"upstreamProject",{"_36":43,"_13":59,"_191":259,"_193":260,"_52":53,"_218":261},"upstreamBranch",{"_36":37,"_38":257,"_40":258,"_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=1789574399&sig=a8d51a028376b0f18dea863670f2a5f39dc2eca62054b0c7661bee5c0457fba4",{"_11":55,"_235":262},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789574399&sig=3d6a0be010e77940e58f104bd06b986c1fe4f3a57bc9d85e134d5d62fe89a483",[80,61],"pulls","branches","forks",{"_270":107,"_272":107},"connections",{"_270":107,"_271":107},"count","unfilledCount","emptyCount",{"_36":120,"_13":80,"_62":65,"_64":-5,"_66":67,"_68":73,"_70":71,"_38":121,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":310,"_18":311},{"_36":146,"_13":147,"_62":148,"_64":65,"_66":67,"_68":73,"_70":71,"_38":149,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":308,"_18":309},{"_36":179,"_13":180,"_62":181,"_64":148,"_66":67,"_68":182,"_70":71,"_38":183,"_17":73,"_74":116,"_75":184,"_77":51,"_78":-5,"_91":306,"_18":307},{"_36":171,"_13":172,"_62":173,"_64":148,"_66":67,"_68":174,"_70":71,"_38":175,"_17":73,"_74":116,"_75":176,"_77":51,"_78":-5,"_91":304,"_18":305},{"_36":164,"_13":165,"_62":166,"_64":148,"_66":67,"_68":32,"_70":71,"_38":167,"_17":73,"_74":116,"_75":168,"_77":51,"_78":-5,"_91":302,"_18":303},{"_36":156,"_13":157,"_62":158,"_64":148,"_66":67,"_68":159,"_70":71,"_38":160,"_17":73,"_74":116,"_75":161,"_77":51,"_78":-5,"_91":300,"_18":301},{"_36":138,"_13":139,"_62":140,"_64":65,"_66":67,"_68":141,"_70":71,"_38":142,"_17":73,"_74":24,"_75":143,"_77":51,"_78":-5,"_91":298,"_18":299},{"_36":60,"_13":61,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_38":135,"_17":73,"_74":24,"_75":76,"_77":51,"_78":-5,"_91":296,"_18":297},{"_36":128,"_13":129,"_62":130,"_64":65,"_66":67,"_68":73,"_70":71,"_38":131,"_17":107,"_74":116,"_75":132,"_77":51,"_78":-5,"_91":294,"_18":295},{"_36":102,"_13":103,"_62":104,"_64":-5,"_66":67,"_68":105,"_70":71,"_38":106,"_17":107,"_74":108,"_75":-5,"_77":51,"_78":-5,"_91":292,"_18":293},{"_36":112,"_13":113,"_62":114,"_64":104,"_66":67,"_68":105,"_70":71,"_38":115,"_17":107,"_74":116,"_75":117,"_77":51,"_78":-5,"_91":290,"_18":291},{"_36":94,"_13":95,"_62":96,"_64":-5,"_66":67,"_68":97,"_70":71,"_38":98,"_17":73,"_74":24,"_75":99,"_77":51,"_78":-5,"_91":288,"_18":289},{"_36":85,"_13":86,"_62":87,"_64":-5,"_66":67,"_68":34,"_70":71,"_38":88,"_17":73,"_74":89,"_75":90,"_77":51,"_78":-5,"_91":286,"_18":287},[],[86],[],[95],[],[103,113],[283],[103],[],[80,129],[],[80,61],[],[80,139],[],[80,147,157],[],[80,147,165],[],[80,147,172],[],[80,147,180],[275,276,277,278],[80,147],[274,279,280,281],[80],["D",1779447201825],["D",1789558275908],{"_11":12,"_235":231},{"_11":12,"_228":229,"_230":231,"_194":195,"_232":233,"_234":51},{"_17":159,"_13":16,"_36":67,"_42":187,"_45":37,"_46":224,"_225":53,"_226":43,"_227":57,"_58":14,"_54":12},"ctx",{"_218":-5,"_254":350,"_351":352,"_353":354,"_355":51,"_356":51,"_357":51,"_358":71,"_359":-5,"_360":-7,"_361":-7,"_362":107,"_363":51,"_364":51,"_365":-5,"_366":51,"_367":51,"_368":51,"_369":-5},"ENV",{"_321":322,"_323":324,"_325":16,"_326":327,"_328":329,"_330":331,"_332":333,"_334":335,"_336":337,"_338":339,"_340":341,"_342":343,"_344":345,"_346":347,"_348":349},"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