[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_215":216,"_217":218},"routes/_app.x.$handle.$name",{"_99":98,"_37":48,"_107":89,"_32":108,"_13":14,"_109":-5,"_11":110,"_111":112,"_113":114,"_115":116,"_117":118,"_26":-5,"_119":-5,"_120":-5,"_121":30,"_122":123,"_124":125,"_126":-5,"_127":-5,"_128":129},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_46":47,"_37":48,"_41":49,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":-5,"_56":-5,"_19":57,"_58":-5,"_59":30,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":83,"_84":85,"_86":87,"_88":30},"version",11,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","d1996413-b0dd-4175-86dc-e6c9fbd52922","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":26,"_39":40,"_41":42,"_43":14,"_44":45,"_29":30},"previous","deleted",false,"deletedHere","path","README.md","latestPath","fileId","48e46c7a-3857-11f1-b691-42b51c65c3df","name","fileType","content","# Sample Agent\n\nA chat-style AI agent built with the [OpenAI Agents SDK](https://openai.github.io/openai-agents-js/) and a React frontend.\n\n## Tools\n\nThe agent has 3 custom tools:\n\n| Tool | Description |\n|------|-------------|\n| 🕐 **get_current_time** | Get the current time in any IANA timezone |\n| 🧮 **calculator** | Evaluate math expressions |\n| 🎲 **random_number** | Generate random integers in a range |\n\n## Architecture\n\n```mermaid\nflowchart LR\n A[React Chat UI] -->|POST /api/chat| B[Hono Server]\n B --> C[OpenAI Agent]\n C -->|tool calls| D[Tools]\n D -->|results| C\n C -->|final answer| B\n B -->|JSON response| A\n```\n\n## Setup\n\n1. **Set the `OPENAI_API_KEY` environment variable.** Get your key at https://platform.openai.com/api-keys\n2. Open the live URL and start chatting!\n\n## Files\n\n- `main.ts` — Hono HTTP server (entrypoint)\n- `agent.ts` — Agent definition with tools\n- `frontend/index.html` — HTML shell\n- `frontend/app.tsx` — React chat UI\n","createdAt",["D",1776208296134],"branchVersion","branchId","ec8088f0-f8fb-11f0-bc42-42dde27851f2","id","ec7fd59a-f8fb-11f0-bc42-42dde27851f2","untitled-2503",["D",1769242133636],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","019bef07-c64e-732f-a4cf-141aa7329fae","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","019bef07-c64e-732f-a4cf-18f8ca4e30e3","tursoName","ec7fd59af8fb11f0bc4242dde27851f2","tursoHostname","ec7fd59af8fb11f0bc4242dde27851f2-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789530055570],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_99":98,"_106":102},"org",{"_99":98,"_100":-5,"_101":102,"_19":57,"_103":104,"_105":30},"branch",{"_13":14,"_37":89,"_46":45,"_90":47,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":-5,"_96":48,"_97":98},"isOwned","main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","bnelevitt","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzM4aEJFekg1ZGVzcFVGZ1FrMmVjcE1BQjdHRiJ9","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_46":47,"_37":48,"_41":210,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":-5,"_56":-5,"_19":57,"_58":-5,"_59":30,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":67,"_68":69,"_70":211,"_72":-5,"_73":74,"_75":74,"_76":77,"_78":77,"_79":77,"_80":74,"_81":74,"_82":212,"_84":213,"_86":214,"_88":30},"tree",[175,178,179,180],"files",[175,176,177,178,179,180],"counts",{"_164":63,"_165":166,"_167":63,"_168":169,"_170":171},"contents",[130,131,132,133],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles",true,"grants","orgs","customDomains",{},{"_46":157,"_37":158,"_35":159,"_137":-5,"_44":45,"_43":160,"_139":125,"_41":161,"_13":63,"_38":162,"_39":-5,"_29":30,"_144":-5,"_32":163},{"_46":154,"_37":33,"_35":36,"_137":-5,"_44":45,"_43":14,"_139":125,"_41":155,"_13":63,"_38":26,"_39":40,"_29":30,"_144":-5,"_32":156},{"_46":146,"_37":147,"_35":148,"_137":-5,"_44":45,"_43":149,"_139":125,"_41":150,"_13":63,"_38":151,"_39":152,"_29":30,"_144":-5,"_32":153},{"_46":134,"_37":135,"_35":136,"_137":-5,"_44":45,"_43":138,"_139":125,"_41":140,"_13":141,"_38":142,"_39":143,"_29":30,"_144":-5,"_32":145},"2781693e-3857-11f1-8e2a-42b51c65c3df","main.ts","ec84ce74-f8fb-11f0-bc42-42dde27851f2","parentId",6,"latest",["D",1776208240110],5,"http","import { Hono } from \"npm:hono@4\";\nimport { serveFile, parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nconst app = new Hono();\n\n// Serve frontend\napp.get(\"/\", (c) => serveFile(\"frontend/index.html\", import.meta.url));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// API route for chat\napp.post(\"/api/chat\", async (c) => {\n const { message } = await c.req.json();\n const { runAgent } = await import(\"./agent.ts\");\n const result = await runAgent(message);\n return c.json({ response: result });\n});\n\n// View source\napp.get(\"/source\", (c) => c.redirect(parseVal(import.meta.url).links.self.val));\n\napp.onError((err) => Promise.reject(err));\n\nexport default app.fetch;\n","label",[135],"2ea5d70e-3857-11f1-8e2a-42b51c65c3df","agent.ts","2ea5d7cc-3857-11f1-8e2a-42b51c65c3df",7,["D",1776208252104],"script","import { Agent, run, tool } from \"npm:@openai/agents@0.7\";\nimport { z } from \"npm:zod\";\n\n// Custom tool: get current time in any timezone\nconst getTimeTool = tool({\n name: \"get_current_time\",\n description: \"Get the current date and time in a given timezone (e.g. 'America/New_York', 'Europe/London', 'Asia/Tokyo'). Use 'UTC' if no timezone is specified.\",\n parameters: z.object({\n timezone: z.string().describe(\"IANA timezone string, e.g. 'America/New_York'\"),\n }),\n execute: async ({ timezone }) => {\n try {\n const now = new Date();\n const formatted = now.toLocaleString(\"en-US\", {\n timeZone: timezone,\n weekday: \"long\",\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n hour: \"2-digit\",\n minute: \"2-digit\",\n second: \"2-digit\",\n timeZoneName: \"short\",\n });\n return `Current time in ${timezone}: ${formatted}`;\n } catch {\n return `Invalid timezone: \"${timezone}\". Use IANA format like \"America/New_York\".`;\n }\n },\n});\n\n// Custom tool: do math calculations\nconst calculatorTool = tool({\n name: \"calculator\",\n description: \"Evaluate a mathematical expression. Supports basic arithmetic (+, -, *, /), exponents (**), and parentheses.\",\n parameters: z.object({\n expression: z.string().describe(\"The math expression to evaluate, e.g. '(2 + 3) * 4'\"),\n }),\n execute: async ({ expression }) => {\n try {\n // Safe math evaluation using Function constructor with only math operations\n const sanitized = expression.replace(/[^0-9+\\-*/().%\\s^]/g, \"\");\n const result = new Function(`return (${sanitized.replace(/\\^/g, \"**\")})`)();\n return `${expression} = ${result}`;\n } catch {\n return `Could not evaluate: \"${expression}\". Make sure it's a valid math expression.`;\n }\n },\n});\n\n// Custom tool: generate a random number\nconst randomNumberTool = tool({\n name: \"random_number\",\n description: \"Generate a random integer between min and max (inclusive).\",\n parameters: z.object({\n min: z.number().describe(\"Minimum value\"),\n max: z.number().describe(\"Maximum value\"),\n }),\n execute: async ({ min, max }) => {\n const result = Math.floor(Math.random() * (max - min + 1)) + min;\n return `Random number between ${min} and ${max}: ${result}`;\n },\n});\n\nconst agent = new Agent({\n name: \"Sample Agent\",\n instructions: `You are a friendly and helpful AI assistant with access to tools. \nYou can:\n- Tell the current time in any timezone\n- Do math calculations\n- Generate random numbers\n\nBe concise but helpful. Use your tools when the user's request would benefit from them.\nIf someone asks what you can do, tell them about your tools.`,\n tools: [getTimeTool, calculatorTool, randomNumberTool],\n});\n\nexport async function runAgent(message: string): Promise {\n const result = await run(agent, message, { maxTurns: 5 });\n return result.finalOutput;\n}\n",[147],"48e46bd0-3857-11f1-b691-42b51c65c3df",["D",1776208296134],[33],"30175680-3857-11f1-8e2a-42b51c65c3df","frontend","30175734-3857-11f1-8e2a-42b51c65c3df",8,["D",1776208254525],"directory",[158],"pulls","branches",1,"forks","envVars",{"_172":63,"_174":63},"connections",{"_172":63,"_173":63},"count","unfilledCount","emptyCount",{"_46":157,"_37":158,"_35":159,"_137":-5,"_44":45,"_43":160,"_139":125,"_41":207,"_13":63,"_38":162,"_39":-5,"_29":30,"_144":-5,"_182":208,"_32":209},{"_46":199,"_37":200,"_35":201,"_137":159,"_44":45,"_43":202,"_139":125,"_41":203,"_13":63,"_38":151,"_39":204,"_29":30,"_144":-5,"_182":205,"_32":206},{"_46":191,"_37":192,"_35":193,"_137":159,"_44":45,"_43":194,"_139":125,"_41":195,"_13":63,"_38":26,"_39":196,"_29":30,"_144":-5,"_182":197,"_32":198},{"_46":154,"_37":33,"_35":36,"_137":-5,"_44":45,"_43":14,"_139":125,"_41":188,"_13":63,"_38":26,"_39":40,"_29":30,"_144":-5,"_182":189,"_32":190},{"_46":146,"_37":147,"_35":148,"_137":-5,"_44":45,"_43":149,"_139":125,"_41":185,"_13":63,"_38":151,"_39":152,"_29":30,"_144":-5,"_182":186,"_32":187},{"_46":134,"_37":135,"_35":136,"_137":-5,"_44":45,"_43":138,"_139":125,"_41":181,"_13":141,"_38":142,"_39":143,"_29":30,"_144":-5,"_182":183,"_32":184},["D",1776208240110],"children",[],[135],["D",1776208252104],[],[147],["D",1776208296134],[],[33],"333a13e8-3857-11f1-8e2a-42b51c65c3df","index.html","333a14a6-3857-11f1-8e2a-42b51c65c3df",9,["D",1776208259787],"\n\n\n \n \n Sample Agent\n \n \n\n\n

