@stigmer/react 3.12.1 → 3.12.3

package/src/execution/__tests__/MessageEntry-copy.test.tsx

@@ -0,0 +1,125 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { render, screen, cleanup, fireEvent, waitFor } from "@testing-library/react";
+import { create } from "@bufbuild/protobuf";
+import { AgentMessageSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/message_pb";
+import { MessageType } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+
+import { MessageEntry } from "../MessageEntry";
+
+// ---------------------------------------------------------------------------
+// Per-message copy affordance (stigmer/stigmer#278): every settled human and
+// AI message carries a quiet copy control that writes the message's text to
+// the clipboard, with transient "Copied" feedback. The affordance is
+// hover-revealed but always in the DOM (keyboard/screen-reader reachable).
+// ---------------------------------------------------------------------------
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+});
+
+function message(type: MessageType, content: string, isStreaming = false) {
+  return create(AgentMessageSchema, { type, content, isStreaming });
+}
+
+function stubClipboard() {
+  const writeText = vi.fn(() => Promise.resolve());
+  vi.stubGlobal("navigator", { clipboard: { writeText } });
+  return writeText;
+}
+
+describe("MessageEntry copy affordance", () => {
+  it("copies a human message's text on click and flips to Copied feedback", async () => {
+    const writeText = stubClipboard();
+    render(
+      <MessageEntry
+        message={message(MessageType.MESSAGE_HUMAN, "run the deploy again")}
+      />,
+    );
+
+    fireEvent.click(screen.getByLabelText("Copy message"));
+    expect(writeText).toHaveBeenCalledExactlyOnceWith("run the deploy again");
+
+    // The affordance answers with its transient feedback state.
+    await waitFor(() => {
+      expect(screen.getByLabelText("Copied")).toBeTruthy();
+    });
+  });
+
+  it("copies an AI message's markdown — formatting characters included", () => {
+    const writeText = stubClipboard();
+    const md = "## Plan\n\n- step **one**\n- step `two`";
+    render(<MessageEntry message={message(MessageType.MESSAGE_AI, md)} />);
+
+    fireEvent.click(screen.getByLabelText("Copy message"));
+    expect(writeText).toHaveBeenCalledExactlyOnceWith(md);
+  });
+
+  it("copies the fence-unwrapped markdown the reader actually sees", () => {
+    // A model that wraps its whole reply in a ```markdown fence renders
+    // unwrapped (MessageEntry's render seam); the copy must match the render,
+    // not re-wrap what the user is looking at.
+    const writeText = stubClipboard();
+    render(
+      <MessageEntry
+        message={message(MessageType.MESSAGE_AI, "```markdown\n# Title\nbody\n```")}
+      />,
+    );
+
+    fireEvent.click(screen.getByLabelText("Copy message"));
+    expect(writeText).toHaveBeenCalledExactlyOnceWith("# Title\nbody");
+  });
+
+  it("offers no copy while an AI message is still streaming", () => {
+    stubClipboard();
+    render(
+      <MessageEntry
+        message={message(MessageType.MESSAGE_AI, "partial answer…", true)}
+      />,
+    );
+    expect(screen.queryByLabelText("Copy message")).toBeNull();
+  });
+
+  it("offers no copy on system messages", () => {
+    stubClipboard();
+    render(
+      <MessageEntry
+        message={message(MessageType.MESSAGE_SYSTEM, "execution resumed")}
+      />,
+    );
+    expect(screen.queryByLabelText("Copy message")).toBeNull();
+  });
+
+  it("keeps copy and edit as siblings on a human bubble when editing is wired", () => {
+    stubClipboard();
+    const onEdit = vi.fn();
+    render(
+      <MessageEntry
+        message={message(MessageType.MESSAGE_HUMAN, "tweak this")}
+        onEdit={onEdit}
+      />,
+    );
+
+    // Both affordances present and independently operable.
+    expect(screen.getByLabelText("Copy message")).toBeTruthy();
+    fireEvent.click(screen.getByLabelText("Edit message"));
+    expect(onEdit).toHaveBeenCalledTimes(1);
+  });
+
+  it("claims no copy when the clipboard write is rejected", async () => {
+    // Insecure context / denied permission: the button must not flash
+    // "Copied" for a copy that never happened.
+    const writeText = vi.fn(() => Promise.reject(new Error("denied")));
+    vi.stubGlobal("navigator", { clipboard: { writeText } });
+    render(
+      <MessageEntry message={message(MessageType.MESSAGE_HUMAN, "hello")} />,
+    );
+
+    fireEvent.click(screen.getByLabelText("Copy message"));
+    await waitFor(() => {
+      expect(writeText).toHaveBeenCalledTimes(1);
+    });
+    expect(screen.queryByLabelText("Copied")).toBeNull();
+    expect(screen.getByLabelText("Copy message")).toBeTruthy();
+  });
+});

