[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_192":193,"_194":195},"routes/_app.x.$handle.$name",{"_95":94,"_31":42,"_103":85,"_26":104,"_13":14,"_105":-5,"_11":106,"_107":108,"_109":110,"_111":112,"_113":114,"_20":-5,"_115":-5,"_116":-5,"_117":24,"_118":119,"_120":121,"_122":-5,"_123":-5,"_124":125},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_40":41,"_31":42,"_35":43,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":-5,"_54":24,"_55":-5,"_56":-5,"_57":58,"_59":60,"_61":62,"_63":64,"_65":66,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":24},"version",15,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":27,"_32":20,"_33":34,"_35":36,"_37":14,"_38":39,"_23":24},"previous","deleted",false,"deletedHere","path","biome.json","latestPath","fileId","a5e22c16-fca0-11f0-95a6-42dde27851f2","name","fileType","content","{\n \"$schema\": \"https://biomejs.dev/schemas/2.3.12/schema.json\",\n \"vcs\": { \"enabled\": true, \"clientKind\": \"git\", \"useIgnoreFile\": true },\n \"files\": { \"ignoreUnknown\": false },\n \"formatter\": { \"enabled\": true, \"indentStyle\": \"tab\" },\n \"linter\": { \"enabled\": true, \"rules\": { \"recommended\": true } },\n \"javascript\": { \"formatter\": { \"quoteStyle\": \"double\" } },\n \"assist\": {\n \"enabled\": true,\n \"actions\": { \"source\": { \"organizeImports\": \"on\" } }\n }\n}","createdAt",["D",1769642735606],"branchVersion","branchId","a54800ec-fc9f-11f0-8e29-42dde27851f2","id","a5476cfe-fc9f-11f0-8e29-42dde27851f2","searchValCode",["D",1769642305137],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Search through all files in your vals for specific strings","imageUrl","5d1042a9-7b0b-499d-8a72-3a8ac7a4e185","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","5f80108f-7ca4-4327-b77b-089dbe4b5a82","tursoName","a5476cfefc9f11f08e2942dde27851f2","tursoHostname","a5476cfefc9f11f08e2942dde27851f2-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789506649022],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_95":94,"_102":98},"org",{"_95":94,"_96":-5,"_97":98,"_18":52,"_99":100,"_101":24},"branch",{"_13":84,"_31":85,"_40":39,"_86":41,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":42,"_93":94},"isOwned",20,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","nbbaier","handle","displayName","avatar","https://secure.gravatar.com/avatar/0129a541b7b3574e92c4afd06c5e32da&d=identicon","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_40":41,"_31":42,"_35":187,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":-5,"_54":24,"_55":-5,"_56":-5,"_57":58,"_59":60,"_61":62,"_63":64,"_65":188,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":189,"_79":190,"_81":191,"_83":24},"tree",[170,171,172,173],"files",[170,171,172,173],"counts",{"_159":58,"_160":161,"_162":58,"_163":164,"_165":166},"contents",[126,127,128,129],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_40":152,"_31":153,"_29":154,"_133":-5,"_38":39,"_37":155,"_135":121,"_35":156,"_13":58,"_32":20,"_33":157,"_23":24,"_140":-5,"_26":158},{"_40":149,"_31":27,"_29":30,"_133":-5,"_38":39,"_37":14,"_135":121,"_35":150,"_13":58,"_32":20,"_33":34,"_23":24,"_140":-5,"_26":151},{"_40":142,"_31":143,"_29":144,"_133":-5,"_38":39,"_37":145,"_135":121,"_35":146,"_13":58,"_32":20,"_33":147,"_23":24,"_140":-5,"_26":148},{"_40":130,"_31":131,"_29":132,"_133":-5,"_38":39,"_37":134,"_135":24,"_35":136,"_13":137,"_32":138,"_33":139,"_23":24,"_140":-5,"_26":141},"9b79bd98-fca0-11f0-b907-42dde27851f2","main.ts","a54c9e86-fc9f-11f0-8e29-42dde27851f2","parentId",12,"latest",["D",1769642718159],11,"http","import ValTown from \"npm:@valtown/sdk@3.6.2\";\n\ninterface ValInfo {\n id: string;\n name: string;\n identifier: string;\n privacy: string;\n links: {\n html: string;\n };\n}\n\ninterface FileInfo {\n name: string;\n path: string;\n type: \"file\" | \"directory\" | \"http\" | \"script\" | \"interval\" | \"email\";\n}\n\ninterface FileMatch {\n filePath: string;\n fileUrl: string;\n matches: LineMatch[];\n}\n\ninterface LineMatch {\n lineNumber: number;\n content: string;\n}\n\ninterface SearchResult {\n valName: string;\n valIdentifier: string;\n valUrl: string;\n files: FileMatch[];\n totalMatches: number;\n}\n\ninterface SearchStats {\n totalVals: number;\n totalFiles: number;\n valsWithMatches: number;\n filesWithMatches: number;\n totalMatches: number;\n searchDuration: number;\n errors: string[];\n}\n\n// File extensions to search (code files)\nconst SEARCHABLE_EXTENSIONS = [\n \".ts\",\n \".tsx\",\n \".js\",\n \".jsx\",\n \".mjs\",\n \".cjs\",\n \".json\",\n \".md\",\n \".txt\",\n \".html\",\n \".css\",\n \".yaml\",\n \".yml\",\n \".toml\",\n \".xml\",\n \".sql\",\n \".sh\",\n \".env\",\n];\n\nfunction isSearchableFile(filename: string): boolean {\n const lower = filename.toLowerCase();\n return SEARCHABLE_EXTENSIONS.some((ext) => lower.endsWith(ext)) ||\n // Also include files without extensions that are commonly code\n [\"makefile\", \"dockerfile\", \"readme\", \"license\", \"changelog\"].includes(\n lower,\n );\n}\n\nasync function getAllVals(client: ValTown): Promise {\n const vals: ValInfo[] = [];\n let offset = 0;\n const limit = 100;\n\n while (true) {\n const response = await client.me.vals.list({ limit, offset });\n vals.push(...response.data as ValInfo[]);\n\n if (!response.data || response.data.length < limit) {\n break;\n }\n offset += limit;\n }\n\n return vals;\n}\n\nasync function getAllFiles(\n valId: string,\n client: ValTown,\n path: string = \"\",\n): Promise {\n const files: FileInfo[] = [];\n\n try {\n const response = await client.vals.files.list(valId, {\n path: path || undefined,\n });\n\n for (const item of response.data) {\n if (item.type === \"directory\") {\n // Recursively get files from subdirectories\n const subFiles = await getAllFiles(valId, client, item.path);\n files.push(...subFiles);\n } else {\n files.push(item as FileInfo);\n }\n }\n } catch (err) {\n // Silently skip errors (e.g., permission issues)\n }\n\n return files;\n}\n\nasync function getFileContent(\n valId: string,\n filePath: string,\n client: ValTown,\n): Promise {\n try {\n const content = await client.vals.files.getContent(valId, filePath);\n return content as string;\n } catch {\n return null;\n }\n}\n\nfunction searchInContent(\n content: string,\n searchTerms: string[],\n matchAll: boolean,\n): LineMatch[] {\n const lines = content.split(\"\\n\");\n const matches: LineMatch[] = [];\n\n for (let i = 0; i < lines.length; i++) {\n const line = lines[i];\n const lineLower = line.toLowerCase();\n\n let shouldInclude = false;\n\n if (matchAll) {\n // All terms must be present in the line\n shouldInclude = searchTerms.every((term) =>\n lineLower.includes(term.toLowerCase())\n );\n } else {\n // Any term can match\n shouldInclude = searchTerms.some((term) =>\n lineLower.includes(term.toLowerCase())\n );\n }\n\n if (shouldInclude) {\n matches.push({\n lineNumber: i + 1,\n content: line.trim(),\n });\n }\n }\n\n return matches;\n}\n\nfunction escapeHtml(text: string): string {\n return text\n .replace(/&/g, \"&\")\n .replace(//g, \">\")\n .replace(/\"/g, \""\")\n .replace(/'/g, \"'\");\n}\n\nfunction highlightMatches(text: string, searchTerms: string[]): string {\n let escaped = escapeHtml(text);\n\n for (const term of searchTerms) {\n const escapedTerm = escapeHtml(term).replace(\n /[.*+?^${}()|[\\\\]\\\\]/g,\n \"\\\\$&\",\n );\n const regex = new RegExp(`(${escapedTerm})`, \"gi\");\n escaped = escaped.replace(regex, \"$1\");\n }\n\n return escaped;\n}\n\nfunction getStyles(): string {\n return `\n \n `;\n}\n\nfunction renderSearchForm(\n query: string = \"\",\n matchAll: boolean = false,\n): string {\n return `\n \n `;\n}\n\nexport default async function (req: Request): Promise {\n const url = new URL(req.url);\n const query = url.searchParams.get(\"q\")?.trim();\n const format = url.searchParams.get(\"format\");\n const matchAll = url.searchParams.get(\"matchAll\") === \"1\";\n const maxMatchesPerFile = 10; // Limit matches shown per file\n const maxFilesPerVal = 20; // Limit files shown per val\n\n const styles = getStyles();\n\n // Return search form if no query\n if (!query) {\n return new Response(\n `\n\n\n \n \n Val Code Search\n ${styles}\n\n\n

