@lazyingart/agintiflow 0.20.172 → 0.20.174

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lazyingart/agintiflow",
-  "version": "0.20.172",
+  "version": "0.20.174",
   "type": "module",
   "description": "AgInTiFlow is a project-aware agent workspace for hybrid wet-dry R&D, hardware-aware intelligence, software automation, and industrial workflows.",
   "license": "Apache-2.0",

package/public/app.js

@@ -1782,33 +1782,234 @@ function renderPermissionApproval(entry) {
   `;
 }
 
+function renderPlanEvent(entry) {
+  const data = entry.data || {};
+  const plan = data.plan || entry.content || "";
+  return `
+    <article class="event-card event-plan">
+      <div class="event-card-meta">
+        <span>plan</span>
+        <span>${entry.at ? escapeHtml(new Date(entry.at).toLocaleString()) : ""}</span>
+      </div>
+      <div class="markdown-body">${renderMarkdown(plan)}</div>
+    </article>
+  `;
+}
+
+function embeddedWorkspaceChangesFromText(value = "") {
+  const lines = String(value || "").split(/\r?\n/);
+  const changes = [];
+  let currentTool = "";
+
+  for (let index = 0; index < lines.length; index += 1) {
+    const toolMatch = lines[index].match(/^\s*Tool:\s*(.+?)\s*$/i);
+    if (toolMatch) {
+      currentTool = toolMatch[1].trim();
+      continue;
+    }
+
+    const pathMatch = lines[index].match(/^\s*Path:\s*(.+?)\s*$/i);
+    if (!pathMatch) continue;
+
+    let cursor = index + 1;
+    while (cursor < lines.length && !/^\s*Diff:\s*$/i.test(lines[cursor]) && !/^\s*(?:Tool|Path):\s*/i.test(lines[cursor])) {
+      cursor += 1;
+    }
+    if (!/^\s*Diff:\s*$/i.test(lines[cursor] || "")) continue;
+
+    const diffLines = [];
+    cursor += 1;
+    while (cursor < lines.length) {
+      if (diffLines.length && /^\s*(?:Tool|Path):\s*/i.test(lines[cursor])) break;
+      if (
+        diffLines.length &&
+        /^\s*(?:Output:|No command output|Blocked by guardrail\.|Mock run complete\.)/i.test(lines[cursor]) &&
+        !/^[-+@ ]/.test(lines[cursor])
+      ) {
+        break;
+      }
+      diffLines.push(lines[cursor]);
+      cursor += 1;
+    }
+    while (diffLines.length && !diffLines[diffLines.length - 1].trim()) diffLines.pop();
+    if (diffLines.length) {
+      changes.push({
+        toolName: currentTool || "write_file",
+        path: pathMatch[1].trim(),
+        diff: diffLines.join("\n"),
+      });
+      index = Math.max(index, cursor - 1);
+    }
+  }
+
+  return changes;
+}
+
+function embeddedWorkspaceSummary(value = "") {
+  const summary = [];
+  let skippingDiff = false;
+  for (const line of String(value || "").split(/\r?\n/)) {
+    if (/^\s*Diff:\s*$/i.test(line)) {
+      skippingDiff = true;
+      continue;
+    }
+    if (skippingDiff && /^\s*(?:Tool|Path):\s*/i.test(line)) skippingDiff = false;
+    if (skippingDiff) continue;
+    if (/^\s*Path:\s*/i.test(line)) continue;
+    summary.push(line);
+  }
+  return summary.join("\n").replace(/\n{3,}/g, "\n\n").trim();
+}
+
+function renderEmbeddedWorkspaceResult(value = "", entry = {}) {
+  const changes = embeddedWorkspaceChangesFromText(value);
+  if (changes.length === 0) return "";
+  const summary = embeddedWorkspaceSummary(value);
+  return `
+    ${summary ? `<div class="event-result-summary markdown-body">${renderMarkdown(summary)}</div>` : ""}
+    <div class="embedded-change-list">
+      ${changes.map((change) => renderWorkspaceChangeEvent({ data: change, at: entry.at, content: change.path })).join("")}
+    </div>
+  `;
+}
+
+function renderWorkspaceChangeEvent(entry) {
+  const data = entry.data || {};
+  const toolName = data.toolName || data.action || "file.changed";
+  const isPatch = toolName === "apply_patch" || String(toolName).startsWith("apply_patch");
+  const diff = String(data.diff || "");
+  const maxDiffChars = 9000;
+  const diffBlock = diff
+    ? `<pre class="change-diff event-diff">${renderDiffHtml(diff, maxDiffChars)}</pre>${
+        diff.length > maxDiffChars ? `<div class="event-fold-note">... diff truncated for browser preview</div>` : ""
+      }`
+    : "";
+  const hashes =
+    data.beforeHash || data.afterHash
+      ? `<div class="event-card-meta"><span>before=${escapeHtml((data.beforeHash || "new").slice(0, 10))}</span><span>after=${escapeHtml((data.afterHash || "").slice(0, 10))}</span></div>`
+      : "";
+  return `
+    <article class="event-card ${isPatch ? "event-patch" : "event-write"}">
+      <div class="event-card-meta">
+        <span>${escapeHtml(isPatch ? "patch" : "write")}</span>
+        <span>${escapeHtml(toolName)}</span>
+        <span>${entry.at ? escapeHtml(new Date(entry.at).toLocaleString()) : ""}</span>
+      </div>
+      <strong class="event-path">${escapeHtml(data.path || entry.content || "")}</strong>
+      ${data.created ? `<div class="event-fold-note">created</div>` : ""}
+      ${hashes}
+      ${diffBlock || `<div class="event-fold-note">No diff preview recorded for this file event.</div>`}
+    </article>
+  `;
+}
+
+function renderToolEvent(entry) {
+  const data = entry.data || {};
+  const message = entry.message || entry.eventType || "";
+  const failed = message === "tool.failed" || data.ok === false || data.blocked || data.error;
+  const skipped = message === "tool.skipped";
+  const toolName = data.toolName || "tool";
+  const args = data.args || {};
+  const resultText = String(data.result || args.result || "");
+  const embeddedResult = resultText ? renderEmbeddedWorkspaceResult(resultText, entry) : "";
+  const argPreview =
+    toolName === "finish"
+      ? ""
+      : toolName === "run_command" && args.command
+      ? args.command
+      : args.path || args.url || args.query || args.q || (Object.keys(args).length ? JSON.stringify(args) : "");
+  const stdout = data.stdout ? outputPreviewText(data.stdout) : null;
+  const stderr = data.stderr ? outputPreviewText(data.stderr) : null;
+  return `
+    <article class="event-card ${failed ? "event-failed" : skipped ? "event-muted" : toolName === "finish" ? "event-finish" : "event-tool"}">
+      <div class="event-card-meta">
+        <span>${escapeHtml(failed ? "tool failed" : skipped ? "tool skipped" : message === "tool.started" ? "tool" : "tool done")}</span>
+        <span>${entry.at ? escapeHtml(new Date(entry.at).toLocaleString()) : ""}</span>
+      </div>
+      <strong class="event-path">${escapeHtml(toolName)}</strong>
+      ${argPreview ? `<code class="event-inline-code">${escapeHtml(argPreview)}</code>` : ""}
+      ${data.error || data.reason ? `<div class="event-fold-note">${escapeHtml(data.error || data.reason)}</div>` : ""}
+      ${embeddedResult || (toolName === "finish" && resultText ? `<div class="markdown-body">${renderMarkdown(resultText)}</div>` : "")}
+      ${stdout ? `<div class="log-stream-title">stdout</div><pre class="event-output">${escapeHtml(stdout.text)}</pre>` : ""}
+      ${stdout?.hidden > 0 ? `<div class="event-fold-note">... ${stdout.hidden} more stdout line(s) folded</div>` : ""}
+      ${stderr ? `<div class="log-stream-title">stderr</div><pre class="event-output">${escapeHtml(stderr.text)}</pre>` : ""}
+      ${stderr?.hidden > 0 ? `<div class="event-fold-note">... ${stderr.hidden} more stderr line(s) folded</div>` : ""}
+    </article>
+  `;
+}
+
+function renderStatusEvent(entry) {
+  const data = entry.data || {};
+  const message = entry.message || entry.eventType || "event";
+  const label = entry.eventLabel || message.replace(/^[^.]+\./, "");
+  const content = data.result || data.error || data.reason || entry.content || "";
+  const failed = message === "session.failed";
+  const embeddedResult = content ? renderEmbeddedWorkspaceResult(content, entry) : "";
+  return `
+    <article class="event-card ${failed ? "event-failed" : message === "session.finished" && embeddedResult ? "event-finish" : "event-muted"}">
+      <div class="event-card-meta">
+        <span>${escapeHtml(label)}</span>
+        <span>${entry.at ? escapeHtml(new Date(entry.at).toLocaleString()) : ""}</span>
+      </div>
+      ${embeddedResult || (content ? `<div class="chat-content">${escapeHtml(content)}</div>` : "")}
+    </article>
+  `;
+}
+
+function renderStructuredEvent(entry) {
+  const message = entry.message || entry.eventType || "";
+  if (message === "plan.created") return renderPlanEvent(entry);
+  if (message === "command.output") return renderCommandOutputLog(entry);
+  if (message === "file.changed") return renderWorkspaceChangeEvent(entry);
+  if (message === "tool.blocked" && entry.data?.permissionAdvice) return renderPermissionApproval(entry);
+  if (message === "tool.blocked") {
+    return `
+      <article class="event-card event-failed">
+        <div class="event-card-meta">
+          <span>permission</span>
+          <span>${entry.at ? escapeHtml(new Date(entry.at).toLocaleString()) : ""}</span>
+        </div>
+        <strong class="event-path">${escapeHtml(entry.data?.toolName || "blocked")}</strong>
+        <div class="chat-content">${escapeHtml(entry.data?.reason || entry.content || "Permission blocked.")}</div>
+      </article>
+    `;
+  }
+  if (message === "tool.started" || message === "tool.completed" || message === "tool.failed" || message === "tool.skipped") {
+    return renderToolEvent(entry);
+  }
+  if (
+    message === "budget.initialized" ||
+    message === "conversation.continued" ||
+    message === "conversation.queued_input_applied" ||
+    message === "session.finished" ||
+    message === "session.failed" ||
+    message === "session.stopped"
+  ) {
+    return renderStatusEvent(entry);
+  }
+  return "";
+}
+
 function renderLogs(run) {
   logsEl.dataset.mode = "active";
+  const structuredRunResult = run.result ? renderEmbeddedWorkspaceResult(run.result, { at: run.endedAt || run.updatedAt || "" }) : "";
   const parts = [
     `<div class="log-line">${escapeHtml(`status=${run.status} session=${run.sessionId} provider=${run.provider} model=${run.model}`)}</div>`,
-    run.result ? `<div class="log-line">${escapeHtml(`result=${run.result}`)}</div>` : "",
+    structuredRunResult
+      ? `<article class="event-card event-finish"><div class="event-card-meta"><span>result</span></div>${structuredRunResult}</article>`
+      : run.result
+        ? `<div class="log-line">${escapeHtml(`result=${run.result}`)}</div>`
+        : "",
     run.error ? `<div class="log-line error">${escapeHtml(`error=${run.error}`)}</div>` : "",
   ];
 
   for (const entry of run.logs || []) {
-    if (entry.message === "command.output") {
-      parts.push(renderCommandOutputLog(entry));
-      continue;
-    }
-    if (entry.message === "plan.created" && entry.data?.plan) {
-      parts.push(`
-        <article class="log-plan">
-          <div class="log-plan-title">${escapeHtml(`[${entry.at}] plan`)}</div>
-          <div class="markdown-body">${renderMarkdown(entry.data.plan)}</div>
-        </article>
-      `);
+    const structured = renderStructuredEvent(entry);
+    if (structured) {
+      parts.push(structured);
       continue;
     }
     parts.push(`<div class="log-line">${escapeHtml(`[${entry.at}] ${entry.kind}: ${entry.message}`)}</div>`);
-    if (entry.message === "tool.blocked" && entry.data?.permissionAdvice) {
-      parts.push(renderPermissionApproval(entry));
-      continue;
-    }
     if (entry.data && Object.keys(entry.data).length > 0) {
       parts.push(`<pre class="log-json">${escapeHtml(JSON.stringify(entry.data, null, 2))}</pre>`);
     }
@@ -2054,17 +2255,35 @@ function renderChat(chatEntries) {
   chatThreadEl.innerHTML = lastChatEntries
     .map((entry) => {
       if (entry.role === "event") {
-        const label = entry.eventLabel || entry.eventType || "event";
-        const content = entry.markdown
-          ? `<div class="markdown-body">${renderMarkdown(entry.content)}</div>`
-          : escapeHtml(entry.content || "").replace(/\n/g, "<br>");
-        return `
+        return renderStructuredEvent(entry) || `
           <article class="chat-item event" data-event-type="${escapeHtml(entry.eventType || "")}">
-            <div class="chat-meta">${escapeHtml(label)}${entry.at ? ` · ${new Date(entry.at).toLocaleString()}` : ""}</div>
-            <div class="chat-content">${content}</div>
+            <div class="chat-meta">${escapeHtml(entry.eventLabel || entry.eventType || "event")}${entry.at ? ` · ${new Date(entry.at).toLocaleString()}` : ""}</div>
+            <div class="chat-content">${escapeHtml(entry.content || "").replace(/\n/g, "<br>")}</div>
           </article>
         `;
       }