package/src/execution/__tests__/MessageThread.test.tsx

@@ -957,3 +957,100 @@ describe("MessageThread", () => {
     });
   });
 });
+
+// ---------------------------------------------------------------------------
+// Ambient liveness status line (stigmer#277)
+// ---------------------------------------------------------------------------
+
+describe("MessageThread liveness status line", () => {
+  const LINE = '[data-cursor-target="liveness-status-line"]';
+
+  it("anchors the thread's tail while the execution is live between visible events", () => {
+    // IN_PROGRESS, has responded (AI content), no running tool, no gate —
+    // the model-generation gap where the screen would otherwise be still.
+    const active = makeExecution({
+      id: "exec-live",
+      phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+      aiContent: "Let me look around.",
+    });
+    const { container } = render(
+      <MessageThread executions={[]} activeStreamExecution={active} />,
+    );
+    expect(container.querySelector(LINE)).not.toBeNull();
+  });
+
+  it("yields to a running tool call — that row carries the live signal", () => {
+    const active = makeExecution({
+      id: "exec-tool",
+      phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+      aiContent: "Running a command.",
+    });
+    const runningTool = create(ToolCallSchema, {
+      id: "tc-run",
+      name: "Shell",
+      args: { command: "sleep 5" },
+      status: ToolCallStatus.TOOL_CALL_RUNNING,
+    });
+    active.status!.messages[1].toolCalls = [runningTool];
+
+    const { container } = render(
+      <MessageThread executions={[]} activeStreamExecution={active} />,
+    );
+    expect(container.querySelector(LINE)).toBeNull();
+  });
+
+  it("yields to a pending approval — shimmering 'Working…' at a gate would lie", () => {
+    const active = makeExecutionWithApproval("exec-gated", "tc-1", "write_file");
+    const { container } = render(
+      <MessageThread
+        executions={[]}
+        activeStreamExecution={active}
+        onApprovalSubmit={() => {}}
+      />,
+    );
+    expect(container.querySelector(LINE)).toBeNull();
+  });
+
+  it("disappears the moment the execution settles — phase-driven, never stream-inferred", () => {
+    const done = makeExecution({
+      id: "exec-done",
+      phase: ExecutionPhase.EXECUTION_COMPLETED,
+      aiContent: "All set.",
+    });
+    const { container } = render(
+      <MessageThread executions={[done]} activeStreamExecution={null} />,
+    );
+    expect(container.querySelector(LINE)).toBeNull();
+  });
+
+  it("leaves the pre-first-content window to the setup placeholder", () => {
+    const active = makeExecution({
+      id: "exec-fresh",
+      phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+    });
+    // No AI content, no tool calls: hasStartedResponding is false.
+    active.status!.messages = [active.status!.messages[0]];
+
+    const { container } = render(
+      <MessageThread executions={[]} activeStreamExecution={active} />,
+    );
+    expect(container.querySelector(LINE)).toBeNull();
+    // The synthetic "Thinking…" setup placeholder owns this window.
+    expect(screen.getByText("Thinking\u2026")).toBeTruthy();
+  });
+
+  it("carries the shared shimmer treatment on its label", () => {
+    const active = makeExecution({
+      id: "exec-live",
+      phase: ExecutionPhase.EXECUTION_IN_PROGRESS,
+      aiContent: "Let me look around.",
+    });
+    const { container } = render(
+      <MessageThread executions={[]} activeStreamExecution={active} />,
+    );
+    const line = container.querySelector(LINE)!;
+    expect(line.querySelector(".stgm-shimmer-label")?.textContent).toBe(
+      "Working\u2026",
+    );
+  });
+});

package/src/execution/__tests__/TerminalSession.test.tsx

@@ -1,6 +1,6 @@
 import { describe, it, expect, afterEach } from "vitest";
 import { render, screen, cleanup } from "@testing-library/react";
-import { TerminalSession } from "../TerminalSession";
+import { TerminalSession, TerminalTail } from "../TerminalSession";
 import { SandboxContext } from "../SandboxContext";
 
 afterEach(cleanup);
@@ -70,3 +70,73 @@ describe("TerminalSession", () => {
     expect(container.textContent).toContain("src/a.ts");
   });
 });
