docs(dynamic-apps): sync from rivet-dev/dynamic-apps@cc779c1 (#34)

Co-authored-by: rivet-docs-sync[bot] <docs-sync@rivet.dev>

Author: NathanFlurry

vendor/dynamic-apps/examples/apps-ai-builder/fixtures/app/package.json

@@ -0,0 +1,14 @@
+{
+	"name": "generated-rivetkit-app",
+	"version": "0.0.0",
+	"private": true,
+	"type": "module",
+	"main": "dist/index.js",
+	"scripts": {
+		"build": "tsc",
+		"check-types": "tsc --noEmit"
+	},
+	"devDependencies": {
+		"typescript": "5.7.3"
+	}
+}

vendor/dynamic-apps/examples/apps-ai-builder/fixtures/app/src/index.ts

@@ -0,0 +1,8 @@
+export default {
+	fetch(request: Request) {
+		return Response.json({
+			message: "Replace this seed with the generated application.",
+			path: new URL(request.url).pathname,
+		});
+	},
+};

vendor/dynamic-apps/examples/apps-ai-builder/fixtures/app/tsconfig.json

@@ -0,0 +1,12 @@
+{
+	"compilerOptions": {
+		"target": "ES2022",
+		"lib": ["ES2022", "DOM"],
+		"module": "NodeNext",
+		"moduleResolution": "NodeNext",
+		"strict": true,
+		"outDir": "dist",
+		"skipLibCheck": true
+	},
+	"include": ["src"]
+}

vendor/dynamic-apps/examples/apps-ai-builder/package.json

@@ -0,0 +1,22 @@
+{
+	"name": "@rivet-dev/dynamic-apps-example-ai-builder",
+	"version": "0.0.1",
+	"private": true,
+	"type": "module",
+	"scripts": {
+		"start": "node --no-node-snapshot --import tsx src/server.ts",
+		"check-types": "tsc --noEmit"
+	},
+	"dependencies": {
+		"@ai-sdk/anthropic": "^4.0.19",
+		"@hono/node-server": "^2.0.11",
+		"@rivet-dev/dynamic-apps": "workspace:*",
+		"ai": "^7.0.37",
+		"hono": "^4.12.9"
+	},
+	"devDependencies": {
+		"@types/node": "^22.19.15",
+		"tsx": "^4.20.6",
+		"typescript": "^5.7.3"
+	}
+}

vendor/dynamic-apps/examples/apps-ai-builder/src/server.ts

@@ -0,0 +1,132 @@
+import { readFile } from "node:fs/promises";
+import { anthropic } from "@ai-sdk/anthropic";
+import { serve } from "@hono/node-server";
+import { appsRouter, deployApp } from "@rivet-dev/dynamic-apps";
+import { generateText } from "ai";
+import { Hono } from "hono";
+
+const editablePaths = [
+	"package.json",
+	"tsconfig.json",
+	"src/index.ts",
+] as const;
+const maxRepairs = 3;
+const maxFileBytes = 64 * 1024;
+
+async function loadSeed(): Promise<Record<string, string>> {
+	const files: Record<string, string> = {};
+	for (const path of editablePaths) {
+		files[path] = await readFile(
+			new URL(`../fixtures/app/${path}`, import.meta.url),
+			"utf8",
+		);
+	}
+	return files;
+}
+
+function parseFiles(text: string): Record<string, string> {
+	const json = text.match(/```json\s*([\s\S]*?)```/)?.[1] ?? text;
+	const value = JSON.parse(json) as { files?: Record<string, unknown> };
+	if (!value.files || typeof value.files !== "object") {
+		throw new TypeError("model response must contain a files object");
+	}
+	const files: Record<string, string> = {};
+	for (const path of editablePaths) {
+		const content = value.files[path];
+		if (typeof content !== "string") {
+			throw new TypeError(`model response is missing ${path}`);
+		}
+		if (Buffer.byteLength(content) > maxFileBytes) {
+			throw new RangeError(`${path} exceeds ${maxFileBytes} bytes`);
+		}
+		files[path] = content;
+	}
+	return files;
+}
+
+async function revise(
+	prompt: string,
+	files: Record<string, string>,
+	diagnostics?: string,
+): Promise<Record<string, string>> {
+	const result = await generateText({
+		model: anthropic(process.env.AI_MODEL ?? "claude-sonnet-4-5"),
+		maxOutputTokens: 8_000,
+		prompt: [
+			'Return JSON only as {"files":{"path":"content"}}.',
+			`You may edit only: ${editablePaths.join(", ")}.`,
+			"The app must export a default object with fetch(request) returning a Web Response.",
+			`User request: ${prompt}`,
+			diagnostics ? `Previous build diagnostics:\n${diagnostics}` : "",
+			`Current files:\n${JSON.stringify(files)}`,
+		]
+			.filter(Boolean)
+			.join("\n\n"),
+	});
+	return parseFiles(result.text);
+}
+
+async function generateApp(appId: string, prompt: string) {
+	let files = await revise(prompt, await loadSeed());
+	for (let attempt = 0; attempt <= maxRepairs; attempt += 1) {
+		try {
+			return await deployApp({
+				appId,
+				files,
+			});
+		} catch (error) {
+			const appsError =
+				typeof error === "object" &&
+				error !== null &&
+				"code" in error &&
+				typeof error.code === "string" &&
+				error.code.startsWith("agentos_apps_");
+			if (!appsError || attempt === maxRepairs) {
+				throw error;
+			}
+			const details = error as {
+				code: string;
+				message?: string;
+				metadata?: unknown;
+			};
+			const diagnostics = JSON.stringify({
+				code: details.code,
+				message: details.message ?? String(error),
+				metadata: details.metadata,
+			}).slice(0, 16 * 1024);
+			files = await revise(prompt, files, diagnostics);
+		}
+	}
+	throw new Error("unreachable");
+}
+
+const server = new Hono();
+const dispatchRegistry = (request: Request) => {
+	const headers = new Headers(request.headers);
+	headers.set("x-agentos-app-registry-dispatch", "1");
+	return appsRouter.fetch(new Request(request, { headers }));
+};
+server.all("/api/rivet", (c) => dispatchRegistry(c.req.raw));
+server.all("/api/rivet/*", (c) => dispatchRegistry(c.req.raw));
+
+// An agent or any other part of the system can call this route. A generic
+// deployment endpoint could accept multipart files; this example generates the
+// files from a prompt instead.
+server.post("/deploy/:name", async (context) => {
+	const body = await context.req.json<{ prompt?: unknown }>();
+	if (typeof body.prompt !== "string" || body.prompt.length > 4_000) {
+		return context.json(
+			{ error: "prompt must be at most 4,000 characters" },
+			400,
+		);
+	}
+	return context.json(
+		await generateApp(context.req.param("name"), body.prompt),
+	);
+});
+server.route("/apps", appsRouter);
+
+serve({
+	fetch: server.fetch,
+	port: 3000,
+});

vendor/dynamic-apps/examples/apps-ai-builder/tsconfig.json

@@ -0,0 +1,12 @@
+{
+	"compilerOptions": {
+		"target": "ES2022",
+		"lib": ["ES2022", "DOM"],
+		"module": "NodeNext",
+		"moduleResolution": "NodeNext",
+		"strict": true,
+		"noEmit": true,
+		"skipLibCheck": true
+	},
+	"include": ["src"]
+}

vendor/dynamic-apps/examples/apps-hello-world/fixtures/app/package.json

@@ -0,0 +1,12 @@
+{
+	"name": "hello-world-app",
+	"version": "0.0.0",
+	"private": true,
+	"main": "src/index.ts",
+	"scripts": {
+		"check-types": "node --check src/index.mjs"
+	},
+	"dependencies": {
+		"hono": "^4.12.9"
+	}
+}

vendor/dynamic-apps/examples/apps-hello-world/fixtures/app/src/index.ts

@@ -0,0 +1,29 @@
+import { Hono } from "hono";
+
+const app = new Hono();
+
+// Serve the application's frontend.
+app.get("/", (c) => {
+	return c.html(`<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<title>Hello from Dynamic Apps</title>
+	</head>
+	<body>
+		<main>
+			<h1>Hello from Dynamic Apps</h1>
+			<p>This HTML is served by an HTTP app running inside a V8 isolate.</p>
+			<p><a href="./api/hello">Call the JSON API</a></p>
+		</main>
+	</body>
+</html>`);
+});
+
+// Serve a REST API request from the same application.
+app.get("/api/hello", (c) => {
+	return c.json({ message: "Hello from Dynamic Apps" });
+});
+
+export default app;

vendor/dynamic-apps/examples/apps-hello-world/package.json

@@ -0,0 +1,21 @@
+{
+	"name": "@rivet-dev/dynamic-apps-example-hello-world",
+	"version": "0.0.1",
+	"private": true,
+	"type": "module",
+	"scripts": {
+		"start": "node --no-node-snapshot --import tsx src/server.ts",
+		"deploy": "node --import tsx src/deploy.ts",
+		"check-types": "tsc --noEmit"
+	},
+	"dependencies": {
+		"@hono/node-server": "^2.0.11",
+		"@rivet-dev/dynamic-apps": "workspace:*",
+		"hono": "^4.12.9"
+	},
+	"devDependencies": {
+		"@types/node": "^22.19.15",
+		"tsx": "^4.20.6",
+		"typescript": "^5.7.3"
+	}
+}

vendor/dynamic-apps/examples/apps-hello-world/src/deploy.ts

@@ -0,0 +1,32 @@
+import { deployApp } from "@rivet-dev/dynamic-apps";
+
+// An agent, upload endpoint, or any other part of the system can call
+// deployApp() with the files it generated.
+await deployApp({
+	appId: "hello-world",
+	files: {
+		"package.json": JSON.stringify({
+			name: "hello-world-app",
+			version: "0.0.0",
+			private: true,
+			type: "module",
+			main: "src/index.ts",
+			dependencies: {
+				hono: "^4.12.9",
+			},
+		}),
+		"src/index.ts": `
+import { Hono } from "hono";
+
+const app = new Hono();
+
+// Serve the application's frontend.
+app.get("/", (c) => c.html("<h1>Hello from Dynamic Apps</h1>"));
+
+// Serve a REST API request from the same application.
+app.get("/api/hello", (c) => c.json({ message: "Hello from Dynamic Apps" }));
+
+export default app;
+`,
+	},
+});