Add the Artifacts console pages

.changeset/olive-crabs-repeat.md

@@ -0,0 +1,5 @@
+---
+"executor": patch
+---
+
+Add an Artifacts tab. Interactive components an agent generates with `render-ui` are saved and listed in the console, and each one has its own page that renders it live — the page an MCP client without MCP Apps support deep-links to. Artifacts can be renamed and deleted from the console, and agents find them again by title.

.oxfmtrc.json

@@ -13,6 +13,7 @@
     "*.tsbuildinfo",
     "executor-*.tgz",
     "**/routeTree.gen.ts",
+    "**/smoke-harness-bundle.gen.ts",
     "apps/cloud/src/services/executor-schema.ts"
   ]
 }

.oxlintrc.jsonc

@@ -119,6 +119,31 @@
         "executor/no-try-catch-or-throw": "off",
       },
     },
+    {
+      // boundary: the MCP-Apps shell is browser code, not Effect domain code.
+      // It runs inside a sandboxed iframe and talks to the host over
+      // postMessage and the MCP bridge — both of which are throw/Promise APIs
+      // with no Effect runtime present. `new Function` evaluation of generated
+      // JSX, CSS harvesting off `document.styleSheets`, and JSON on the wire
+      // all surface untyped JS errors that must be caught and rendered rather
+      // than modelled. Scoped to the iframe payload plus its build config; the
+      // package's Effect-facing loader (`src/shell-html.ts`) is deliberately
+      // NOT listed and uses inline suppressions instead.
+      "files": [
+        "packages/hosts/mcp-apps-shell/src/shell/**/*.{ts,tsx}",
+        "packages/hosts/mcp-apps-shell/vite.config.shell.ts",
+      ],
+      "rules": {
+        "executor/no-double-cast": "off",
+        "executor/no-error-constructor": "off",
+        "executor/no-instanceof-error": "off",
+        "executor/no-json-parse": "off",
+        "executor/no-promise-catch": "off",
+        "executor/no-promise-reject": "off",
+        "executor/no-try-catch-or-throw": "off",
+        "executor/no-unknown-error-message": "off",
+      },
+    },
     {
       "files": ["packages/kernel/core/src/code-recovery.ts"],
       "rules": {

apps/cli/src/build.ts

@@ -25,6 +25,32 @@ const resolveQuickJsWasmPath = (): string => {
   return wasmPath;
 };
 
+// ---------------------------------------------------------------------------
+// MCP-Apps shell (mcp-app.html)
+//
+// The MCP host serves the shell as the `ui://executor/shell.html` resource, and
+// `@executor-js/mcp-apps-shell` reads it from disk at runtime. That runtime
+// `fs.readFile` is invisible to `bun build --compile`, so without this the
+// packaged binary would serve the "Shell not built" placeholder and every
+// generated UI would render blank. Build it if missing and copy it next to the
+// executable, where the loader finds it via `process.execPath` — the same
+// colocation trick used for `libsql.node` / `emscripten-module.wasm`.
+// ---------------------------------------------------------------------------
+
+const mcpAppsShellDir = resolve(repoRoot, "packages/hosts/mcp-apps-shell");
+const mcpAppsShellHtml = join(mcpAppsShellDir, "dist/mcp-app.html");
+
+const ensureMcpAppsShell = async (): Promise<string> => {
+  if (!existsSync(mcpAppsShellHtml)) {
+    console.log("Building MCP-Apps shell (mcp-app.html)...");
+    await $`bun run --cwd ${mcpAppsShellDir} build:shell`.quiet();
+  }
+  if (!existsSync(mcpAppsShellHtml)) {
+    throw new Error(`MCP-Apps shell missing at ${mcpAppsShellHtml} after build:shell`);
+  }
+  return mcpAppsShellHtml;
+};
+
 const resolveOnePasswordCoreWasmPath = (): string => {
   const req = createRequire(join(repoRoot, "packages/plugins/onepassword/package.json"));
   const sdkPkg = req.resolve("@1password/sdk/package.json");
@@ -398,6 +424,7 @@ const buildBinaries = async (targets: Target[], mode: BuildMode) => {
   await writeFile(embeddedMigrationsPath, `${embeddedMigrations}\n`);
 
   const quickJsWasmPath = resolveQuickJsWasmPath();
+  const mcpAppsShellPath = await ensureMcpAppsShell();
   const onePasswordCoreWasmPath = resolveOnePasswordCoreWasmPath();
   const workerBundlerDistPath = resolveWorkerBundlerDistPath();
   const packedWorkerBundlerSource = await createPackedWorkerBundlerSource(workerBundlerDistPath);
@@ -423,6 +450,10 @@ const buildBinaries = async (targets: Target[], mode: BuildMode) => {
       // Copy QuickJS WASM next to binary — loaded at runtime by the server
       await cp(quickJsWasmPath, join(binDir, "emscripten-module.wasm"));
 
+      // Copy the MCP-Apps shell next to the binary. Platform-independent HTML,
+      // read from execDir at runtime by @executor-js/mcp-apps-shell.
+      await cp(mcpAppsShellPath, join(binDir, "mcp-app.html"));
+
       // Copy 1Password's sdk-core WASM next to the binary. The patched
       // sdk-core loader falls back to this sibling file when bun --compile
       // bakes a build-machine node_modules path into __dirname.

apps/cli/src/main.ts

@@ -1337,14 +1337,19 @@ const runBackgroundDaemonStart = (input: {
 // Stdio MCP session: a pure stdio <-> HTTP bridge to the owning local daemon.
 // ---------------------------------------------------------------------------
 
-const mcpUrlForActiveLocalServer = (
-  connection: ExecutorServerConnection,
-  elicitationMode: "browser" | "model",
-): URL => {
-  const url = new URL("/mcp", connection.origin);
-  if (elicitationMode === "browser") {
+const mcpUrlForActiveLocalServer = (input: {
+  readonly connection: ExecutorServerConnection;
+  readonly elicitationMode: "browser" | "model";
+  readonly artifacts: boolean;
+}): URL => {
+  const url = new URL("/mcp", input.connection.origin);
+  if (input.elicitationMode === "browser") {
     url.searchParams.set("elicitation_mode", "browser");
   }
+  // Only the opt-in is spelled out; the default endpoint stays clean.
+  if (input.artifacts) {
+    url.searchParams.set("artifacts", "true");
+  }
   return url;
 };
 
@@ -1359,11 +1364,16 @@ const mcpUrlForActiveLocalServer = (
 const runMcpHttpBridge = async (input: {
   readonly manifest: ExecutorLocalServerManifest;
   readonly elicitationMode: "browser" | "model";
+  readonly artifacts: boolean;
 }): Promise<void> => {
   const stdio = new StdioServerTransport();
   const authorization = getExecutorServerAuthorizationHeader(input.manifest.connection);
   const http = new StreamableHTTPClientTransport(
-    mcpUrlForActiveLocalServer(input.manifest.connection, input.elicitationMode),
+    mcpUrlForActiveLocalServer({
+      connection: input.manifest.connection,
+      elicitationMode: input.elicitationMode,
+      artifacts: input.artifacts,
+    }),
     authorization ? { requestInit: { headers: { Authorization: authorization } } } : undefined,
   );
 
@@ -1438,7 +1448,10 @@ const runMcpHttpBridge = async (input: {
   }
 };
 
-const runStdioMcpSession = (input: { readonly elicitationMode: "browser" | "model" }) =>
+const runStdioMcpSession = (input: {
+  readonly elicitationMode: "browser" | "model";
+  readonly artifacts: boolean;
+}) =>
   Effect.gen(function* () {
     // `executor mcp` never owns the local database. If a local server is already
     // running, bridge this stdio client to it; otherwise ensure a durable
@@ -1450,7 +1463,11 @@ const runStdioMcpSession = (input: { readonly elicitationMode: "browser" | "mode
     const active = yield* readActiveLocalServerManifest();
     if (active) {
       yield* Effect.promise(() =>
-        runMcpHttpBridge({ manifest: active, elicitationMode: input.elicitationMode }),
+        runMcpHttpBridge({
+          manifest: active,
+          elicitationMode: input.elicitationMode,
+          artifacts: input.artifacts,
+        }),
       );
       return;
     }
@@ -1472,7 +1489,11 @@ const runStdioMcpSession = (input: { readonly elicitationMode: "browser" | "mode
       );
     }
     yield* Effect.promise(() =>
-      runMcpHttpBridge({ manifest: elected, elicitationMode: input.elicitationMode }),
+      runMcpHttpBridge({
+        manifest: elected,
+        elicitationMode: input.elicitationMode,
+        artifacts: input.artifacts,
+      }),
     );
   });
 
@@ -2781,11 +2802,18 @@ const mcpCommand = Command.make(
           "Choose the stdio approval flow: browser approval or a CLI resume tool exposed to the model.",
         ),
       ),
+    artifacts: Options.boolean("artifacts")
+      .pipe(Options.withDefault(false))
+      .pipe(
+        Options.withDescription(
+          "Serve the artifact surface on this connection: the artifact tools, the app shell resource, and the artifact skills. Withheld by default.",
+        ),
+      ),
   },
-  ({ scope, elicitationMode }) =>
+  ({ scope, elicitationMode, artifacts }) =>
     Effect.gen(function* () {
       applyScope(scope);
-      yield* runStdioMcpSession({ elicitationMode });
+      yield* runStdioMcpSession({ elicitationMode, artifacts });
     }),
 ).pipe(Command.withDescription("Start an MCP server over stdio"));
 

apps/cloud/drizzle/0013_curly_rocket_racer.sql

@@ -0,0 +1,15 @@
+CREATE TABLE "artifact" (
+	"id" varchar(255) NOT NULL,
+	"title" text NOT NULL,
+	"description" text,
+	"code" text NOT NULL,
+	"created_at" timestamp NOT NULL,
+	"updated_at" timestamp NOT NULL,
+	"row_id" varchar(255) PRIMARY KEY NOT NULL,
+	"tenant" varchar(255) NOT NULL,
+	"owner" varchar(255) NOT NULL,
+	"subject" varchar(255) NOT NULL
+);
+--> statement-breakpoint
+ALTER TABLE "definition" ALTER COLUMN "name" SET DATA TYPE varchar(255);--> statement-breakpoint
+CREATE UNIQUE INDEX "artifact_uidx" ON "artifact" USING btree ("tenant","owner","subject","id");

apps/cloud/drizzle/0014_new_karma.sql

@@ -0,0 +1 @@
+ALTER TABLE "artifact" ADD COLUMN "bindings" json;

apps/cloud/drizzle/0015_equal_the_leader.sql

@@ -0,0 +1 @@
+ALTER TABLE "artifact" ADD COLUMN "preview" text;