\n \n\n\n",[],[158,192],"3ee3db98-3857-11f1-8e2a-42b51c65c3df","app.tsx","3ee3dc88-3857-11f1-8e2a-42b51c65c3df",10,["D",1776208279354],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\n\ninterface Message {\n role: \"user\" | \"assistant\";\n content: string;\n}\n\nfunction App() {\n const [messages, setMessages] = useState([]);\n const [input, setInput] = useState(\"\");\n const [loading, setLoading] = useState(false);\n const messagesEndRef = useRef(null);\n const inputRef = useRef(null);\n\n useEffect(() => {\n messagesEndRef.current?.scrollIntoView({ behavior: \"smooth\" });\n }, [messages]);\n\n async function sendMessage(e: React.FormEvent) {\n e.preventDefault();\n const text = input.trim();\n if (!text || loading) return;\n\n setInput(\"\");\n setMessages((prev) => [...prev, { role: \"user\", content: text }]);\n setLoading(true);\n\n try {\n const res = await fetch(\"/api/chat\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ message: text }),\n });\n const data = await res.json();\n setMessages((prev) => [...prev, { role: \"assistant\", content: data.response }]);\n } catch (err) {\n setMessages((prev) => [\n ...prev,\n { role: \"assistant\", content: \"Sorry, something went wrong. Please try again.\" },\n ]);\n } finally {\n setLoading(false);\n inputRef.current?.focus();\n }\n }\n\n const suggestions = [\n \"What time is it in Tokyo?\",\n \"Calculate 42 * 17 + 3\",\n \"Pick a random number 1-100\",\n \"What can you do?\",\n ];\n\n return (\n

