/** @jsxImportSource https://esm.sh/react */ import getValsContextWindow from "https://esm.town/v/janpaul123/getValsContextWindow"; import { updateValByName } from "https://esm.town/v/nbbaier/updateValByName?v=14"; import { passwordAuth } from "https://esm.town/v/pomdtr/password_auth?v=84"; import { verifyToken } from "https://esm.town/v/pomdtr/verifyToken"; import ValTown from "npm:@valtown/sdk"; import { Hono } from "npm:hono@3"; import OpenAI from "npm:openai"; import { renderToString } from "npm:react-dom/server"; const vt = new ValTown({ bearerToken: Deno.env.get("valtown") }); const username = "janpaul123"; const app = new Hono(); const jsxResponse = (jsx) => { return new Response(renderToString(jsx), { headers: { "Content-Type": "text/html" } }); }; function renderForm( valName: string, prompt: string, type: string, code: string, expandedPrompts: any = [], iterations: number = 10, ) { return ( ); } app.get("/", async (c) => { return jsxResponse( renderForm("valwriter_output", "Create a script val that returns the current weather in Brooklyn.", "new", ""), ); }); app.post("/save", async (c) => { const body = await c.req.parseBody(); const valName: any = body.valName; const code: any = body.code; try { await updateValByName({ token: Deno.env.get("valtown"), code, name: valName, }); } catch (err) { return jsxResponse(Error: {err}); } return jsxResponse(✅ Saved); }); app.post("/", async (c) => { const { readable, writable } = new TransformStream(); const writer = writable.getWriter(); const textEncoder = new TextEncoder(); function write(text) { writer.write(textEncoder.encode(text)); } const body = await c.req.parseBody(); const prompt: any = body.prompt; const valName: any = body.valName; const iterations: any = body.iterations; const type: any = body.type; const previousExpandedPrompts: any = JSON.parse(body.expandedPrompts as any); let existingValCode; if (type === "update") { const val = await vt.alias.username.valName.retrieve(username, valName); existingValCode = val.code; } else if (type === "iterate" || type === "iterate-inline") { existingValCode = body.code; } new Promise(async () => { write("

Processing…

"); write(` `); // const model = "gpt-3.5-turbo"; const model = "gpt-4o"; const contextWindow: any = await getValsContextWindow(model); const expandedPrompts = type === "iterate-inline" ? [ ...previousExpandedPrompts, { role: "assistant", content: `\`\`\`ts\n${existingValCode}\n\`\`\``, }, { role: "user", content: prompt, }, ] : [ ...(type === "update" || type === "iterate") ? [ { role: "system", content: `This is the existing val (${username}/${valName}): \`\`\`ts\n${existingValCode}\n\`\`\`\nYour goal is to update this val given the instructions. Please repeat the entire val, changing only the absolute minimum that needs to be changed to satisfy the goal.`, }, ] : [], { role: "system", content: `Act as an expert software engineer. Always use best practices. Your response should start with \`\`\`ts and end with \`\`\`. Start your response with a comment explaining how your approach will work, what libraries or API calls you will use, and any tradeoffs you're making. Then write the code in a consise way, the simplest way to achieve the goal, though you can add some inline comments to explain your reasoning (not for every line, but for major groups of lines). Don't use any environment variables unless strictly necessary, for example use APIs that don't require a key, prefer internal function imports (using esm.town), and prefer putting API keys as inline variables. Use built-in Deno functions where possible. The val should create a "export default async function main() {" which is the main function that gets executed, without any arguments. Don't return a Response object, just return a plain Javascript object, array, or string. Unless specified, don't add error handling, make sure that errors bubble up to the caller.`, }, { role: "user", content: prompt, }, ]; write( renderToString(

Generating {valName} with prompts:

{contextWindow.length} prompts from getValsContextWindow

{expandedPrompts.map(({ role, content }, i) => (

{role}:

{content}

))}

, ), ); const openai = new OpenAI(); const stream = await openai.chat.completions.create({ model, stream: true, messages: [ ...contextWindow, ...expandedPrompts, ], }); write( "

assistant:

",
);
const tokens = [];
for await (const chunk of stream) {
const text = chunk.choices[0]?.delta?.content;
if (text === "") {
continue;
}
// console.log(text);
write(text);
tokens.push(text);
}
write("

"); const code = tokens.join("").replaceAll("```ts", "").replaceAll("```", ""); // Write a form that submits the valName and code to /save. write(renderToString( , )); write(` `); write(renderToString(

Running val anonymously…

, )); let runResult; let runError; try { runResult = await vt.eval.run({ code, args: [] }); } catch (e) { runError = e; } runResult = runResult || ""; if (runError || (runResult.length === 0)) { if (!(runResult.length === 0 || (runError.error && runError.error.error))) { write(renderToString(

Fatal error while running: {runError}

)); throw runError; } if (runError) { write( renderToString(

😭 Error while running, try to iterate? {renderForm( valName, `When running the val we encountered the following error, please try to fix it.\n ${ runError.error.error.split("data:text/tsx")[0] }`, "iterate-inline", code, expandedPrompts, iterations - 1, )}

, ), ); } else if (runResult.length === 0) { write( renderToString(

😭 Error while running, try to iterate? {renderForm( valName, "When running the result is empty, can you fix that?", "iterate-inline", code, expandedPrompts, iterations - 1, )}

, ), ); } if (iterations > 0) { write(` `); } writer.close(); return; } let nextPrompt = "Add the following feature: "; write(renderToString(

🎉 Success running:{" "}

{JSON.stringify(runResult, null, 2)}

{renderForm(valName, nextPrompt, "iterate-inline", code, expandedPrompts)}

, )); writer.close(); }); return new Response(readable, { headers: { "Content-Type": "text/html" } }); }); export default passwordAuth(app.fetch, { verifyPassword: verifyToken });

valTownChatGPT2