[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_182":183,"_184":185},"routes/_app.x.$handle.$name",{"_105":104,"_32":50,"_114":95,"_27":115,"_13":14,"_116":-5,"_11":117,"_118":119,"_120":121,"_122":123,"_124":125,"_21":-5,"_126":-5,"_127":-5,"_128":25,"_129":130,"_131":64,"_132":-5,"_133":-5,"_134":135},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_48":49,"_32":50,"_36":51,"_52":-5,"_53":25,"_54":55,"_56":55,"_57":58,"_59":-5,"_18":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":76,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":88,"_89":90,"_91":92,"_93":25},"version",3,"changes",[19,20],"aiChatInfo","userId",{"_21":41,"_23":-7,"_24":25,"_26":25,"_27":42,"_29":42},{"_21":22,"_23":-7,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":-5,"_36":37,"_38":14,"_39":40,"_24":25},"previous","deleted",false,"deletedHere","path","backend","latestPath","fileId","8e92c53c-11df-463e-aac7-0a8b38124988","name","fileType","directory","content","createdAt",["D",1781376790297],"branchVersion","branchId","b06b90cc-3145-4e0c-a601-5498a45bf388",{"_30":43,"_32":44,"_33":45,"_35":46,"_36":47,"_38":14,"_39":40,"_24":25},"backend/db.ts","1f7c8fd0-6759-11f1-95fe-1607ee4eb77e","db.ts","script","import { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport { listFiles, readFile } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport type Artifact = {\n id: string;\n name: string;\n html: string;\n createdBy: string;\n createdAt: number;\n};\n\nconst TABLE = \"artifacts_v1\";\n\nlet ready: Promise | null = null;\n\n/** Idempotent: creates the table and seeds the example artifacts once. */\nexport function initDb(): Promise {\n if (!ready) ready = setup();\n return ready;\n}\n\nasync function setup() {\n await sqlite.execute(\n `CREATE TABLE IF NOT EXISTS ${TABLE} (\n id TEXT PRIMARY KEY,\n name TEXT NOT NULL,\n html TEXT NOT NULL,\n created_by TEXT NOT NULL,\n created_at INTEGER NOT NULL\n )`,\n );\n await seedExamples();\n}\n\n// Seed examples/*.html on first run so a fresh remix isn't empty. These are\n// real files in the val — edit or delete them and they won't come back.\nasync function seedExamples() {\n const { rows } = await sqlite.execute(`SELECT COUNT(*) AS n FROM ${TABLE}`);\n if (Number(rows[0].n) > 0) return;\n const files = await listFiles();\n const examples = files\n .filter((f: any) =>\n f.type === \"file\" && f.path.startsWith(\"examples/\") &&\n f.path.endsWith(\".html\")\n )\n .map((f: any) => f.path as string)\n .sort();\n for (const path of examples) {\n const html = await readFile(path);\n const name = path.replace(/^examples\\//, \"\").replace(/\\.html$/, \"\");\n await createArtifact({ name, html, createdBy: \"example\" });\n }\n}\n\nfunction newId() {\n return crypto.randomUUID().replace(/-/g, \"\").slice(0, 10);\n}\n\nexport async function createArtifact(\n input: { name: string; html: string; createdBy: string },\n): Promise {\n const id = newId();\n await sqlite.execute({\n sql:\n `INSERT INTO ${TABLE} (id, name, html, created_by, created_at) VALUES (?, ?, ?, ?, ?)`,\n args: [id, input.name, input.html, input.createdBy, Date.now()],\n });\n return id;\n}\n\n/** List metadata only (no html) for the dashboard. */\nexport async function listArtifacts(): Promise {\n const { rows } = await sqlite.execute(\n `SELECT id, name, created_by, created_at FROM ${TABLE} ORDER BY created_at DESC`,\n );\n return rows.map(toArtifact);\n}\n\nexport async function getArtifact(id: string): Promise {\n const { rows } = await sqlite.execute({\n sql:\n `SELECT id, name, html, created_by, created_at FROM ${TABLE} WHERE id = ?`,\n args: [id],\n });\n if (!rows.length) return null;\n return { ...toArtifact(rows[0]), html: rows[0].html as string };\n}\n\nexport async function deleteArtifact(id: string): Promise {\n await sqlite.execute({ sql: `DELETE FROM ${TABLE} WHERE id = ?`, args: [id] });\n}\n\nfunction toArtifact(r: any): Artifact {\n return {\n id: r.id as string,\n name: r.name as string,\n html: \"\",\n createdBy: r.created_by as string,\n createdAt: Number(r.created_at),\n };\n}\n",["D",1781376790297],"id","d790bcce-8376-49d3-8ba5-0bbcf66987bc","team-artifacts",["D",1781376559300],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Host and share HTML and Markdown artifacts with your team","imageUrl","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","95d06ed2-6758-11f1-8f78-1607ee4eb77e","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019aa807-52c2-709c-928b-2029bae9a558","tursoName","d790bcce837649d38ba50bbcf66987bc","tursoHostname","d790bcce837649d38ba50bbcf66987bc-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789500689328],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_105":104,"_113":109},"org",{"_105":104,"_106":107,"_108":109,"_18":-5,"_110":111,"_112":64},"branch",{"_13":94,"_32":95,"_48":40,"_96":49,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":50,"_103":104},"isOwned",50,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","templates","handle","displayName","Templates","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789556399&sig=d4d039bf60786a03d56ec8a29ec1b19630253aab318e490fcd07a6f24846b070","tier","business","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_48":49,"_32":50,"_36":177,"_52":-5,"_53":25,"_54":55,"_56":55,"_57":58,"_59":-5,"_18":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":178,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":179,"_89":180,"_91":181,"_93":25},"tree",[163,165],"files",[163,164,165],"counts",{"_153":68,"_154":144,"_155":141,"_156":157,"_158":159},"contents",[136,137],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_48":150,"_32":28,"_30":31,"_140":-5,"_39":40,"_38":14,"_142":64,"_36":151,"_13":68,"_33":34,"_35":-5,"_24":25,"_147":-5,"_27":152},{"_48":138,"_32":139,"_30":62,"_140":-5,"_39":40,"_38":141,"_142":25,"_36":143,"_13":144,"_33":145,"_35":146,"_24":25,"_147":148,"_27":149},"aabfa83d-8d16-440a-91b9-c22d9fee0f38","main.tsx","parentId",2,"latest",["D",1781376687822],1,"http","/** @jsxImportSource npm:hono@4/jsx */\nimport { Hono } from \"npm:hono@4\";\nimport {\n getOAuthUserData,\n oauthMiddleware,\n} from \"https://esm.town/v/std/oauth/middleware.ts\";\nimport { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\n\nimport {\n createArtifact,\n deleteArtifact,\n getArtifact,\n initDb,\n listArtifacts,\n} from \"./backend/db.ts\";\nimport { Layout } from \"./frontend/Layout.tsx\";\nimport { Landing } from \"./frontend/Landing.tsx\";\nimport { Dashboard } from \"./frontend/Dashboard.tsx\";\nimport { Viewer } from \"./frontend/Viewer.tsx\";\nimport { AccessDenied } from \"./frontend/AccessDenied.tsx\";\n\n// The org this app gates to = whoever owns the val. Remix it into your own org\n// and it automatically becomes private to your team — nothing to configure.\nconst ORG = parseVal().username;\n\nawait initDb();\n\nconst app = new Hono();\napp.onError((err) => Promise.reject(err)); // surface real stack traces\n\n// Render a JSX page as a full HTML document.\nconst page = (node: any, status = 200) =>\n new Response(\"\" + node.toString(), {\n status,\n headers: { \"content-type\": \"text/html; charset=utf-8\" },\n });\n\n// Require a logged-in member of this val's org. Gates every read/write route.\nconst requireOrg = async (c: any, next: any) => {\n const session = await getOAuthUserData(c.req.raw);\n if (!session?.user) return c.redirect(\"/auth/login\");\n if (!session.isOrgMember) {\n return page(\n \n \n ,\n 403,\n );\n }\n c.set(\"user\", session.user);\n await next();\n};\n\n// Public landing → dashboard for members, marketing for everyone else.\napp.get(\"/\", async (c) => {\n const session = await getOAuthUserData(c.req.raw);\n if (!session?.user) {\n return page();\n }\n if (!session.isOrgMember) {\n return page(\n \n \n ,\n 403,\n );\n }\n const artifacts = await listArtifacts();\n return page(\n \n \n ,\n );\n});\n\n// Create an artifact from a dropped/selected HTML file.\napp.post(\"/upload\", requireOrg, async (c) => {\n const form = await c.req.formData();\n const file = form.get(\"file\");\n const html = file instanceof File\n ? await file.text()\n : (form.get(\"html\")?.toString() ?? \"\");\n if (!html.trim()) return c.json({ error: \"Empty HTML\" }, 400);\n const rawName = form.get(\"name\")?.toString()\n || (file instanceof File ? file.name : \"\")\n || \"untitled\";\n const name = rawName.replace(/\\.html?$/i, \"\").trim().slice(0, 80) || \"untitled\";\n const user = c.get(\"user\");\n const id = await createArtifact({\n name,\n html,\n createdBy: user.username ?? user.id,\n });\n return c.json({ id, url: `/a/${id}` });\n});\n\n// View an artifact, rendered inside a sandboxed iframe (see Viewer).\napp.get(\"/a/:id\", requireOrg, async (c) => {\n const artifact = await getArtifact(c.req.param(\"id\"));\n if (!artifact) {\n return page(, 404);\n }\n return page(\n ,\n );\n});\n\n// Raw artifact HTML — only ever loaded as the sandboxed iframe's source.\napp.get(\"/a/:id/raw\", requireOrg, async (c) => {\n const artifact = await getArtifact(c.req.param(\"id\"));\n if (!artifact) return c.text(\"Not found\", 404);\n return new Response(artifact.html, {\n headers: { \"content-type\": \"text/html; charset=utf-8\" },\n });\n});\n\napp.post(\"/a/:id/delete\", requireOrg, async (c) => {\n await deleteArtifact(c.req.param(\"id\"));\n return c.redirect(\"/\");\n});\n\n// Drag-and-drop client script (kept out of the markup per house style).\napp.get(\n \"/upload.client.js\",\n (c) => serveFile(\"./frontend/upload.client.ts\", import.meta.url),\n);\n\n// Every Val Town app links to its own source.\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\nexport default oauthMiddleware(app.fetch);\n","label","artifacts-demo",[139],"f21e7a0a-9b8d-4e09-be62-f7880b77ea61",["D",1781376790297],[28],"pulls","branches","forks","envVars",{"_160":68,"_162":68},"connections",{"_160":68,"_161":68},"count","unfilledCount","emptyCount",{"_48":150,"_32":28,"_30":31,"_140":-5,"_39":40,"_38":14,"_142":64,"_36":174,"_13":68,"_33":34,"_35":-5,"_24":25,"_147":-5,"_167":175,"_27":176},{"_48":170,"_32":44,"_30":43,"_140":31,"_39":40,"_38":14,"_142":25,"_36":171,"_13":68,"_33":45,"_35":46,"_24":25,"_147":-5,"_167":172,"_27":173},{"_48":138,"_32":139,"_30":62,"_140":-5,"_39":40,"_38":141,"_142":25,"_36":166,"_13":144,"_33":145,"_35":146,"_24":25,"_147":148,"_167":168,"_27":169},["D",1781376687822],"children",[],[139],"1672de06-d6b1-4bd7-8805-c6f9f349aaba",["D",1781376790297],[],[28,44],["D",1781376790297],[164],[28],["D",1781376559300],["D",1789500689328],{"_105":104,"_113":109},{"_105":104,"_106":107,"_108":109,"_18":-5,"_110":111,"_112":64},{"_13":94,"_32":95,"_48":40,"_96":49,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":50,"_103":104},"ctx",{"_87":-5,"_133":215,"_216":217,"_218":219,"_220":25,"_221":25,"_222":25,"_223":64,"_224":-5,"_225":-7,"_226":-7,"_227":68,"_228":25,"_229":25,"_230":-5,"_231":25,"_232":25,"_233":25,"_234":-5},"ENV",{"_186":187,"_188":189,"_190":95,"_191":192,"_193":194,"_195":196,"_197":198,"_199":200,"_201":202,"_203":204,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214},"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 · v3