🔍 Val Code Search

Search through all files in your Val Town projects

\n ${renderSearchForm()}\n

Usage Tips

Enter a single term: sqlite
Search multiple terms (OR): fetch, request
Check \"Match ALL\" for AND behavior: import, react
Searches are case-insensitive
Add &format=json for JSON output

\n\n`,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n }\n\n const searchTerms = query.split(\",\").map((t) => t.trim()).filter((t) =>\n t.length > 0\n );\n\n if (searchTerms.length === 0) {\n return new Response(\"No valid search terms provided\", { status: 400 });\n }\n\n const client = new ValTown();\n const startTime = Date.now();\n\n const stats: SearchStats = {\n totalVals: 0,\n totalFiles: 0,\n valsWithMatches: 0,\n filesWithMatches: 0,\n totalMatches: 0,\n searchDuration: 0,\n errors: [],\n };\n\n try {\n const vals = await getAllVals(client);\n stats.totalVals = vals.length;\n\n console.log(`Found ${vals.length} vals to search`);\n\n const results: SearchResult[] = [];\n\n for (const val of vals) {\n const files = await getAllFiles(val.id, client);\n console.log(`Val ${val.name}: found ${files.length} files`);\n const searchableFiles = files.filter((f) => isSearchableFile(f.name));\n console.log(\n `Val ${val.name}: ${searchableFiles.length} searchable files`,\n );\n stats.totalFiles += searchableFiles.length;\n\n const fileMatches: FileMatch[] = [];\n\n for (const file of searchableFiles) {\n const content = await getFileContent(val.id, file.path, client);\n if (!content) continue;\n\n const matches = searchInContent(content, searchTerms, matchAll);\n\n if (matches.length > 0) {\n stats.filesWithMatches++;\n stats.totalMatches += matches.length;\n\n fileMatches.push({\n filePath: file.path,\n fileUrl: `${val.links.html}/${file.path}`,\n matches: matches.slice(0, maxMatchesPerFile),\n });\n }\n }\n\n if (fileMatches.length > 0) {\n stats.valsWithMatches++;\n results.push({\n valName: val.name,\n valIdentifier: val.identifier,\n valUrl: val.links.html,\n files: fileMatches.slice(0, maxFilesPerVal),\n totalMatches: fileMatches.reduce(\n (sum, f) => sum + f.matches.length,\n 0,\n ),\n });\n }\n }\n\n stats.searchDuration = Date.now() - startTime;\n\n // Sort results by total matches (descending)\n results.sort((a, b) => b.totalMatches - a.totalMatches);\n\n // Return JSON if requested\n if (format === \"json\") {\n return new Response(\n JSON.stringify(\n { query, searchTerms, matchAll, results, stats },\n null,\n 2,\n ),\n { headers: { \"Content-Type\": \"application/json\" } },\n );\n }\n\n // Render HTML results\n const resultsHtml = results.length > 0\n ? results.map((r) => `\n