+
+describe("TerminalTail", () => {
+  it("keeps the command at full contrast and dims the output tail", () => {
+    const { container } = render(
+      <TerminalTail command="echo hi" stdout="hi" exitCode={0} />,
+    );
+    const tail = container.querySelector('[data-cursor-target="terminal-tail"]')!;
+    expect(tail.textContent).toContain("$ echo hi");
+    // Intent keeps reading contrast; the tail is one step below it.
+    expect(screen.getByText(/echo hi/).className).toContain("stg:text-foreground");
+    expect(screen.getByText("hi").className).toContain("stg:text-muted-foreground");
+  });
+
+  it("shows only the last lines, with an honest hidden-line count", () => {
+    const stdout = ["one", "two", "three", "four", "five"].join("\n");
+    const { container } = render(<TerminalTail command="seq 5" stdout={stdout} />);
+    const tail = container.querySelector('[data-cursor-target="terminal-tail"]')!;
+    expect(tail.textContent).toContain("three");
+    expect(tail.textContent).toContain("five");
+    expect(tail.textContent).not.toContain("one");
+    expect(tail.textContent).toContain("… +2 lines");
+  });
+
+  it("omits the hidden-count marker when everything fits", () => {
+    const { container } = render(
+      <TerminalTail command="pwd" stdout="/work\nok" />,
+    );
+    expect(container.textContent).not.toContain("+");
+    expect(container.textContent).toContain("/work");
+    expect(container.textContent).toContain("ok");
+  });
+
+  it("appends stderr after stdout in the combined tail", () => {
+    const { container } = render(
+      <TerminalTail command="build" stdout="step 1\nstep 2" stderr="warning: slow" />,
+    );
+    const tail = container.querySelector('[data-cursor-target="terminal-tail"]')!;
+    // Last three of the combined stream: step 1, step 2, warning.
+    expect(tail.textContent).toContain("step 2");
+    expect(tail.textContent).toContain("warning: slow");
+  });
+
+  it("keeps the exit badge when a failed session is shown collapsed", () => {
+    render(<TerminalTail command="false" stdout="boom" exitCode={2} />);
+    expect(screen.getByText("exit 2")).toBeTruthy();
+    expect(screen.getByText("Command exited with code 2")).toBeTruthy();
+  });
+
+  it("ignores a trailing newline when slicing the tail", () => {
+    const { container } = render(
+      <TerminalTail command="x" stdout={"a\nb\nc\nd\n"} />,
+    );
+    const tail = container.querySelector('[data-cursor-target="terminal-tail"]')!;
+    expect(tail.textContent).toContain("d");
+    expect(tail.textContent).toContain("… +1 line");
+  });
+
+  it("normalizes absolute sandbox paths like the full session", () => {
+    const { container } = render(
+      <SandboxContext.Provider value={{ sandboxWorkspaceRoot: "/home/daytona/workspace" }}>
+        <TerminalTail
+          command="ls /home/daytona/workspace/src"
+          stdout="/home/daytona/workspace/src/a.ts"
+        />
+      </SandboxContext.Provider>,
+    );
+    expect(container.textContent).not.toContain("/home/daytona/workspace/");
+    expect(container.textContent).toContain("$ ls src");
+  });
+});

package/src/execution/__tests__/ToolCallDetail.test.tsx

@@ -28,7 +28,9 @@ vi.mock("../useFileChangeContent", () => ({
   useFileChangeContent: () => mockContent,
 }));
 
-const { ToolCallDetail } = await import("../ToolCallDetail");
+const { ToolCallDetail, formatDuration, formatHeaderDuration } = await import(
+  "../ToolCallDetail"
+);
 const { FileReviewContext } = await import("../FileReviewContext");
 
 beforeEach(() => {
@@ -379,3 +381,33 @@ describe("ToolCallDetail — write body", () => {
     expect(container.querySelector(CLAMP)).not.toBeNull();
   });
 });
+
+// ---------------------------------------------------------------------------
+// Duration formatting — the exact helper vs the >= 1s header-chip variant
+// ---------------------------------------------------------------------------
+
+describe("formatHeaderDuration", () => {
+  const T0 = "2026-08-13T10:00:00.000Z";
+  const at = (ms: number) => new Date(Date.parse(T0) + ms).toISOString();
+
+  it("suppresses sub-second durations that formatDuration would render", () => {
+    // The exact helper keeps its public contract...
+    expect(formatDuration(T0, at(400))).toBe("400ms");
+    // ...while the header-chip variant treats the same span as noise.
+    expect(formatHeaderDuration(T0, at(400))).toBeNull();
+  });
+
+  it("passes through everything from one second up, exactly as formatDuration renders it", () => {
+    const cases = [1000, 2500, 61_000, 180_000];
+    for (const ms of cases) {
+      expect(formatHeaderDuration(T0, at(ms))).toBe(formatDuration(T0, at(ms)));
+      expect(formatHeaderDuration(T0, at(ms))).not.toBeNull();
+    }
+  });
+
+  it("stays null for missing or invalid timestamps, like the exact helper", () => {
+    expect(formatHeaderDuration("", at(400))).toBeNull();
+    expect(formatHeaderDuration(T0, "")).toBeNull();
+    expect(formatHeaderDuration("not-a-date", at(2000))).toBeNull();
+  });
+});