\n {/* Header */}\n

\n 🤖\n

Sample Agent

\n \n view source\n \n

\n\n {/* Messages area */}\n

\n {messages.length === 0 && (\n

🤖

Hi! I'm a sample agent.

\n I can tell time in any timezone, do math, and generate random numbers. Try asking me something!\n

\n {suggestions.map((s) => (\n {\n setInput(s);\n inputRef.current?.focus();\n }}\n className=\"px-3 py-1.5 bg-gray-800 hover:bg-gray-700 rounded-full text-sm text-gray-300 transition-colors\"\n >\n {s}\n \n ))}\n

\n )}\n\n {messages.map((msg, i) => (\n \n \n {msg.content}\n

\n ))}\n\n {loading && (\n

\n \n \n \n

\n )}\n\n

\n\n {/* Input area */}\n \n \n );\n}\n\ncreateRoot(document.getElementById(\"root\")!).render();\n",[],[158,200],["D",1776208254525],[176,177],[158],["D",1769242133636],["D",1789530055570],{"_99":98,"_106":102},{"_99":98,"_100":-5,"_101":102,"_19":57,"_103":104,"_105":30},{"_13":14,"_37":89,"_46":45,"_90":47,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":-5,"_96":48,"_97":98},"ctx",{"_82":-5,"_127":248,"_249":250,"_251":252,"_253":30,"_254":30,"_255":30,"_256":125,"_257":-5,"_258":-7,"_259":-7,"_260":63,"_261":30,"_262":30,"_263":-5,"_264":30,"_265":30,"_266":30,"_267":-5},"ENV",{"_219":220,"_221":222,"_223":89,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247},"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 · v11