📁 ${\n escapeHtml(r.valName)\n }

${r.totalMatches} match${\n r.totalMatches === 1 ? \"\" : \"es\"\n } in ${r.files.length} file${r.files.length === 1 ? \"\" : \"s\"}

\n ${\n r.files.map((f) => `\n

📄 ${\n escapeHtml(f.filePath)\n }

\n ${\n f.matches.map((m) => `\n

\n L${m.lineNumber}\n ${\n highlightMatches(m.content.substring(0, 200), searchTerms)\n }${m.content.length > 200 ? \"...\" : \"\"}\n

\n `).join(\"\")\n }\n ${\n f.matches.length >= maxMatchesPerFile\n ? `

... and more matches

`\n : \"\"\n }\n

\n `).join(\"\")\n }\n

\n `).join(\"\")\n : `

No files found containing \"${escapeHtml(query)}\"

Searched ${stats.totalFiles} files across ${stats.totalVals} vals

`;\n\n return new Response(\n `\n\n\n \n \n Search: \"${escapeHtml(query)}\" - Val Code Search\n ${styles}\n\n\n

🔍 Val Code Search

\n ${renderSearchForm(query, matchAll)}\n ${\n results.length > 0\n ? `\n

\n Found ${stats.totalMatches} match${\n stats.totalMatches === 1 ? \"\" : \"es\"\n } \n in ${stats.filesWithMatches} file${\n stats.filesWithMatches === 1 ? \"\" : \"s\"\n } \n across ${stats.valsWithMatches} val${\n stats.valsWithMatches === 1 ? \"\" : \"s\"\n }\n
\n Searched ${stats.totalFiles} files in ${stats.totalVals} vals (${\n (stats.searchDuration / 1000).toFixed(2)\n }s)\n

\n `\n : \"\"\n }\n ${resultsHtml}\n\n`,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n } catch (error) {\n stats.searchDuration = Date.now() - startTime;\n\n if (format === \"json\") {\n return new Response(\n JSON.stringify({ error: error.message, stats }, null, 2),\n { status: 500, headers: { \"Content-Type\": \"application/json\" } },\n );\n }\n\n return new Response(\n `\n\n\n \n Error - Val Code Search\n ${styles}\n\n\n

❌ Error

Something went wrong: ${escapeHtml(error.message)}

\n ← Back to search\n\n`,\n { status: 500, headers: { \"Content-Type\": \"text/html\" } },\n );\n }\n}","label",[131],"a5d6706a-fca0-11f0-95a6-42dde27851f2","deno.json","a5d6713c-fca0-11f0-95a6-42dde27851f2",13,["D",1769642735565],"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/348900b8b79f4a434cab4c74b3bc8d4d2fa8ee74/cli/schemas/config-file.v1.json\",\n \"compilerOptions\": {\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ],\n \"noImplicitAny\": false,\n \"strict\": false,\n \"types\": [\"https://www.val.town/types/valtown.d.ts\"]\n },\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-sloppy-imports\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true\n },\n \"imports\": {\n \"@biomejs/biome\": \"npm:@biomejs/biome@^2.3.12\"\n },\n \"lint\": {\n \"files\": {\n \"include\": [\"deno:/https/esm.town/**/*\"]\n },\n \"rules\": {\n \"exclude\": [\"no-explicit-any\", \"no-import-prefix\"]\n }\n },\n \"lock\": false,\n \"nodeModulesDir\": \"auto\"\n}",[143],"a5e22b08-fca0-11f0-95a6-42dde27851f2",["D",1769642735606],[27],"a5dd9e30-fca0-11f0-a068-42dde27851f2","AGENTS.md","a5dd9eee-fca0-11f0-a068-42dde27851f2",14,["D",1769642735601],"You are an advanced assistant specialized in generating Val Town code.\n\n## Runtime Environment\n\nVal Town uses **Deno** as its runtime in a serverless context.\n\n### Security Constraints\n\n- **No filesystem access**: Vals cannot read or write local files\n- **No FFI (Foreign Function Interface)**: Cannot call native code\n- **No subprocesses**: Cannot spawn child processes\n- **Network access allowed**: HTTP requests are permitted\n- **Environment variables**: Accessible via `Deno.env.get()`\n\n### Performance Characteristics\n\n- **Cold start time**: 100ms+ for first request (includes dependency installation)\n- **Warm instances**: Subsequent requests are much faster when val stays warm\n- Prefer lightweight packages to reduce cold start time\n\n### Key Differences from Node.js\n\n1. **No `require()`**: Use ES modules (`import/export`) only\n2. **No `__dirname` or `__filename`**: Not available in Deno\n3. **Explicit file extensions**: Must include `.ts`, `.tsx`, or `.js` in relative imports\n4. **Top-level await**: Supported natively\n5. **NPM packages require `npm:` prefix**: Or use `https://esm.sh`\n\n## Core Guidelines\n\n- Ask clarifying questions when requirements are ambiguous\n- Provide complete, functional solutions rather than skeleton implementations\n- Test your logic against edge cases before presenting the final solution\n- Ensure all code follows Val Town's specific platform requirements\n- If a section of code that you're working on is getting too complex, consider\n refactoring it into subcomponents\n\n## Code Standards\n\n- Generate code in TypeScript or TSX\n- Add appropriate TypeScript types and interfaces for all data structures\n- Prefer official SDKs or libraries than writing API calls directly\n- Ask the user to supply API or library documentation if you are at all unsure\n about it\n- **Never bake in secrets into the code** - always use environment variables\n- Include comments explaining complex logic (avoid commenting obvious\n operations)\n- Follow modern ES6+ conventions and functional programming practices if\n possible\n\n## Import Syntax\n\nVal Town supports multiple import methods:\n\n### NPM Packages\n\n```ts\nimport { foo } from \"npm:packagename@version\";\nimport bar from \"npm:another-package@1.0.0\";\n```\n\n### JSR (JavaScript Registry)\n\n```ts\nimport { encodeBase64 } from \"jsr:@std/encoding@1.0.4/base64\";\nimport { escape } from \"jsr:@std/html@1.0.3/entities\";\n```\n\n### esm.sh (CDN)\n\n```ts\nimport React from \"https://esm.sh/react@18\";\n```\n\n### esm.town (Val Town imports)\n\n```ts\nimport { blob } from \"https://esm.town/v/std/blob\";\n```\n\n**Important**: Always specify versions for reproducibility and reliability.\n\n## Types of Vals (fileType)\n\n### 1. HTTP Val (`fileType: \"http\"`)\n\n- Create web APIs and endpoints\n- Handle HTTP requests and responses\n- HTTP vals have a `links.endpoint` field containing the live URL where the val is deployed\n- Example structure:\n\n```ts\nexport default async function (req: Request): Promise {\n return new Response(\"Hello World\", {\n status: 200,\n headers: { \"Content-Type\": \"text/plain\" },\n });\n}\n```\n\nFiles that are HTTP vals have http in their name like `foobar.http.tsx`\n\n### 2. Interval Val (`fileType: \"interval\"`)\n\n- Run on a schedule (cron-like functionality)\n- Example structure:\n\n```ts\nexport default async function () {\n console.log(\"Running scheduled task\", new Date());\n}\n```\n\nFiles that are Interval vals have cron in their name like `foobar.cron.tsx`\n\n### 3. Email Val (`fileType: \"email\"`)\n\n- Process incoming emails\n- Handle email-based workflows\n- Example structure:\n\n```ts\nexport default async function (email: Email) {\n console.log(\"Received email from:\", email.from);\n}\n```\n\nFiles that are Email vals have email in their name like `foobar.email.tsx`\n\n### 4. Script Val (`fileType: \"script\"`)\n\n- General-purpose code that can export functions or values\n- Example structure:\n\n```ts\nexport function greet(name: string): string {\n return `Hello, ${name}!`;\n}\n\nexport const config = {\n version: \"1.0.0\",\n};\n```\n\n## Val Town Standard Library\n\nVal Town provides built-in services:\n\n### SQLite Storage\n\n**For application code in Vals**, use the standard library import:\n\n```typescript\nimport { sqlite } from \"https://esm.town/v/std/sqlite@14-main/main.ts\";\n\n// Create tables idempotently (safe to run multiple times)\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS users (\n id INTEGER PRIMARY KEY,\n name TEXT NOT NULL,\n email TEXT UNIQUE\n )\n`);\n\nconst result = await sqlite.execute(\"SELECT * FROM users\");\n/**\nresult:\n\n ResultSetImpl {\n columns: [ \"id\", \"name\", \"email\" ],\n columnTypes: [ \"INTEGER\", \"TEXT\", \"TEXT\" ],\n rows: [\n { id: 1, name: \"Charlie\", email: \"charlie@example.com\" },\n { id: 2, name: \"Dave\", email: \"dave@example.com\" }\n ],\n rowsAffected: 0,\n lastInsertRowid: undefined\n }\n*/\n\n// Parameterized queries (always use these for user input!)\nawait sqlite.execute({\n sql: \"INSERT INTO users (name, email) VALUES (?, ?)\",\n args: [\"Charlie\", \"charlie@example.com\"],\n});\n\n// Named parameters also supported\nawait sqlite.execute({\n sql: \"SELECT * FROM users WHERE email = :email\",\n args: { email: \"alice@example.com\" },\n});\n\n// Batch operations for atomic multi-statement transactions\n// All succeed together or all fail (rollback on error)\nawait sqlite.batch([\n {\n sql: \"INSERT INTO users (name, email) VALUES (?, ?)\",\n args: [\"Dave\", \"dave@example.com\"],\n },\n { sql: \"UPDATE users SET name = ? WHERE id = ?\", args: [\"David\", 4] },\n]);\n```\n\n**Important notes**:\n\n- Results return as `{columns: string[], rows: any[][]}` - map to objects as needed\n- Always use parameterized queries (`args`) for user input to prevent SQL injection\n- Use `sqlite.batch()` when multiple operations must succeed/fail together\n- Use `CREATE TABLE IF NOT EXISTS` for idempotent table creation\n- MCP tools (sqlite_execute/sqlite_batch) are for debugging; use `std/sqlite` in Val code\n- See https://docs.val.town/reference/std/sqlite/usage/ for complete documentation\n- Existing vals may use https://esm.town/v/std/sqlite for SQLite. Do not change\n this if it is already in place: std/sqlite accesses an SQLite database that is specific\n to the user, std/db accesses one that is specific to the val.\n\n### Blob Storage\n\n```typescript\nimport { blob } from \"@valtown/sdk\";\n\nawait blob.setJSON(\"mykey\", { data: \"value\" });\nconst data = await blob.getJSON(\"mykey\");\n```\n\n### Email Sending\n\n```typescript\nimport { email } from \"@valtown/sdk\";\n\nawait email.send({\n to: \"user@example.com\",\n subject: \"Hello\",\n text: \"Message body\",\n});\n```\n\n### OpenAI\n\n```ts\nimport { OpenAI } from \"https://esm.town/v/std/openai\";\nconst openai = new OpenAI();\nconst completion = await openai.chat.completions.create({\n messages: [{ role: \"user\", content: \"Say hello in a creative way\" }],\n model: \"gpt-4o-mini\",\n max_tokens: 30,\n});\n```\n\n## Val Town Utility Functions\n\nVal Town provides several utility functions to help with common project tasks.\n\n### Importing Utilities\n\nAlways import utilities with version pins to avoid breaking changes:\n\n```ts\nimport {\n parseProject,\n readFile,\n serveFile,\n} from \"https://esm.town/v/std/utils@85-main/index.ts\";\n```\n\n### Available Utilities\n\n#### **serveFile** - Serve project files with proper content types\n\nFor example, in Hono:\n\n```ts\n// serve all files in frontend/ and shared/\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n```\n\n#### **readFile** - Read files from within the project:\n\n```ts\n// Read a file from the project\nconst fileContent = await readFile(\"/frontend/index.html\", import.meta.url);\n```\n\n#### **listFiles** - List all files in the project\n\n```ts\nconst files = await listFiles(import.meta.url);\n```\n\n#### **parseProject** - Extract information about the current project from import.meta.url\n\nThis is useful for including info for linking back to a val, ie in \"view source\"\nurls:\n\n```ts\nconst projectVal = parseProject(import.meta.url);\nconsole.log(projectVal.username); // Owner of the project\nconsole.log(projectVal.name); // Project name\nconsole.log(projectVal.version); // Version number\nconsole.log(projectVal.branch); // Branch name\nconsole.log(projectVal.links.self.project); // URL to the project page\n```\n\nHowever, it's _extremely importing_ to note that `parseProject` and other\nStandard Library utilities ONLY RUN ON THE SERVER. If you need access to this\ndata on the client, run it in the server and pass it to the client by splicing\nit into the HTML page or by making an API request for it.\n\n## Val Town Platform Specifics\n\n- **Redirects:** Use\n `return new Response(null, { status: 302, headers: { Location: \"/place/to/redirect\" }})`\n instead of `Response.redirect` which is broken\n- **Images:** Avoid external images or base64 images. Use emojis, unicode\n symbols, or icon fonts/libraries instead\n- **AI Image:** To inline generate an AI image use:\n `

`\n- **Storage:** DO NOT use the Deno KV module for storage\n- **Browser APIs:** DO NOT use the `alert()`, `prompt()`, or `confirm()` methods\n- **Weather Data:** Use open-meteo for weather data (doesn't require API keys)\n unless otherwise specified\n- **View Source:** Add a view source link by importing & using\n `import.meta.url.replace(\"ems.sh\", \"val.town)\"` (or passing this data to the\n client) and include `target=\"_top\"` attribute\n- **Error Debugging:** Add\n `` to HTML to capture\n client-side errors\n- **Environment Variables:** Use `Deno.env.get('keyname')` with defensive checks:\n ```ts\n const apiKey = Deno.env.get(\"API_KEY\");\n if (!apiKey) {\n throw new Error(\"API_KEY not configured\");\n }\n ```\n Generally prefer APIs that don't require keys when possible.\n- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure\n compatibility on server and browser\n- **Storage Strategy:** Only use backend storage if explicitly required; prefer\n simple static client-side sites\n- **React Configuration:** When using React libraries, pin versions with\n `?deps=react@18.2.0,react-dom@18.2.0` and start the file with\n `/** @jsxImportSource https://esm.sh/react@18.2.0 */`\n- Ensure all React dependencies and sub-dependencies are pinned to the same\n version\n- **Styling:** Default to using TailwindCSS via\n `` unless otherwise\n specified\n\n### Error Handling\n\nFor HTTP vals, handle errors gracefully and return appropriate status codes:\n\n```ts\nexport default async function (req: Request): Promise {\n try {\n // Your logic here\n return new Response(\"Success\");\n } catch (error) {\n return new Response(`Error: ${error.message}`, { status: 500 });\n }\n}\n```\n\nFor non-HTTP vals, let errors bubble up with full context rather than catching\nand merely logging them.\n\n### CORS Headers\n\nWhen building APIs consumed by browsers, include CORS headers:\n\n```ts\nreturn new Response(JSON.stringify(data), {\n headers: {\n \"Content-Type\": \"application/json\",\n \"Access-Control-Allow-Origin\": \"*\",\n },\n});\n```\n\n## Project Structure and Design Patterns\n\n### Recommended Directory Structure\n\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Schema definitions\n│ │ ├── queries.ts # DB query functions\n│ │ └── README.md\n│ └── routes/ # Route modules\n│ ├── [route].ts\n│ └── static.ts # Static file serving\n│ ├── index.ts # Main entry point\n│ └── README.md\n├── frontend/\n│ ├── components/\n│ │ ├── App.tsx\n│ │ └── [Component].tsx\n│ ├── favicon.svg\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # Frontend JS entry point\n│ ├── README.md\n│ └── style.css\n├── README.md\n└── shared/\n ├── README.md\n └── utils.ts # Shared types and functions\n```\n\n### Backend (Hono) Best Practices\n\n- Hono is the recommended API framework\n- Main entry point should be `backend/index.ts`\n- **Static asset serving:** Use the utility functions to read and serve project\n files:\n\n ```ts\n import {\n readFile,\n serveFile,\n } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\n // serve all files in frontend/ and shared/\n app.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\n app.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n // For index.html, often you'll want to bootstrap with initial data\n app.get(\"/\", async (c) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n\n // Inject data to avoid extra round-trips\n const initialData = await fetchInitialData();\n const dataScript = ``;\n\n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n });\n ```\n\n- Create RESTful API routes for CRUD operations\n- Always include this snippet at the top-level Hono app to re-throwing errors to\n see full stack traces:\n ```ts\n // Unwrap Hono errors to see original error details\n app.onError((err, c) => {\n throw err;\n });\n ```\n\n### Database Patterns\n\n- Run migrations on startup or comment out for performance\n- Change table names when modifying schemas rather than altering\n- Export clear query functions with proper TypeScript typing\n\n## Common Gotchas and Solutions\n\n1. **Environment Limitations:**\n - Val Town runs on Deno in a serverless context, not Node.js\n - Code in `shared/` must work in both frontend and backend environments\n - Cannot use `Deno` keyword in shared code\n - Use `https://esm.sh` for imports that work in both environments\n\n2. **SQLite Peculiarities:**\n - Limited support for ALTER TABLE operations\n - Create new tables with updated schemas and copy data when needed\n - Always run table creation before querying\n\n3. **React Configuration:**\n - All React dependencies must be pinned to 18.2.0\n - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of\n React files\n - Rendering issues often come from mismatched React versions\n\n4. **File Handling:**\n - Val Town only supports text files, not binary\n - Use the provided utilities to read files across branches and forks\n - For files in the project, use `readFile` helpers\n\n5. **API Design:**\n - `fetch` handler is the entry point for HTTP vals\n - Run the Hono app with\n `export default app.fetch // This is the entry point for HTTP vals`\n\n6. **HTTP Endpoint Discovery:**\n - HTTP vals have a `links.endpoint` field with the live deployment URL\n - Use this to test and verify your val is working correctly",[153],"pulls","branches",1,"forks","envVars",{"_167":58,"_169":58},"connections",{"_167":58,"_168":58},"count","unfilledCount","emptyCount",{"_40":152,"_31":153,"_29":154,"_133":-5,"_38":39,"_37":155,"_135":121,"_35":184,"_13":58,"_32":20,"_33":157,"_23":24,"_140":-5,"_175":185,"_26":186},{"_40":149,"_31":27,"_29":30,"_133":-5,"_38":39,"_37":14,"_135":121,"_35":181,"_13":58,"_32":20,"_33":34,"_23":24,"_140":-5,"_175":182,"_26":183},{"_40":142,"_31":143,"_29":144,"_133":-5,"_38":39,"_37":145,"_135":121,"_35":178,"_13":58,"_32":20,"_33":147,"_23":24,"_140":-5,"_175":179,"_26":180},{"_40":130,"_31":131,"_29":132,"_133":-5,"_38":39,"_37":134,"_135":24,"_35":174,"_13":137,"_32":138,"_33":139,"_23":24,"_140":-5,"_175":176,"_26":177},["D",1769642718159],"children",[],[131],["D",1769642735565],[],[143],["D",1769642735606],[],[27],["D",1769642735601],[],[153],["D",1769642305137],["D",1789506649022],{"_95":94,"_102":98},{"_95":94,"_96":-5,"_97":98,"_18":52,"_99":100,"_101":24},{"_13":84,"_31":85,"_40":39,"_86":41,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":42,"_93":94},"ctx",{"_77":-5,"_123":225,"_226":227,"_228":229,"_230":24,"_231":24,"_232":24,"_233":121,"_234":-5,"_235":-7,"_236":-7,"_237":58,"_238":24,"_239":24,"_240":-5,"_241":24,"_242":24,"_243":24,"_244":-5},"ENV",{"_196":197,"_198":199,"_200":85,"_201":202,"_203":204,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214,"_215":216,"_217":218,"_219":220,"_221":222,"_223":224},"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 · v15