[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_153":154,"_155":156},"routes/_app.x.$handle.$name",{"_95":94,"_32":45,"_103":85,"_27":104,"_13":14,"_105":-5,"_11":106,"_107":108,"_109":110,"_111":112,"_113":114,"_20":-5,"_115":-5,"_116":-5,"_117":25,"_118":119,"_120":57,"_121":-5,"_122":-5,"_123":124},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":31,"_56":57,"_58":57,"_59":-5,"_60":61,"_62":63,"_64":-5,"_65":-5,"_66":-5,"_67":-5,"_68":69,"_70":69,"_71":72,"_73":72,"_74":72,"_75":69,"_76":69,"_77":78,"_79":80,"_81":82,"_83":25},"version",26,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","main.tsx","latestPath","fileId","55b536e6-5441-11f0-904e-f69ea79377d9","name","fileType","http","content","import { OpenAI } from \"https://esm.town/v/std/openai?v=4\";\nimport ValTown from \"npm:@valtown/sdk@1.5.0\";\nimport { Hono } from \"npm:hono@4.4.12\";\n\nconst app = new Hono();\n\nconst ENRICHMENT_PROMPT = `\nYou are a world-class Val Town Product Architect. Your mission is to convert a user's simple idea into a detailed, structured JSON specification for an expert Val Town developer AI. The resulting specification must be comprehensive enough to build a beautiful, robust, and complete single-file application on the Val Town platform.\n\nAdhere to these non-negotiable rules:\n1. **Analyze and Elevate:** Scrutinize the user's core idea. Augment it with essential, modern features. For a \"link shortener,\" this means adding analytics like click counts. For a \"poll app,\" this means adding options, vote counts, and displaying results.\n2. **MANDATE NOVEL AI INTEGRATION:** Every application MUST have a valuable, non-trivial OpenAI feature at its core. Do not suggest simple text summarization. Invent a creative integration.\n - *Example for a Todo List:* An AI feature that suggests the most logical next task based on the current list's context.\n - *Example for a Blog:* An AI-powered assistant to generate 5 compelling title variations for a given article body.\n3. **Mandate Val Town Standard Library:** Explicitly command the use of Val Town's standard library.\n - For structured, concurrent data: Mandate \\`std/sqlite\\`. Define the precise \\`CREATE TABLE\\` schema.\n - For simple key-value state: Mandate \\`std/blob\\`. Define the key structure.\n4. **Define a Polished UI/UX Vision:** Describe a modern, aesthetically pleasing user interface.\n - **Typography:** Specify a professional, readable font from Google Fonts (e.g., 'Inter', 'Roboto Slab').\n - **Color Palette:** Define a specific color palette using CSS custom property names (e.g., --bg-color, --primary-color, --text-primary). Provide hex codes.\n - **Layout:** Dictate a responsive, centered layout using modern CSS like Flexbox or Grid.\n5. **Structure as Strict JSON:** Your entire response MUST be a single, minified JSON object with no explanatory text or markdown. The JSON object must conform to this exact structure:\n {\n \"application_type\": \"The type of application (e.g., 'AI-Powered Poll Creator', 'Smart Guestbook')\",\n \"core_features\": [\"An array of specific, actionable features.\"],\n \"openai_integration\": {\n \"feature_description\": \"A clear description of the AI feature.\",\n \"prompt_template\": \"A concise, effective prompt for the LLM to execute the feature.\",\n \"expected_output\": \"A stringified JSON example of the exact output structure. Example: '{\\\\\"suggestions\\\\\": [\\\\\"suggestion1\\\\\", \\\\\"suggestion2\\\\\"]}'\"\n },\n \"data_model\": {\n \"tool\": \"std/sqlite\" or \"std/blob\",\n \"schema\": \"The exact 'CREATE TABLE' SQL statement if using sqlite, or a description of the key/value structure if using blob.\"\n },\n \"ui_ux_guidelines\": {\n \"font_family\": \"e.g., 'Inter', sans-serif\",\n \"google_font_url\": \"e.g., https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap\",\n \"css_variables\": {\n \"--bg-color\": \"#f8f9fa\",\n \"--card-bg\": \"#ffffff\",\n \"--text-primary\": \"#212529\",\n \"--text-secondary\": \"#6c757d\",\n \"--primary-color\": \"#0d6efd\",\n \"--border-color\": \"#dee2e6\"\n },\n \"layout_notes\": \"e.g., A responsive, single-column layout centered on the page with a max-width of 800px. Use CSS Grid for the main structure. UI elements should be contained in cards with distinct padding, border-radius, and box-shadow to create depth.\"\n }\n }\n\n**Example Transformation:**\n- **User's Simple Idea:** \"A poll app\"\n- **Your Enriched JSON Output:**\n {\"application_type\":\"AI-Enhanced Poll Application\",\"core_features\":[\"Users can create a poll with a question and multiple options.\",\"A unique URL is generated for each poll.\",\"Visitors can vote on options.\",\"Results are displayed in real-time with percentages.\"],\"openai_integration\":{\"feature_description\":\"When creating a poll, an AI suggests additional, diverse poll options based on the user's question to encourage more engaging polls.\",\"prompt_template\":\"Given the poll question '{question}' and existing options {options}, generate a JSON object with a key 'suggestions' containing an array of 3 distinct, complementary poll options.\",\"expected_output\":\"{\\\\\"suggestions\\\\\": [\\\\\"Option A\\\\\", \\\\\"Option B\\\\\", \\\\\"Option C\\\\\"]}\"},\"data_model\":{\"tool\":\"std/sqlite\",\"schema\":\"CREATE TABLE polls (id TEXT PRIMARY KEY, question TEXT NOT NULL); CREATE TABLE options (id INTEGER PRIMARY KEY AUTOINCREMENT, poll_id TEXT NOT NULL, text TEXT NOT NULL, votes INTEGER DEFAULT 0, FOREIGN KEY (poll_id) REFERENCES polls(id));\"},\"ui_ux_guidelines\":{\"font_family\":\"'Inter', sans-serif\",\"google_font_url\":\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap\",\"css_variables\":{\"--bg-color\":\"#f0f2f5\",\"--card-bg\":\"#ffffff\",\"--text-primary\":\"#1a202c\",\"--text-secondary\":\"#4a5568\",\"--primary-color\":\"#4263eb\",\"--border-color\":\"#e2e8f0\"},\"layout_notes\":\"A clean, centered card-based UI. Use Flexbox for aligning form elements and poll options. Results should be displayed using a bar-graph style within each option.\"}}\n`;\n\n// --- PROMPT 2: CODE GENERATION (EXPERT DEVELOPER AI) ---\nconst SYSTEM_PROMPT = `\nYou are an expert Val Town developer. Your mission is to write robust, secure, and efficient vals for the Deno runtime based on the detailed JSON specification provided.\n\n--- CORE PRINCIPLES ---\n1. **Deno-First:** All code is for the Deno runtime, using modern JavaScript/TypeScript.\n2. **Version Pin ALL Imports:** Always use version-pinned imports (e.g., \\`npm:hono@4.4.12\\`, \\`https://esm.town/v/std/openai?v=4\\`) to guarantee stability.\n3. **OpenAI is Core:** The specified OpenAI feature must be a central, value-adding part of the application.\n4. **Use Standard Library:** Religiously use the Val Town standard library (\\`std/sqlite\\`, \\`std/blob\\`) as directed by the JSON specification.\n5. **Secrets in Environment:** API keys or other secrets must be accessed via \\`Deno.env.get()\\`. Never hard-code them.\n\n--- FOUNDATIONAL KNOWLEDGE & CODE PATTERNS ---\nYou have mastered these fundamental patterns and must use them.\n\n**SQLite Usage:**\n* **Table Creation:** \\`CREATE TABLE IF NOT EXISTS table_name (id INTEGER PRIMARY KEY, name TEXT, created_at DATETIME DEFAULT CURRENT_TIMESTAMP);\\`\n* **Parameterized Insert:** \\`await sqlite.execute({ sql: \"INSERT INTO users(name, email) VALUES (:name, :email)\", args: { name: \"John\", email: \"j@j.com\" } });\\`\n* **Query:** \\`const { rows } = await sqlite.execute(\"SELECT * FROM users\");\\`\n\n**OpenAI JSON Usage (MANDATORY PATTERN):**\n\\`\\`\\`typescript\nimport { OpenAI } from \"https://esm.town/v/std/openai?v=4\";\nconst openai = new OpenAI();\nconst completion = await openai.chat.completions.create({\n model: \"gpt-4o\",\n messages: [{ role: \"user\", content: \"Tell me a joke about APIs in JSON format.\" }],\n // ALWAYS use response_format when expecting JSON.\n response_format: { type: \"json_object\" },\n});\ntry {\n // ALWAYS wrap JSON.parse in a try...catch block.\n const result = JSON.parse(completion.choices[0].message.content);\n} catch (e) {\n console.error(\"Failed to parse AI JSON response:\", e);\n}\n\\`\\`\\`\n\n--- STRUCTURAL & ARCHITECTURAL REQUIREMENTS ---\n1. **Single-File, Self-Contained:** Generate a single TypeScript file for an HTTP-triggered val.\n2. **Hono for Routing:** If the application requires multiple endpoints, you MUST use Hono for routing.\n3. **Safe Database Initialization:** If \\`std/sqlite\\` is used, the \\`CREATE TABLE\\` statements MUST be executed within a dedicated, awaited async function BEFORE the main application logic or Hono router is defined. This prevents serverless cold-start race conditions.\n4. **Final Output Format:** Your entire response must be ONLY the TypeScript code for the val, enclosed in a single markdown block (e.g., \\`\\`\\`typescript ... \\`\\`\\`). Do not include any other text or explanation.\n\n--- UI/FRONTEND GENERATION RULES ---\n1. **All-in-One HTML:** Generate all HTML, CSS, and JavaScript within a single \\`Response\\` object.\n2. **Modern, Professional CSS:**\n - Place all CSS in a \\`\n\n\n

AI-Powered Guestbook

\n \n

\n \\${formattedEntries.map(entry => \\`\n

\n \\${entry.name}\n \\${new Date(entry.created_at).toLocaleString()}\n

\\${entry.message}

\n \n

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

Diff · v26