\n \n {label}\n \n \n {value != null ? value.toFixed(1) : \"—\"}\n {unit}\n \n

\n );\n}\n\nfunction App() {\n const sensorId = new URLSearchParams(window.location.search).get(\"sensorId\");\n\n const [sensorName, setSensorName] = useState(null);\n const [readings, setReadings] = useState([]);\n const [lastUpdated, setLastUpdated] = useState(null);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n if (!sensorId) return;\n fetch(`${BASE_URL}/sensors/${sensorId}`)\n .then((r) => (r.ok ? r.json() : Promise.reject(`HTTP ${r.status}`)))\n .then((data) => setSensorName(data.name ?? data.port ?? null))\n .catch((e) => setError(String(e)));\n }, [sensorId]);\n\n const fetchData = useCallback(async () => {\n if (!sensorId) return;\n try {\n const res = await fetch(`${BASE_URL}/sensors/${sensorId}/readings`);\n if (!res.ok) throw new Error(`HTTP ${res.status}`);\n const data = await res.json();\n\n // Normalise: val town sqlite returns { columns, rows } or plain array\n let rows: any[] = [];\n if (Array.isArray(data)) {\n rows = data;\n } else if (data.rows) {\n // { columns: [...], rows: [[...], ...] }\n rows = data.rows;\n }\n\n // Sort ascending by recorded_at, keep last 50 points\n rows.sort((a, b) => a.recorded_at?.localeCompare(b.recorded_at));\n setReadings(rows.slice(-50));\n setLastUpdated(new Date());\n setError(null);\n } catch (e: any) {\n setError(e.message);\n }\n }, [sensorId]);\n\n useEffect(() => {\n fetchData();\n const id = setInterval(fetchData, POLL_INTERVAL_MS);\n return () => clearInterval(id);\n }, [fetchData]);\n\n if (!sensorId) {\n return (\n

\n Missing sensorId query parameter.\n

\n );\n }\n\n const latest = readings.at(-1);\n\n const chartData = readings.map((r) => ({\n time: formatTime(r.recorded_at),\n temperature: Number(r.temperature),\n humidity: Number(r.humidity),\n }));\n\n console.log({ chartData, readings });\n\n return (\n

\n {/* Header */}\n

\n ESP32 Sensor Dashboard\n

\n {sensorName ?? latest?.port ?? \"—\"} · auto-refresh every{\" \"}\n {POLL_INTERVAL_MS / 1000}s\n

\n {lastUpdated\n ? (\n <>\n Last updated\n
\n {lastUpdated.toLocaleTimeString()}\n \n )\n : (\n \"Loading…\"\n )}\n

\n\n {/* Error banner */}\n {error && (\n

\n ❌ {error}\n

\n )}\n\n {/* Stat cards */}\n

\n \n \n

\n \n Readings\n \n \n {readings.length}\n \n

\n\n {/* Chart */}\n

\n History\n

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

\n No data yet…\n

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

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request: Request): Promise {\n return new Response(\n `\n \n \n ESP32 Sensor Dashboard\n \n \n \n \n

\n \n \n \n \n `,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n}",[146],"e60cad56-1259-11f1-92e8-42dde27851f2","configs.ts","45acae50-0e8b-11f1-8f1e-42dde27851f2",29,["D",1772031274607],"// Learn more: https://docs.val.town/vals/http/\nexport default async function (req: Request): Promise {\n return Response.json({\n \"send_interval\": 30000,\n \"sensor_pins\": [4],\n \"access_key\": \"b31c58a5-75b8-4b93-9e4a-51cf5204cf24\",\n \"data_url\": \"https://nmsilva--60c307fa0d8411f1971542dde27851f2.web.val.run\",\n });\n}",[154],"7d001726-1263-11f1-9203-42dde27851f2","api.ts","70f64edc-0e8a-11f1-840f-42dde27851f2",30,["D",1772035393325],"// @ts-ignore — npm: specifier resolved by Val Town's Deno runtime\nimport { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\n// @ts-ignore — npm: specifier resolved by Val Town's Deno runtime\nimport { cors } from \"npm:hono/cors\";\n// @ts-ignore — npm: specifier resolved by Val Town's Deno runtime\nimport { Hono } from \"npm:hono@4.0.8\";\n\nconst ACCESS_KEY = \"b31c58a5-75b8-4b93-9e4a-51cf5204cf24\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst app = new Hono();\n\napp.use(\"*\", cors());\n\n// Returns a positive integer or null if raw is not a valid id\nfunction parseId(raw: string): number | null {\n const n = parseInt(raw, 10);\n return Number.isInteger(n) && n > 0 && String(n) === raw ? n : null;\n}\n\n// GET /sensors\napp.get(\"/sensors\", async (c: any) => {\n const { rows } = await sqlite.execute(\n `SELECT id, name, port, created_at FROM sensors ORDER BY id ASC`,\n );\n return c.json(\n rows.map((r: unknown[]) => ({\n id: r[0],\n name: r[1],\n port: r[2],\n created_at: r[3],\n })),\n );\n});\n\n// GET /sensors/:id\napp.get(\"/sensors/:id\", async (c: any) => {\n const id = parseId(c.req.param(\"id\"));\n if (id === null) return c.json({ error: \"Invalid sensor id\" }, 400);\n\n const { rows } = await sqlite.execute(\n `SELECT id, name, port, created_at FROM sensors WHERE id = ?`,\n [id],\n );\n if (rows.length === 0) return c.json({ error: \"Sensor not found\" }, 404);\n\n const r = rows[0] as unknown[];\n return c.json({ id: r[0], name: r[1], port: r[2], created_at: r[3] });\n});\n\n// PATCH /sensors/:id\napp.patch(\"/sensors/:id\", async (c: any) => {\n const id = parseId(c.req.param(\"id\"));\n if (id === null) return c.json({ error: \"Invalid sensor id\" }, 400);\n\n let body: Record;\n try {\n body = await c.req.json();\n } catch {\n return c.json({ error: \"Invalid JSON body\" }, 400);\n }\n\n if (body.access_key !== ACCESS_KEY) {\n return c.json({ error: \"Unauthorized\" }, 401);\n }\n if (!body.name) {\n return c.json({ error: \"Missing required field: name\" }, 400);\n }\n\n const check = await sqlite.execute(`SELECT id FROM sensors WHERE id = ?`, [\n id,\n ]);\n if (check.rows.length === 0) {\n return c.json({ error: \"Sensor not found\" }, 404);\n }\n\n await sqlite.execute(`UPDATE sensors SET name = ? WHERE id = ?`, [\n body.name,\n id,\n ]);\n\n const { rows } = await sqlite.execute(\n `SELECT id, name, port, created_at FROM sensors WHERE id = ?`,\n [id],\n );\n const r = rows[0] as unknown[];\n return c.json({ id: r[0], name: r[1], port: r[2], created_at: r[3] });\n});\n\n// DELETE /sensors/:id\napp.delete(\"/sensors/:id\", async (c: any) => {\n const id = parseId(c.req.param(\"id\"));\n if (id === null) return c.json({ error: \"Invalid sensor id\" }, 400);\n\n let body: Record;\n try {\n body = await c.req.json();\n } catch {\n return c.json({ error: \"Invalid JSON body\" }, 400);\n }\n\n if (body.access_key !== ACCESS_KEY) {\n return c.json({ error: \"Unauthorized\" }, 401);\n }\n\n const check = await sqlite.execute(`SELECT id FROM sensors WHERE id = ?`, [\n id,\n ]);\n if (check.rows.length === 0) {\n return c.json({ error: \"Sensor not found\" }, 404);\n }\n\n const countResult = await sqlite.execute(\n `SELECT COUNT(*) FROM sensor_readings WHERE sensor_id = ?`,\n [id],\n );\n const readings_removed = (countResult.rows[0] as unknown[])[0];\n\n await sqlite.execute(`DELETE FROM sensor_readings WHERE sensor_id = ?`, [id]);\n await sqlite.execute(`DELETE FROM sensors WHERE id = ?`, [id]);\n\n return c.json({ deleted: { sensor_id: id, readings_removed } });\n});\n\n// GET /sensors/:id/readings\napp.get(\"/sensors/:id/readings\", async (c: any) => {\n const id = parseId(c.req.param(\"id\"));\n if (id === null) return c.json({ error: \"Invalid sensor id\" }, 400);\n\n const check = await sqlite.execute(`SELECT id FROM sensors WHERE id = ?`, [\n id,\n ]);\n if (check.rows.length === 0) {\n return c.json({ error: \"Sensor not found\" }, 404);\n }\n\n const rawLimit = c.req.query(\"limit\");\n const limit = rawLimit\n ? Math.min(Math.max(parseInt(rawLimit, 10) || 100, 1), 500)\n : 100;\n\n const { rows } = await sqlite.execute(\n `SELECT id, sensor_id, port, temperature, humidity, recorded_at\n FROM sensor_readings\n WHERE sensor_id = ?\n ORDER BY recorded_at DESC\n LIMIT ?`,\n [id, limit],\n );\n return c.json(\n rows.map((r: unknown[]) => ({\n id: r[0],\n sensor_id: r[1],\n port: r[2],\n temperature: r[3],\n humidity: r[4],\n recorded_at: r[5],\n })),\n );\n});\n\nexport default app.fetch;",[161],"12fdeda0-1266-11f1-a64e-42dde27851f2","database","10001ae2-1266-11f1-8a9e-42dde27851f2",34,["D",1772036503963],1,"directory",[168],"pulls","branches","forks","envVars",{"_182":61,"_184":61},"connections",{"_182":61,"_183":61},"count","unfilledCount","emptyCount",{"_44":167,"_32":168,"_30":169,"_136":-5,"_42":43,"_41":170,"_138":123,"_39":208,"_13":172,"_34":173,"_36":-5,"_24":25,"_143":-5,"_192":209,"_27":210},{"_44":204,"_32":38,"_30":31,"_136":169,"_42":43,"_41":14,"_138":25,"_39":205,"_13":172,"_34":35,"_36":37,"_24":25,"_143":-5,"_192":206,"_27":207},{"_44":160,"_32":161,"_30":162,"_136":-5,"_42":43,"_41":163,"_138":123,"_39":201,"_13":140,"_34":141,"_36":165,"_24":25,"_143":-5,"_192":202,"_27":203},{"_44":153,"_32":154,"_30":155,"_136":-5,"_42":43,"_41":156,"_138":123,"_39":198,"_13":140,"_34":141,"_36":158,"_24":25,"_143":-5,"_192":199,"_27":200},{"_44":145,"_32":146,"_30":147,"_136":-5,"_42":43,"_41":148,"_138":25,"_39":195,"_13":150,"_34":141,"_36":151,"_24":25,"_143":-5,"_192":196,"_27":197},{"_44":133,"_32":134,"_30":135,"_136":-5,"_42":43,"_41":137,"_138":123,"_39":191,"_13":140,"_34":141,"_36":142,"_24":25,"_143":-5,"_192":193,"_27":194},["D",1772035413014],"children",[],[134],["D",1772035425604],[],[146],["D",1772031274607],[],[154],["D",1772035393325],[],[161],"193ce0e0-1266-11f1-8a9e-42dde27851f2",["D",1772036514447],[],[168,38],["D",1772036503963],[186],[168],["D",1771499763519],["D",1789528252206],{"_98":97,"_105":101},{"_98":97,"_99":-5,"_100":101,"_18":55,"_102":103,"_104":25},{"_13":87,"_32":88,"_44":43,"_89":45,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":46,"_96":97},"ctx",{"_80":-5,"_125":249,"_250":251,"_252":253,"_254":25,"_255":25,"_256":25,"_257":123,"_258":-5,"_259":-7,"_260":-7,"_261":61,"_262":25,"_263":25,"_264":-5,"_265":25,"_266":25,"_267":25,"_268":-5},"ENV",{"_220":221,"_222":223,"_224":88,"_225":226,"_227":228,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244,"_245":246,"_247":248},"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"]

Diff · v36