@lazyingart/agintiflow 0.17.3 → 0.17.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lazyingart/agintiflow",
-  "version": "0.17.3",
+  "version": "0.17.5",
   "type": "module",
   "description": "AgInTiFlow is a resumable Playwright website-control agent with OpenAI-compatible tool calling.",
   "license": "Apache-2.0",

package/public/app.js

@@ -901,7 +901,7 @@ function renderWorkspacePanel(workspace = lastWorkspace, activity = lastWorkspac
       const label = blocked ? t("blockedLabel") : t("changedLabel");
       const path = escapeHtml(item.path || "");
       const reason = blocked ? `<div class="subtle">${escapeHtml(item.reason || "")}</div>` : "";
-      const diff = item.diff ? `<pre class="change-diff">${escapeHtml(item.diff).slice(0, 1200)}</pre>` : "";
+      const diff = item.diff ? `<pre class="change-diff">${renderDiffHtml(item.diff, 1200)}</pre>` : "";
       const hashes =
         item.beforeHash || item.afterHash
           ? `<div class="change-meta"><span>before=${escapeHtml((item.beforeHash || "new").slice(0, 10))}</span><span>after=${escapeHtml((item.afterHash || "").slice(0, 10))}</span></div>`
@@ -1123,6 +1123,22 @@ function escapeHtml(value) {
   );
 }
 
