Merge pull request #131 from pylon-code/upstream/2026-08-28-tool-failure-severity

fix(web): stop showing red x summaries for ordinary tool failures

Author: rynfar

apps/mobile/src/features/threads/thread-work-log.tsx

@@ -154,7 +154,11 @@ export function ThreadWorkLog(props: {
           const canExpand = row.canExpand;
           const fullDetail = expanded ? row.getFullDetail() : null;
           const displayText = row.detail ? `${row.summary} ${row.detail}` : row.summary;
-          const iconIsDestructive = row.icon === "alert" || row.icon === "warning";
+          // Warnings are not errors. Web reserves destructive red for
+          // runtime.error and orchestration *.failed rows and paints warnings
+          // amber; mobile matches that split rather than colouring both rose.
+          const iconIsDestructive = row.icon === "alert";
+          const iconIsWarning = row.icon === "warning";
 
           return (
             <Animated.View
@@ -189,7 +193,13 @@ export function ThreadWorkLog(props: {
                       name={workRowSymbolName(row.icon)}
                       size={13}
                       weight="medium"
-                      tintColor={iconIsDestructive ? "#e11d48" : props.iconSubtleColor}
+                      tintColor={
+                        iconIsDestructive
+                          ? "#e11d48"
+                          : iconIsWarning
+                            ? "#d97706"
+                            : props.iconSubtleColor
+                      }
                       type="monochrome"
                     />
                   </View>
@@ -199,6 +209,7 @@ export function ThreadWorkLog(props: {
                       className={cn(
                         "font-t3-medium text-foreground",
                         iconIsDestructive && "text-rose-600 dark:text-rose-400",
+                        iconIsWarning && "text-amber-600 dark:text-amber-400",
                       )}
                     >
                       {row.summary}
@@ -239,7 +250,7 @@ export function ThreadWorkLog(props: {
                                 : { ios: "minus", android: "remove" }
                           }
                           size={11}
-                          tintColor={row.status === "failure" ? "#e11d48" : props.iconSubtleColor}
+                          tintColor={props.iconSubtleColor}
                           type="monochrome"
                         />
                       ) : null}

apps/mobile/src/lib/threadActivity.test.ts

@@ -434,6 +434,38 @@ describe("buildThreadFeed", () => {
     ]);
   });
 
+  it("drops runtime warnings with no displayable content", () => {
+    const thread = makeThread({
+      id: ThreadId.make("thread-noise"),
+      projectId: ProjectId.make("project-1"),
+      title: "Warning noise thread",
+      activities: [
+        makeActivity({
+          id: EventId.make("activity-noise"),
+          kind: "runtime.warning",
+          summary: "Claude system message 'background_tasks_changed' (no displayable text content)",
+          createdAt: "2026-04-01T00:00:02.000Z",
+          turnId: TurnId.make("turn-1"),
+        }),
+        makeActivity({
+          id: EventId.make("activity-signal"),
+          kind: "runtime.warning",
+          summary: "Reconnecting... 2/5",
+          createdAt: "2026-04-01T00:00:03.000Z",
+          turnId: TurnId.make("turn-1"),
+        }),
+      ],
+    });
+
+    const feed = buildThreadFeed(thread);
+    expect(feed).toMatchObject([
+      {
+        type: "activity-group",
+        activities: [{ id: "activity-signal" }],
+      },
+    ]);
+  });
+
   it("collapses matching tool lifecycle rows like desktop", () => {
     const thread = makeThread({
       id: ThreadId.make("thread-2"),

apps/mobile/src/lib/threadActivity.ts

@@ -354,13 +354,25 @@ function deriveWorkLogEntries(
       continue;
     }
     if (activity.summary === "Checkpoint captured") continue;
+    if (isNoContentRuntimeWarning(activity)) continue;
     if (isPlanBoundaryToolActivity(activity)) continue;
     if (isAgentInternalActivity(activity)) continue;
     entries.push(toDerivedWorkLogEntry(activity));
   }
   return collapseDerivedWorkLogEntries(entries);
 }
 
+/** Adapters forward unknown wire-only SDK messages (background_tasks_changed,
+ *  commands_changed, ...) as runtime warnings. The suffix comes from
+ *  describeUnknownSdkMessage in the Claude adapter; a row with no displayable
+ *  text carries nothing a user can act on, so it does not render. */
+function isNoContentRuntimeWarning(activity: OrchestrationThreadActivity): boolean {
+  return (
+    activity.kind === "runtime.warning" &&
+    activity.summary.endsWith("(no displayable text content)")
+  );
+}
+
 function isPlanBoundaryToolActivity(activity: OrchestrationThreadActivity): boolean {
   if (activity.kind !== "tool.updated" && activity.kind !== "tool.completed") {
     return false;

apps/web/src/components/chat/MessagesTimeline.test.tsx

@@ -989,6 +989,53 @@ describe("MessagesTimeline", () => {
     expect(markup).not.toContain('aria-label="Tool call failed"');
   });
 
+  it("keeps the collapsed summary icon neutral when the group ends in a failure", () => {
+    const markup = renderToStaticMarkup(
+      <MessagesTimeline
+        {...buildProps()}
+        timelineEntries={[
+          {
+            id: "entry-completed",
+            kind: "work",
+            createdAt: "2026-03-17T19:12:28.000Z",
+            entry: {
+              id: "work-completed",
+              createdAt: "2026-03-17T19:12:28.000Z",
+              label: "Run tests",
+              tone: "tool",
+              itemType: "command_execution",
+              toolLifecycleStatus: "completed",
+            },
+          },
+          {
+            id: "entry-failed",
+            kind: "work",
+            createdAt: "2026-03-17T19:12:29.000Z",
+            entry: {
+              id: "work-failed",
+              createdAt: "2026-03-17T19:12:29.000Z",
+              label: "Run lint",
+              tone: "tool",
+              itemType: "command_execution",
+              toolLifecycleStatus: "failed",
+            },
+          },
+        ]}
+      />,
+    );
+
+    expect(markup).toContain("Ran 2 commands");
+    // Neutral: the group keeps its command glyph instead of swapping to a
+    // failure glyph, and neither the heading nor the icon wrapper goes red once
+    // the group ends in an ordinary command failure. Pylon renders the command
+    // summary as a DotMatrix, so assert its state rather than a lucide class.
+    expect(markup).toContain('data-state="terminal"');
+    expect(markup).not.toMatch(/font-medium text-destructive/);
+    expect(markup).not.toMatch(/size-6 shrink-0 items-center justify-center text-destructive/);
+    // The failure stays discoverable for screen readers.
+    expect(markup).toContain("tool call failed");
+  });
+
   it("keeps mixed work logs neutral after a later tool call succeeds", () => {
     const markup = renderToStaticMarkup(
       <MessagesTimeline
@@ -1402,11 +1449,22 @@ describe("MessagesTimeline", () => {
     expect(markup).not.toContain('data-testid="file-diff"');
   });
 
-  it("renders a failure marker for failed tool lifecycle entries", () => {
+  it("renders a muted failure marker for failed tool lifecycle entries", () => {
     const markup = renderToStaticMarkup(
       <MessagesTimeline
         {...buildProps()}
         timelineEntries={[
+          {
+            id: "entry-info",
+            kind: "work",
+            createdAt: "2026-03-17T19:12:27.000Z",
+            entry: {
+              id: "work-info",
+              createdAt: "2026-03-17T19:12:27.000Z",
+              label: "Status updated",
+              tone: "info",
+            },
+          },
           {
             id: "entry-1",
             kind: "work",
@@ -1426,5 +1484,48 @@ describe("MessagesTimeline", () => {
 
     expect(markup).toContain('data-state="error"');
     expect(markup).toContain('aria-label="Tool call failed"');
+    // Ordinary tool failures render muted, not red. Pylon's marker is a small
+    // DotMatrix status dot that is itself destructive-coloured, so assert on the
+    // row treatment rather than on the absence of the class anywhere in the tree.
+    expect(markup).not.toMatch(/font-medium text-destructive/);
+    expect(markup).not.toMatch(/size-6 shrink-0 items-center justify-center text-destructive/);
+  });
+
+  it("keeps the red treatment for severe orchestration failures", () => {
+    const markup = renderToStaticMarkup(
+      <MessagesTimeline
+        {...buildProps()}
+        timelineEntries={[
+          {
+            id: "entry-info",
+            kind: "work",
+            createdAt: "2026-03-17T19:12:27.000Z",
+            entry: {
+              id: "work-info",
+              createdAt: "2026-03-17T19:12:27.000Z",
+              label: "Status updated",
+              tone: "info",
+            },
+          },
+          {
+            id: "entry-turn-failed",
+            kind: "work",
+            createdAt: "2026-03-17T19:12:28.000Z",
+            entry: {
+              id: "work-turn-failed",
+              createdAt: "2026-03-17T19:12:28.000Z",
+              label: "Provider turn start failed",
+              tone: "error",
+              sourceActivityKind: "provider.turn.start.failed",
+            },
+          },
+        ]}
+      />,
+    );
+
+    // Pylon renders severe failures with circle-alert where upstream uses an x.
+    expect(markup).toContain("lucide-circle-alert");
+    expect(markup).toMatch(/font-medium text-destructive/);
+    expect(markup).toMatch(/size-6 shrink-0 items-center justify-center text-destructive/);
   });
 });

apps/web/src/components/chat/MessagesTimeline.tsx

@@ -38,6 +38,7 @@ import {
   workEntryIndicatesToolSuccess,
   workLogEntryIsMissingResponse,
   workEntryDisplayIndicatesToolFailure,
+  workEntrySignalsSevereFailure,
   workLogEntryIsToolLike,
 } from "../../session-logic";
 import { type TurnDiffSummary } from "../../types";
@@ -1647,33 +1648,25 @@ function WorkGroupToggleTimelineRow({
     : row.hiddenCount === 1
       ? "log entry"
       : "log entries";
-  const showHiddenFailure = row.hasFailure && !row.expanded;
-
   return (
     <button
       type="button"
       className="flex min-h-6 w-full cursor-pointer items-center gap-1.5 rounded-md px-0.5 py-0.5 text-left text-sm leading-relaxed transition-colors duration-150 hover:bg-accent/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/70"
+      aria-label={
+        row.hasFailure && !row.expanded
+          ? `+${row.hiddenCount} previous ${labelNoun}, includes a failure`
+          : undefined
+      }
       aria-expanded={row.expanded}
       onClick={() => ctx.onToggleWorkGroup(row.groupId, row.id)}
     >
-      <span
-        className={cn(
-          "flex size-6 shrink-0 items-center justify-center",
-          showHiddenFailure ? "text-destructive" : "text-icon-muted",
-        )}
-        role={showHiddenFailure ? "img" : undefined}
-        aria-label={showHiddenFailure ? "Hidden work includes a failure" : undefined}
-      >
-        {showHiddenFailure ? (
-          <WorkEntryIconSvg name="x" className="shrink-0 stroke-[1.8] opacity-70" />
-        ) : (
-          <ChevronDownIcon
-            className={cn(
-              "size-4 shrink-0 opacity-70 transition-transform duration-200",
-              row.expanded && "rotate-180",
-            )}
-          />
-        )}
+      <span className="flex size-6 shrink-0 items-center justify-center text-icon-muted">
+        <ChevronDownIcon
+          className={cn(
+            "size-4 shrink-0 opacity-70 transition-transform duration-200",
+            row.expanded && "rotate-180",
+          )}
+        />
       </span>
       {row.expanded ? (
         <span className="font-medium text-foreground">
@@ -2220,7 +2213,6 @@ type WorkEntryIconName =
   | "square-pen"
   | "terminal"
   | "wrench"
-  | "x"
   | "zap";
 
 function WorkEntryIconSvg({ name, className }: { name: WorkEntryIconName; className: string }) {
@@ -2258,8 +2250,6 @@ function WorkEntryIconSvg({ name, className }: { name: WorkEntryIconName; classN
       );
     case "wrench":
       return <WrenchIcon className={fixedIconClassName} aria-hidden />;
-    case "x":
-      return <DotMatrix sizeRole="inline" aria-hidden state="error" className={className} />;
     case "zap":
       return <ZapIcon className={fixedIconClassName} aria-hidden />;
   }
@@ -2730,14 +2720,18 @@ const PlainWorkEntryRow = memo(function PlainWorkEntryRow(props: {
     (turnSettled && workEntryIndicatesToolNeutralStatus(workEntry));
   const showDestructiveRowStyle =
     showFailedIndicator &&
-    (workEntry.sourceActivityKind === "runtime.error" || !workLogEntryIsToolLike(workEntry));
+    (workEntrySignalsSevereFailure(workEntry) || !workLogEntryIsToolLike(workEntry));
+  // Ordinary tool failures stay muted; only runtime errors and warnings get
+  // color. The red treatment is reserved for severe failures.
   const iconWrapperClass = cn(
     "flex size-6 shrink-0 items-center justify-center",
-    showWarningIndicator || showDestructiveRowStyle
-      ? "text-destructive"
-      : workLogEntryIsToolLike(workEntry)
-        ? "text-icon-muted"
-        : iconConfig.className,
+    showWarningIndicator
+      ? "text-warning"
+      : showDestructiveRowStyle
+        ? "text-destructive"
+        : workLogEntryIsToolLike(workEntry)
+          ? "text-icon-muted"
+          : iconConfig.className,
   );
   const headingClass = showWarningIndicator
     ? "font-medium text-warning"