+      if (entry.role === "tool") {
+        try {
+          const parsed = JSON.parse(entry.content || "{}");
+          const toolName = parsed.toolName || "tool";
+          return renderToolEvent({
+            role: "event",
+            eventType: parsed.ok === false ? "tool.failed" : "tool.completed",
+            message: parsed.ok === false ? "tool.failed" : "tool.completed",
+            eventLabel: parsed.ok === false ? "tool failed" : "tool done",
+            data: parsed,
+            content: parsed.result || toolName,
+            at: entry.at,
+          });
+        } catch {
+          return `
+            <article class="event-card event-tool">
+              <div class="event-card-meta">tool${entry.at ? ` · ${new Date(entry.at).toLocaleString()}` : ""}</div>
+              <pre class="event-output">${escapeHtml(entry.content || "")}</pre>
+            </article>
+          `;
+        }
+      }
       const role = entry.role === "assistant" ? "assistant" : "user";
       const label = role === "assistant" ? t("assistantLabel") : t("youLabel");
       const content =

package/public/styles.css

@@ -1155,23 +1155,6 @@ button.danger {
   color: #fecaca;
 }
 
-.log-plan {
-  margin: 0 0 12px;
-  padding: 12px;
-  border: 1px solid rgba(94, 234, 212, 0.22);
-  border-radius: 14px;
-  background: rgba(15, 23, 42, 0.54);
-}
-
-.log-plan-title {
-  margin-bottom: 8px;
-  color: #99f6e4;
-  font-size: 0.82rem;
-  font-weight: 800;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-}
-
 .log-json,
 .log-command pre {
   margin: 8px 0 12px;
@@ -1242,6 +1225,160 @@ button.danger {
   padding: 0 12px 8px;
 }
 
+.event-card {
+  width: auto;
+  max-width: 100%;
+  margin: 0 0 12px;
+  padding: 12px;
+  border: 1px solid rgba(20, 184, 166, 0.22);
+  border-radius: 16px;
+  background:
+    radial-gradient(circle at 0% 0%, rgba(20, 184, 166, 0.14), transparent 28%),
+    rgba(255, 255, 255, 0.46);
+  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
+}
+
+#logs .event-card {
+  background:
+    radial-gradient(circle at 0% 0%, rgba(20, 184, 166, 0.1), transparent 26%),
+    rgba(15, 23, 42, 0.52);
+  color: #e5e7eb;
+}
+
+.event-plan {
+  border-color: rgba(20, 184, 166, 0.34);
+  background:
+    radial-gradient(circle at 0% 0%, rgba(20, 184, 166, 0.18), transparent 28%),
+    linear-gradient(180deg, rgba(240, 253, 250, 0.9), rgba(255, 251, 235, 0.74));
+}
+
+#logs .event-plan {
+  background: rgba(15, 23, 42, 0.58);
+}
+
+.event-patch {
+  border-color: rgba(192, 132, 252, 0.38);
+}
+
+.event-write {
+  border-color: rgba(59, 130, 246, 0.28);
+}
+
+.event-finish {
+  border-color: rgba(16, 185, 129, 0.36);
+  background:
+    radial-gradient(circle at 0% 0%, rgba(16, 185, 129, 0.14), transparent 30%),
+    rgba(236, 253, 245, 0.46);
+}
+
+#logs .event-finish {
+  background:
+    radial-gradient(circle at 0% 0%, rgba(16, 185, 129, 0.16), transparent 30%),
+    rgba(6, 78, 59, 0.28);
+}
+
+.event-failed {
+  border-color: rgba(248, 113, 113, 0.45);
+  background: rgba(127, 29, 29, 0.12);
+}
+
+#logs .event-failed {
+  background: rgba(127, 29, 29, 0.3);
+}
+
+.event-muted {
+  border-color: rgba(148, 163, 184, 0.24);
+  background: rgba(148, 163, 184, 0.1);
+}
+
+.event-card-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-bottom: 8px;
+  color: var(--muted);
+  font-size: 0.78rem;
+  font-weight: 800;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+#logs .event-card-meta {
+  color: #99f6e4;
+}
+
+.event-path {
+  display: block;
+  margin: 4px 0 8px;
+  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
+  font-size: 0.84rem;
+  overflow-wrap: anywhere;
+}
+
+.event-inline-code {
+  display: block;
+  width: fit-content;
+  max-width: 100%;
+  margin: 4px 0 8px;
+  padding: 6px 8px;
+  border-radius: 8px;
+  background: rgba(15, 23, 42, 0.08);
+  color: #78350f;
+  font-family: "IBM Plex Mono", "SFMono-Regular", monospace;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+
+#logs .event-inline-code {
+  background: rgba(255, 255, 255, 0.08);
+  color: #fef3c7;
+}
+
+.event-output {
+  margin: 4px 0 10px;
+  padding: 10px;
+  border-radius: 10px;
+  background: rgba(15, 23, 42, 0.84);
+  color: #e5e7eb;
+  white-space: pre-wrap;
+  overflow: auto;
+}
+
+.event-fold-note {
+  margin: 4px 0 8px;
+  color: var(--muted);
+  font-size: 0.8rem;
+}
+
+.event-result-summary {
+  margin: 4px 0 12px;
+  padding: 10px 12px;
+  border-radius: 12px;
+  background: rgba(15, 118, 110, 0.08);
+}
+
+#logs .event-result-summary {
+  background: rgba(255, 255, 255, 0.08);
+}
+
+.embedded-change-list {
+  display: grid;
+  gap: 8px;
+}
+
+.embedded-change-list > .event-card {
+  margin: 0;
+  box-shadow: none;
+}
+
+#logs .event-fold-note {
+  color: #94a3b8;
+}
+
+.event-diff {
+  max-height: 360px;
+}
+
 .chat-panel {
   display: grid;
   gap: 12px;

package/scripts/smoke-cli-chat.js

@@ -893,6 +893,12 @@ try {
   if (!latest.stdout.includes(" plan ")) {
     throw new Error("bare aginti resume did not replay saved plan/run context");
   }
+  if (!latest.stdout.includes(" write ") || !latest.stdout.includes("+Created by AgInTiFlow mock mode.")) {
+    throw new Error("bare aginti resume did not replay formatted file-change diff context");
+  }
+  if (!/\bfinish\b/.test(latest.stdout) || latest.stdout.includes('{"result":"Mock run complete')) {
+    throw new Error("bare aginti resume did not render finish-result diffs in formatted mode");
+  }
   if (latest.stdout.includes("resume note=showing chat transcript only")) {
     throw new Error("bare aginti resume regressed to chat-only history");
   }

package/scripts/smoke-web-api.js

@@ -257,6 +257,11 @@ try {
   if (fileRun.status !== "finished") throw new Error(`mock file run failed: ${fileRun.error || "unknown error"}`);
   const hello = await fs.readFile(path.join(runtimeDir, "notes", "hello.md"), "utf8");
   if (!hello.includes("Created by AgInTiFlow mock mode.")) throw new Error("mock file run did not create requested path");
+  const fileChat = await fetchJson(`/api/sessions/${encodeURIComponent(fileRunStart.sessionId)}/chat`);
+  const fileChange = fileChat.timeline?.find((entry) => entry.role === "event" && entry.eventType === "file.changed");
+  if (!fileChange?.data?.diff || !fileChange.data.diff.includes("+Created by AgInTiFlow mock mode.")) {
+    throw new Error("chat timeline did not preserve structured file-change diff data");
+  }
 
   const safeRunStart = await fetchJson("/api/runs", {
     method: "POST",

package/scripts/smoke-web-ui.js

@@ -56,7 +56,7 @@ async function waitForRunState(page, status, timeout = 20000) {
   );
 }
 
-async function waitForTerminalRunState(page, timeout = 30000) {
+async function waitForTerminalRunState(page, timeout = 90000) {
   await page.waitForFunction(
     () => ["finished", "failed", "stopped"].includes(document.querySelector("#run-state")?.dataset.status || ""),
     null,
@@ -92,6 +92,7 @@ try {
   if (await page.locator("#run-defaults-card").evaluate((node) => node.open)) throw new Error("run defaults should start folded");
   await page.locator("#commandCwd").fill(runtimeDir.slice(0, Math.max(runtimeDir.lastIndexOf("/"), 1)));
   await page.waitForFunction(() => document.querySelectorAll("#command-cwd-suggestions option").length > 0);
+  await page.locator("#commandCwd").fill(runtimeDir);
   if ((await page.locator(".project-status-chip").count()) < 4) throw new Error("project folder status did not render structured chips");
   await page.locator("#run-defaults-card summary").click();
   if (await page.locator("#veniceModeToggle").isChecked()) throw new Error("Venice quick mode should default off");
@@ -143,6 +144,14 @@ try {
   await page.selectOption("#routingMode", "manual");
   await page.selectOption("#provider", "mock");
   await page.selectOption("#model", "mock-agent");
+  await page.selectOption("#enableScs", "off");
+  if (await page.locator("#aapsModeToggle").isChecked()) await page.locator("label:has(#aapsModeToggle)").click();
+  await page.selectOption("#taskProfile", "auto");
+  await page.evaluate(() => {
+    const input = document.querySelector("#allowShellTool");
+    input.checked = false;
+    input.dispatchEvent(new Event("change", { bubbles: true }));
+  });
   await page.fill("#maxSteps", "4");
   await page.selectOption("#dynamicSteps", "off");
   await page.fill("#chat-input", "Say hello from the web UI composer in one concise sentence.");
@@ -151,18 +160,24 @@ try {
   if (firstPayload.goal !== "Say hello from the web UI composer in one concise sentence.") {
     throw new Error("composer text was not used as the first run goal");
   }
-  if (firstPayload.enableScs !== "auto" || firstPayload.taskProfile !== "aaps") {
+  if (firstPayload.enableScs !== "off" || firstPayload.taskProfile !== "auto") {
     throw new Error(`CLI mode payload mismatch: ${runPayloads.at(-1) || ""}`);
   }
   if (firstPayload.dynamicSteps !== "off") {
     throw new Error(`dynamic steps payload mismatch: ${runPayloads.at(-1) || ""}`);
   }
+  if (firstPayload.allowShellTool !== false) {
+    throw new Error(`shell tool should be disabled for deterministic renderer smoke: ${runPayloads.at(-1) || ""}`);
+  }
   if (firstPayload.veniceMode !== false || firstPayload.routeProvider !== "deepseek" || firstPayload.mainProvider !== "deepseek") {
     throw new Error(`default route/main payload mismatch after Venice off: ${runPayloads.at(-1) || ""}`);
   }
   await waitForRunState(page, "running");
+  await page.waitForSelector(".event-plan", { timeout: 12000 });
+  if (!(await page.locator(".event-plan .markdown-body").first().innerText()).trim()) {
+    throw new Error("web run log did not render the plan as a formatted event card");
+  }
   if (!(await page.locator("#stop-run").isVisible())) throw new Error("stop button did not appear while run was active");
-  await page.click("#stop-run");
   await waitForTerminalRunState(page);
   if (await page.locator("#stop-run").isVisible()) throw new Error("stop button stayed visible after terminal run state");
   if (!(await page.locator(".toast").first().isVisible().catch(() => false))) {
@@ -173,6 +188,42 @@ try {
   await waitForRunState(page, "idle");
   const resetSubmit = await page.locator("#chat-submit").innerText();
   if (!/start new run/i.test(resetSubmit)) throw new Error("new session did not reset composer to start mode");
+  if (await page.locator("#aapsModeToggle").isChecked()) await page.locator("label:has(#aapsModeToggle)").click();
+  await page.selectOption("#taskProfile", "code");
+  await page.selectOption("#enableScs", "off");
+  await page.fill("#chat-input", "Create notes/web-ui-format.md with a short formatted event smoke message.");
+  await page.click("#chat-submit");
+  await waitForTerminalRunState(page);
+  try {
+    await page.waitForFunction(
+      () =>
+        [...document.querySelectorAll(".event-write .change-diff")].some((node) =>
+          (node.textContent || "").includes("+Created by AgInTiFlow mock mode.")
+        ),
+      null,
+      { timeout: 30000 }
+    );
+  } catch (error) {
+    const state = await page.locator("#run-state").evaluate((node) => node.dataset.status || "").catch(() => "unknown");
+    const logsTail = (await page.locator("#logs").innerText().catch(() => "")).slice(-1200);
+    const chatTail = (await page.locator("#chat-thread").innerText().catch(() => "")).slice(-1200);
+    throw new Error(`web UI did not render formatted file-change diff event; state=${state}\nlogs tail:\n${logsTail}\nchat tail:\n${chatTail}`);
+  }
+  try {
+    await page.waitForFunction(
+      () =>
+        [...document.querySelectorAll(".event-finish .change-diff")].some((node) =>
+          (node.textContent || "").includes("+Created by AgInTiFlow mock mode.")
+        ),
+      null,
+      { timeout: 30000 }
+    );
+  } catch (error) {
+    const state = await page.locator("#run-state").evaluate((node) => node.dataset.status || "").catch(() => "unknown");
+    const logsTail = (await page.locator("#logs").innerText().catch(() => "")).slice(-1200);
+    const chatTail = (await page.locator("#chat-thread").innerText().catch(() => "")).slice(-1200);
+    throw new Error(`web UI did not render formatted finish-result diff event; state=${state}\nlogs tail:\n${logsTail}\nchat tail:\n${chatTail}`);
+  }
 
   await page.click("#open-settings");
   await page.waitForSelector("#settings-modal[open]");
@@ -208,6 +259,9 @@ try {
           "running-status-toast",
           "terminal-stop-button-hidden",
           "new-session-resets-scope",
+          "formatted-plan-event-card",
+          "formatted-file-diff-event-card",
+          "formatted-finish-result-diff-card",
           "settings-provider-dropdowns",
           "settings-wrapper-dropdowns",
         ],

package/scripts/smoke-webapp-command.js

@@ -51,6 +51,26 @@ async function killPort(port) {
   }
 }
 
+async function stopChild(child) {
+  if (!child || child.exitCode !== null) return;
+  try {
+    child.stdin?.write("/exit\n");
+  } catch {
+    // The CLI may have closed stdin after the final prompt; fall back to process signals.
+  }
+  const exited = await Promise.race([
+    new Promise((resolve) => child.once("exit", () => resolve(true))),
+    delay(2000).then(() => false),
+  ]);
+  if (exited || child.exitCode !== null) return;
+  child.kill("SIGTERM");
+  const terminated = await Promise.race([
+    new Promise((resolve) => child.once("exit", () => resolve(true))),
+    delay(2000).then(() => false),
+  ]);
+  if (!terminated && child.exitCode === null) child.kill("SIGKILL");
+}
+
 async function runCase({ port, env = {}, expectHeader, label }) {
   const output = { stdout: "", stderr: "" };
   const child = spawn(process.execPath, [path.join(repoRoot, "bin/aginti-cli.js"), "chat", "--provider", "mock", "--routing", "manual", "--port", String(port)], {
@@ -109,8 +129,9 @@ async function runCase({ port, env = {}, expectHeader, label }) {
     child.stdin.write(`/webapp ${active.port}\n`);
     await waitFor(() => latestWebappEvent(output.stdout, "started|reused")?.port === active.port, child, `${label} /webapp restart after stop`, output);
   } finally {
-    child.kill("SIGTERM");
+    await stopChild(child);
     await killPort(port);
+    await delay(250);
   }
 }
 
@@ -133,5 +154,6 @@ try {
 } finally {
   await killPort(autoPort);
   await killPort(manualPort);
-  await fs.rm(runtimeDir, { recursive: true, force: true });
+  await delay(250);
+  await fs.rm(runtimeDir, { recursive: true, force: true, maxRetries: 5, retryDelay: 100 });
 }

package/src/interactive-cli.js

@@ -778,6 +778,71 @@ export function formatWorkspaceChange(change = {}) {
   };
 }
 
+function embeddedWorkspaceChangesFromText(value = "") {
+  const lines = String(value || "").split(/\r?\n/);
+  const changes = [];
+  let currentTool = "";
+
+  for (let index = 0; index < lines.length; index += 1) {
+    const toolMatch = lines[index].match(/^\s*Tool:\s*(.+?)\s*$/i);
+    if (toolMatch) {
+      currentTool = toolMatch[1].trim();
+      continue;
+    }
+
+    const pathMatch = lines[index].match(/^\s*Path:\s*(.+?)\s*$/i);
+    if (!pathMatch) continue;
+
+    let cursor = index + 1;
+    while (cursor < lines.length && !/^\s*Diff:\s*$/i.test(lines[cursor]) && !/^\s*(?:Tool|Path):\s*/i.test(lines[cursor])) {
+      cursor += 1;
+    }
+    if (!/^\s*Diff:\s*$/i.test(lines[cursor] || "")) continue;
+
+    const diffLines = [];
+    cursor += 1;
+    while (cursor < lines.length) {
+      if (diffLines.length && /^\s*(?:Tool|Path):\s*/i.test(lines[cursor])) break;
+      if (
+        diffLines.length &&
+        /^\s*(?:Output:|No command output|Blocked by guardrail\.|Mock run complete\.)/i.test(lines[cursor]) &&
+        !/^[-+@ ]/.test(lines[cursor])
+      ) {
+        break;
+      }
+      diffLines.push(lines[cursor]);
+      cursor += 1;
+    }
+    while (diffLines.length && !diffLines[diffLines.length - 1].trim()) diffLines.pop();
+    if (diffLines.length) {
+      changes.push({
+        toolName: currentTool || "write_file",
+        path: pathMatch[1].trim(),
+        diff: diffLines.join("\n"),
+      });
+      index = Math.max(index, cursor - 1);
+    }
+  }
+
+  return changes;
+}
+
+function embeddedWorkspaceSummary(value = "") {
+  const summary = [];
+  let skippingDiff = false;
+  for (const line of String(value || "").split(/\r?\n/)) {
+    if (/^\s*Diff:\s*$/i.test(line)) {
+      skippingDiff = true;
+      continue;
+    }
+    if (skippingDiff && /^\s*(?:Tool|Path):\s*/i.test(line)) skippingDiff = false;
+    if (skippingDiff) continue;
+    if (/^\s*Path:\s*/i.test(line)) continue;
+    summary.push(line);
+  }
+  return summary.join("\n").replace(/\n{3,}/g, "\n\n").trim();
+}
+
 function printWorkspaceChange(change = {}) {
   if (!change?.diff) return;
   const formatted = formatWorkspaceChange(change);
@@ -787,6 +852,15 @@ function printWorkspaceChange(change = {}) {
   for (const line of formatted.lines) outputLine(`${gutter}${line}`);
 }
 
+function printEmbeddedWorkspaceResult(result = "", { labelName = "finish", time = "" } = {}) {
+  const changes = embeddedWorkspaceChangesFromText(result);
+  if (changes.length === 0) return false;
+  const summary = embeddedWorkspaceSummary(result);
+  if (summary) printHistoryBlock(labelName, summary, { time, bg: ansi.systemBg });
+  for (const change of changes) printWorkspaceChange(change);
+  return true;
+}
+
 function printPreviewBlock(role, text, { time = "", bg = ansi.systemBg, maxLines = 5 } = {}) {
   const header = [label(role, bg).trimEnd(), time ? color(time, ansi.dim) : ""].filter(Boolean).join(" ");
   outputLine(header);
@@ -2201,6 +2275,24 @@ async function latestSession() {
 }
 
 function printHistoryEntry(entry) {
+  if (entry.role === "tool") {
+    const time = entry.at ? new Date(entry.at).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : "";
+    try {
+      const parsed = JSON.parse(entry.content || "{}");
+      if (parsed.toolName === "finish" && printEmbeddedWorkspaceResult(parsed.result || parsed.args?.result || "", { labelName: "finish", time })) {
+        return;
+      }
+      if (parsed.diff) {
+        printWorkspaceChange(parsed);
+        return;
+      }
+      outputLine(`${label(parsed.ok === false ? "fail" : "done", parsed.ok === false ? ansi.red : ansi.systemBg)} ${toolStatusDetails(parsed)}`);
+      return;
+    } catch {
+      printHistoryBlock("tool", entry.content, { time, bg: ansi.systemBg });
+      return;
+    }
+  }
   const role = entry.role === "assistant" ? "aginti>" : entry.role === "user" ? "user>" : String(entry.role || "note");
   const bg = role === "aginti>" ? ansi.agentBg : role === "user>" ? ansi.userBg : ansi.systemBg;
   const time = entry.at ? new Date(entry.at).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : "";
@@ -2275,6 +2367,13 @@ function printResumeEvent(event = {}) {
   }
   if (type === "tool.completed" || type === "tool.failed" || type === "tool.skipped") {
     const failed = type === "tool.failed" || data.ok === false || data.blocked || data.error;
+    if (data.diff) {
+      printWorkspaceChange(data);
+      return true;
+    }
+    if (data.toolName === "finish" && printEmbeddedWorkspaceResult(data.result || data.args?.result || "", { labelName: "finish" })) {
+      return true;
+    }
     if (data.toolName === "run_command") {
       printCommandOutputLog({
         command: data.args?.command || data.command || "",
@@ -2314,6 +2413,7 @@ function printResumeEvent(event = {}) {
     return true;
   }
   if (type === "session.finished") {
+    if (printEmbeddedWorkspaceResult(data.result || "", { labelName: "finish" })) return true;
     outputLine(`${label("state", ansi.systemBg)} status=finished${data.result ? ` result=${compactLine(data.result, 86)}` : ""}`);
     return true;
   }
@@ -4174,7 +4274,11 @@ async function runPrompt(prompt, state, packageDir, { approvalDepth = 0 } = {})
         } else if (type === "tool.started") {
           printStatusEvent(state, "tool", toolStatusDetails(data));
         } else if (type === "tool.completed" || type === "tool.failed") {
-          printStatusEvent(state, type === "tool.failed" || data.ok === false ? "tool_failed" : "tool_done", toolStatusDetails(data));
+          if (data.toolName === "finish" && printEmbeddedWorkspaceResult(data.result || data.args?.result || "", { labelName: "finish" })) {
+            // The finish tool can recap a workspace diff; render it like the original write/patch event.
+          } else {
+            printStatusEvent(state, type === "tool.failed" || data.ok === false ? "tool_failed" : "tool_done", toolStatusDetails(data));
+          }
         } else if (type === "file.changed") {
           printWorkspaceChange(data);
         } else if (type === "tool.blocked") {

package/web.js

@@ -129,6 +129,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "plan",
+      data,
       content: data.plan,
       markdown: true,
       at,
@@ -139,6 +140,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "tool",
+      data,
       content: toolTimelineSummary(data),
       at,
     };
@@ -151,6 +153,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: failed ? "tool failed" : "tool done",
+      data,
       content: `${toolTimelineSummary(data)}${stdout}${stderr}`,
       at,
     };
@@ -160,6 +163,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "permission",
+      data,
       content: data.permissionAdvice?.summary || data.reason || data.toolName || "Permission blocked.",
       at,
     };
@@ -169,6 +173,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: data.toolName === "apply_patch" ? "patch" : "write",
+      data,
       content: [data.toolName || data.action || "file.changed", data.path || "", data.created ? "created" : "updated"]
         .filter(Boolean)
         .join(" "),
@@ -180,6 +185,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "budget",
+      data,
       content: `${data.currentMaxSteps || data.initialMaxSteps || data.maxSteps || "unknown"} steps`,
       at,
     };
@@ -189,6 +195,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "continued",
+      data,
       content: data.prompt || "",
       at,
     };
@@ -198,6 +205,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: "queued input",
+      data,
       content: data.priority === "asap" ? "ASAP queued input applied" : "Queued input applied",
       at,
     };
@@ -207,6 +215,7 @@ function timelineEntryForEvent(event = {}) {
       role: "event",
       eventType: type,
       eventLabel: type.replace("session.", ""),
+      data,
       content: data.result || data.error || data.reason || type,
       at,
     };