+function renderDiffHtml(value, maxChars = 1200) {
+  return String(value || "")
+    .slice(0, maxChars)
+    .split(/\r?\n/)
+    .map((line) => {
+      const escaped = escapeHtml(line);
+      if (/^\+(?!\+\+)/.test(line)) return `<span class="diff-add">${escaped}</span>`;
+      if (/^-(?!--)/.test(line)) return `<span class="diff-del">${escaped}</span>`;
+      if (/^\+\+\+/.test(line)) return `<span class="diff-file-add">${escaped}</span>`;
+      if (/^---/.test(line)) return `<span class="diff-file-del">${escaped}</span>`;
+      if (/^@@/.test(line)) return `<span class="diff-hunk">${escaped}</span>`;
+      return escaped;
+    })
+    .join("\n");
+}
+
 function safeLinkHref(value) {
   const raw = String(value || "").trim();
   try {

package/public/styles.css

@@ -481,6 +481,20 @@ button.danger {
   overflow-wrap: anywhere;
 }
 
+.change-diff .diff-add,
+.change-diff .diff-file-add {
+  color: #86efac;
+}
+
+.change-diff .diff-del,
+.change-diff .diff-file-del {
+  color: #fca5a5;
+}
+
+.change-diff .diff-hunk {
+  color: #67e8f9;
+}
+
 .sandbox-card h2 {
   margin: 0 0 4px;
   font-size: 1.05rem;

package/scripts/smoke-cli-chat.js

@@ -4,7 +4,7 @@ import fs from "node:fs/promises";
 import os from "node:os";
 import path from "node:path";
 import { fileURLToPath } from "node:url";
-import { buildPromptLayout, classifyEscapeAction, stripMarkdown } from "../src/interactive-cli.js";
+import { buildPromptLayout, classifyEscapeAction, formatWorkspaceChange, stripMarkdown } from "../src/interactive-cli.js";
 
 const repoRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
 const tempRoot = await fs.mkdtemp(path.join(os.tmpdir(), "agintiflow-cli-chat-"));
@@ -85,6 +85,21 @@ try {
   if (!renderedDiff.includes("-old") || !renderedDiff.includes("+new")) {
     throw new Error("terminal markdown renderer dropped patch diff lines");
   }
+  const renderedPatchEvent = formatWorkspaceChange({
+    toolName: "apply_patch",
+    path: "test_cli.py",
+    beforeHash: "aaaaaaaa11111111",
+    afterHash: "bbbbbbbb22222222",
+    diff: ["--- a/test_cli.py", "+++ b/test_cli.py", "@@ line 10 @@", "-old line", "+new line"].join("\n"),
+  });
+  if (
+    renderedPatchEvent.label !== "patch" ||
+    !renderedPatchEvent.summary.includes("test_cli.py") ||
+    !renderedPatchEvent.lines.join("\n").includes("-old line") ||
+    !renderedPatchEvent.lines.join("\n").includes("+new line")
+  ) {
+    throw new Error("workspace patch event formatter did not preserve red/green diff content");
+  }
 
   const promptLayout = buildPromptLayout(`${"x".repeat(180)}\nsecond line`, 95, 80, 24);
   const promptText = promptLayout.renderedRows
@@ -185,7 +200,27 @@ try {
       {
         ok: true,
         projectRoot: tempRoot,
-        checks: ["markdown-render", "markdown-table-no-duplicate", "patch-diff-render", "prompt-layout", "user-prompt-label", "escape-policy", "live-input-status-layout", "agent-response-gutter", "aginti-md", "instructions-command", "skills-command", "slash-prefix-autoselect", "instructions-chat-edit", "interactive-chat", "mock-file-write", "run-status", "resume-latest", "resume-history-full"],
+        checks: [
+          "markdown-render",
+          "markdown-table-no-duplicate",
+          "patch-diff-render",
+          "workspace-patch-event-render",
+          "prompt-layout",
+          "user-prompt-label",
+          "escape-policy",
+          "live-input-status-layout",
+          "agent-response-gutter",
+          "aginti-md",
+          "instructions-command",
+          "skills-command",
+          "slash-prefix-autoselect",
+          "instructions-chat-edit",
+          "interactive-chat",
+          "mock-file-write",
+          "run-status",
+          "resume-latest",
+          "resume-history-full",
+        ],
       },
       null,
       2

package/src/auth-onboarding.js

@@ -107,7 +107,7 @@ function boxedLine(content, width) {
 function secretInputDisplay({ value, selectedPreview, placeholder }) {
   if (value) return color(`${"•".repeat(Math.min(value.length, 24))} (${value.length} chars)`, ansi.inputBg);
   if (selectedPreview) return `${color(` ${selectedPreview} `, ansi.selected, ansi.bold)} ${color("selected", ansi.yellow)}`;
-  return color(placeholder || "paste key here", ansi.dim);
+  return color(String(placeholder || "").padEnd(30, " "), ansi.inputBg);
 }
 
 function renderSecretBox({ title, helpText, statusText, currentPreview, value, selected, actionText }) {
@@ -119,7 +119,7 @@ function renderSecretBox({ title, helpText, statusText, currentPreview, value, s
     boxedLine(color(compactLine(title, inner), ansi.bold, ansi.cyan), width),
     helpText ? boxedLine(`${color("key", ansi.muted)}   ${compactLine(helpText, inner - 6)}`, width) : "",
     statusText ? boxedLine(`${color("status", ansi.muted)} ${compactLine(statusText, inner - 8)}`, width) : "",
-    boxedLine(`${color("input", ansi.muted)}  ${secretInputDisplay({ value, selectedPreview, placeholder: "hidden input" })}`, width),
+    boxedLine(`${color("input", ansi.muted)}  ${secretInputDisplay({ value, selectedPreview })}`, width),
     boxedLine(color(compactLine(actionText, inner), ansi.dim), width),
     `${color("╰", ansi.border)}${color("─", ansi.border).repeat(width - 2)}${color("╯", ansi.border)}`,
   ].filter(Boolean);

package/src/interactive-cli.js

@@ -356,6 +356,36 @@ function printAgentMessage(text) {
   for (const line of lines) outputLine(`${responsePrefix()}${line}`);
 }
 
+export function formatWorkspaceChange(change = {}) {
+  const toolName = String(change.toolName || change.action || "change");
+  const path = String(change.path || "");
+  const summary = [
+    toolName,
+    path,
+    change.created ? "created" : "",
+    change.beforeHash ? `before=${String(change.beforeHash).slice(0, 8)}` : "before=new",
+    change.afterHash ? `after=${String(change.afterHash).slice(0, 8)}` : "",
+  ]
+    .filter(Boolean)
+    .join(" ");
+  const diff = String(change.diff || "").trim();
+  const renderedDiff = diff ? stripMarkdown(`Diff:\n${diff}`).split("\n") : [];
+  return {
+    label: toolName === "apply_patch" || toolName.startsWith("apply_patch") ? "patch" : "write",
+    summary,
+    lines: renderedDiff,
+  };
+}
+
+function printWorkspaceChange(change = {}) {
+  if (!change?.diff) return;
+  const formatted = formatWorkspaceChange(change);
+  const bg = formatted.label === "patch" ? ansi.magenta : ansi.systemBg;
+  outputLine(`${label(formatted.label, bg)} ${compactLine(formatted.summary, 92)}`);
+  const gutter = `${color(" | ", bg)} `;
+  for (const line of formatted.lines) outputLine(`${gutter}${line}`);
+}
+
 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);
@@ -1795,6 +1825,8 @@ async function runPrompt(prompt, state, packageDir) {
           printStatusEvent(state, "tool", data.toolName || "unknown");
         } else if (type === "tool.completed") {
           printStatusEvent(state, "tool_done", data.toolName || "unknown");
+        } else if (type === "file.changed") {
+          printWorkspaceChange(data);
         } else if (type === "tool.blocked") {
           printStatusEvent(state, "tool_blocked", data.toolName || data.reason || "unknown");
         } else if (type === "loop.guard") {