@skyhook-io/radar-app 1.13.4 → 1.14.0

package/src/components/diagnose/parts.tsx

@@ -37,6 +37,8 @@ import {
   type AgentInfo,
   type ApplyMutationOutcome,
   type ExecutionProfile,
+  type DiagnoseStreamEvent,
+  type MCPServerStatus,
 } from "../../api/diagnose";
 import { Collapse, CollapseChevron } from "@skyhook-io/k8s-ui";
 import { Markdown } from "../ui/Markdown";
@@ -52,6 +54,11 @@ import {
   type InvestigationRootCauseEvidenceResolution,
   type InvestigationEvidenceSource,
 } from "./investigationEvidence";
+import type {
+  InvestigationCaseItem,
+  InvestigationCaseResolution,
+} from "./investigationCase";
+import { AgentClaimNote } from "./AgentCase";
 
 import { useDisclosureReveal } from "./useDisclosureReveal";
 
@@ -448,8 +455,69 @@ export type Turn = {
   // Set from the replay/live boundary when the terminal event arrives. Historical
   // conclusions render immediately; conclusions observed live enter smoothly.
   animateResult?: boolean;
+  // The latest startup phase the server reported before the agent's first
+  // message. It drives the pending status line only; it is never a transcript item.
+  startup?: StartupSignal;
 };
 
+export type StartupSignal = {
+  phase: "investigating" | "connected" | "ready";
+  model?: string;
+  toolCount?: number;
+  mcpServers?: MCPServerStatus[];
+};
+
+const STARTUP_PHASE_RANK: Record<StartupSignal["phase"], number> = {
+  investigating: 0,
+  connected: 1,
+  ready: 2,
+};
+
+// Folds a phase event into the turn's startup signal. The handshake and the
+// CLI's init line are reported by different goroutines, so a later event can
+// name an earlier phase; the furthest phase wins and the init facts are kept.
+export function mergeStartupSignal(
+  prev: StartupSignal | undefined,
+  event: Pick<
+    DiagnoseStreamEvent,
+    "phase" | "model" | "toolCount" | "mcpServers"
+  >,
+): StartupSignal | undefined {
+  const phase = event.phase;
+  if (phase !== "investigating" && phase !== "connected" && phase !== "ready")
+    return prev;
+  const facts =
+    phase === "ready"
+      ? {
+          model: event.model,
+          toolCount: event.toolCount,
+          mcpServers: event.mcpServers,
+        }
+      : {};
+  if (prev && STARTUP_PHASE_RANK[prev.phase] >= STARTUP_PHASE_RANK[phase]) {
+    return phase === "ready" ? { ...prev, ...facts } : prev;
+  }
+  return { ...prev, ...facts, phase };
+}
+
+function startupLabel(startup: StartupSignal, agentLabel: string): string {
+  switch (startup.phase) {
+    case "investigating":
+      return `${agentLabel} starting…`;
+    case "connected":
+      return "Connected to Radar's tools";
+    case "ready": {
+      const parts = [`${agentLabel} ready`];
+      if (startup.model) parts.push(startup.model);
+      if (startup.toolCount !== undefined)
+        parts.push(
+          `${startup.toolCount} Radar ${startup.toolCount === 1 ? "tool" : "tools"}`,
+        );
+      return parts.join(" · ");
+    }
+  }
+}
+
 // TimelineItem is one ordered transcript entry: agent reasoning, or a tool call.
 export type TimelineItem =
   | { kind: "thinking"; text: string; animate?: boolean }
@@ -542,6 +610,7 @@ export function upsertTool(
 
 export function TurnView({
   turn,
+  agentLabel,
   onApply,
   onViewExplanation,
   onCheckStatus,
@@ -551,12 +620,16 @@ export function TurnView({
   evidenceStepIds,
   onViewEvidence,
   sourceRevealRequest,
+  assessmentSources,
 }: {
   turn: Turn;
+  agentLabel?: string;
   onApply?: (fix: string) => void;
   onViewExplanation?: () => void;
   onCheckStatus?: () => void;
   onRetryDiagnosis?: () => void;
+  /** Sources and agent items an answer turn cited; answers otherwise show none. */
+  assessmentSources?: ReactNode;
   // In the maximized workspace the pinned turn's conclusion renders in the side rail,
   // so the transcript suppresses its own copy (reasoning + tool calls still show).
   hideConclusion?: boolean;
@@ -637,6 +710,8 @@ export function TurnView({
         running={turn.status === "running"}
         applyMode={turn.apply}
         followup={followup}
+        startup={turn.startup}
+        agentLabel={agentLabel}
         turnIndex={turnIndex}
         evidenceStepIds={evidenceStepIds}
         onViewEvidence={onViewEvidence}
@@ -658,6 +733,7 @@ export function TurnView({
             followup={followup}
             onCheckStatus={onCheckStatus}
             animate={turn.animateResult !== false}
+            assessmentSources={assessmentSources}
           />
         ) : (
           <EmptyResult animate={turn.animateResult !== false} />
@@ -1069,6 +1145,8 @@ export function Timeline({
   running,
   applyMode,
   followup,
+  startup,
+  agentLabel = "Agent",
   turnIndex,
   evidenceStepIds,
   onViewEvidence,
@@ -1078,6 +1156,8 @@ export function Timeline({
   running: boolean;
   applyMode?: boolean;
   followup?: boolean;
+  startup?: StartupSignal;
+  agentLabel?: string;
   turnIndex?: number;
   evidenceStepIds?: ReadonlySet<string>;
   onViewEvidence?: (sourceId: string) => void;
@@ -1093,7 +1173,8 @@ export function Timeline({
       ? "Working"
       : "Investigation";
   // The live status verb tracks the running tool ("Reading logs…") so the wait is
-  // informative, not a generic spinner; falls back to a phase-appropriate label.
+  // informative, not a generic spinner; before the first item it reports the
+  // startup phases the server actually observed, never a timer-based guess.
   const activeTool = [...items]
     .reverse()
     .find((it) => it.kind === "tool" && it.status !== "done") as
@@ -1104,9 +1185,18 @@ export function Timeline({
       ? toolActivity(activeTool.tool)
       : items.length > 0
         ? "Working…"
-        : followup
-          ? "Thinking…"
-          : "Starting investigation…";
+        : startup
+          ? startupLabel(startup, agentLabel)
+          : followup
+            ? "Thinking…"
+            : "Starting investigation…";
+  const failedServers = (startup?.mcpServers ?? []).filter(
+    (server) => server.status !== "connected",
+  );
+  const radarServer = failedServers.find((server) => server.name === "radar");
+  const allDefiniteFailures = failedServers.every((server) =>
+    mcpStatusIsFailure(server.status),
+  );
   return (
     <div className="space-y-1.5">
       {items.length > 0 && (
@@ -1114,6 +1204,33 @@ export function Timeline({
           {heading}
         </div>
       )}
+      {failedServers.length > 0 && (
+        <div
+          role="status"
+          className="flex items-start gap-1.5 rounded border border-semantic-warning/40 bg-semantic-warning/10 p-2 text-[11px] leading-snug text-theme-text-secondary"
+        >
+          <AlertTriangle className="mt-0.5 h-3 w-3 shrink-0 text-semantic-warning" />
+          <span>
+            {failedServers.map((server, i) => (
+              <span key={server.name}>
+                {i > 0 ? "; " : ""}
+                MCP server{" "}
+                <span className="font-medium text-theme-text-primary">
+                  {server.name}
+                </span>{" "}
+                {mcpStatusPhrase(server.status)}
+              </span>
+            ))}
+            {radarServer
+              ? mcpStatusIsFailure(radarServer.status)
+                ? ` at startup. ${agentLabel} had no Radar tools this turn, so it could not use Radar's cluster evidence.`
+                : ` at startup. Radar's tools may not have been available to ${agentLabel} this turn.`
+              : allDefiniteFailures
+                ? ` at startup. ${agentLabel} ran this turn without those tools.`
+                : ` at startup. Those tools may not have been available to ${agentLabel} this turn.`}
+          </span>
+        </div>
+      )}
       {items.map((it, i) => {
         if (it.kind === "thinking") {
           return (
@@ -1254,22 +1371,45 @@ function RunningStatus({ label }: { label: string }) {
   }, []);
   const sinceChange = elapsed - lastChangeRef.current;
   const stalled = elapsed >= 30 && sinceChange >= 30;
+  const counter = runningElapsedLabel(elapsed);
   return (
     <div className="flex items-center gap-2 pt-1 text-xs">
       <Loader2 className="h-3 w-3 shrink-0 animate-spin text-accent" />
-      <span className="ai-shimmer">{label}</span>
-      {elapsed >= 3 && (
-        <span className="shrink-0 text-theme-text-tertiary">· {elapsed}s</span>
-      )}
+      <span className="ai-shimmer min-w-0 truncate">{label}</span>
       {stalled && (
         <span className="shrink-0 text-theme-text-tertiary">
           · still working — no update for {sinceChange}s
         </span>
       )}
+      {counter && (
+        <span className="ml-auto shrink-0 tabular-nums text-theme-text-tertiary">
+          {counter}
+        </span>
+      )}
     </div>
   );
 }
 
+// The wait the operator feels is the whole turn's, so the counter is a
+// row-level figure set apart from the label: "Connected to Radar's tools"
+// followed by "10s" read as if the handshake took that long.
+export function runningElapsedLabel(elapsed: number): string | undefined {
+  return elapsed >= 3 ? `${elapsed}s elapsed` : undefined;
+}
+
+// Claude Code reports each MCP server as connected, failed, needs-auth, or
+// pending. Only the first two are definite outcomes; anything else is left as
+// the CLI's own word so the warning never claims more than it knows.
+function mcpStatusIsFailure(status: string): boolean {
+  return status === "failed" || status === "needs-auth";
+}
+
+function mcpStatusPhrase(status: string): string {
+  if (status === "failed") return "failed to connect";
+  if (status === "needs-auth") return "needs authentication";
+  return `is ${status}`;
+}
+
 // Maps a running tool to a human verb so the status line reads as activity, not
 // machinery. Falls back to the prettified tool name for anything unmapped.
 function toolActivity(tool: string): string {
@@ -1321,6 +1461,9 @@ function ToolRow({
   const richResult =
     !!step.result && (isJsonPayload(step.result) || step.result.length > 200);
   const done = step.status === "done";
+  const durationLabel = toolDurationLabel(step.ms);
+  const errorReason =
+    step.isError === true ? toolErrorReason(step.result) : undefined;
   const outcomeLabel = !done
     ? "Running"
     : step.isError === true
@@ -1359,9 +1502,16 @@ function ToolRow({
           {argumentsPreview}
         </span>
       )}
-      {step.ms != null && (
+      {errorReason && !open && (
+        // The arguments give way first: they are still readable expanded,
+        // while the reason is the one thing this row exists to say.
+        <span className="investigation-tool-reason max-w-full shrink-0 truncate text-[11px] text-semantic-error">
+          {middleTruncate(errorReason)}
+        </span>
+      )}
+      {durationLabel && (
         <span className="ml-auto shrink-0 text-[11px] text-theme-text-tertiary">
-          {step.ms}ms
+          {durationLabel}
         </span>
       )}
       {hasDetail && <CollapseChevron open={open} className="h-3.5 w-3.5" />}
@@ -1454,6 +1604,7 @@ function ToolRow({
               {step.result && (
                 <PayloadBlock
                   label="Original result"
+                  detail={step.ms != null ? `${step.ms}ms` : undefined}
                   text={step.result}
                   sourceExcerpt={sourceExcerpt}
                   revealRequestId={revealRequestId}
@@ -1488,6 +1639,59 @@ function ToolRow({
   );
 }
 
+// Only outliers carry information on the collapsed row: a slow log fetch or a
+// probe that hung. Sub-second calls stay silent; the exact figure lives in the
+// expanded result header.
+export function toolDurationLabel(ms: number | undefined): string | undefined {
+  if (ms == null || ms < 2000) return undefined;
+  return `${Math.round(ms / 1000)}s`;
+}
+
+// The producer's own words for a failed call, reduced to one line. Radar's MCP
+// errors are plain text; a JSON envelope with an `error` field is unwrapped.
+// Radar's not-found errors append retry hints for the agent after an em dash;
+// only the clause before it says what failed, so the hints are dropped.
+export function toolErrorReason(
+  result: string | undefined,
+): string | undefined {
+  if (!result) return undefined;
+  let text = result;
+  try {
+    const parsed: unknown = JSON.parse(result);
+    if (
+      parsed &&
+      typeof parsed === "object" &&
+      typeof (parsed as { error?: unknown }).error === "string"
+    ) {
+      text = (parsed as { error: string }).error;
+    }
+  } catch {
+    // plain text
+  }
+  const line = text
+    .split("\n")
+    .map((part) => part.trim())
+    .find((part) => part.length > 0);
+  if (!line) return undefined;
+  const clause = line.split(" — ")[0].trim();
+  return clause || line;
+}
+
+const COLLAPSED_REASON_MAX = 100;
+const COLLAPSED_REASON_TAIL = 36;
+
+// Keeps both ends of a long reason: the leading words say what failed and the
+// tail usually carries the identifier, which a plain end-truncation would lose.
+export function middleTruncate(
+  text: string,
+  max = COLLAPSED_REASON_MAX,
+  tail = COLLAPSED_REASON_TAIL,
+): string {
+  if (text.length <= max) return text;
+  const head = Math.max(1, max - tail - 1);
+  return `${text.slice(0, head).trimEnd()}…${text.slice(-tail).trimStart()}`;
+}
+
 // isJsonPayload / formatJson — a tool result is "structured" if it parses as JSON.
 function isJsonPayload(text: string): boolean {
   try {
@@ -1509,6 +1713,7 @@ function formatJson(text: string): string | null {
 // to keep indentation) or wrapped text (logs/prose), with copy + optional action.
 function PayloadBlock({
   label,
+  detail,
   text,
   truncated,
   action,
@@ -1516,6 +1721,7 @@ function PayloadBlock({
   revealRequestId,
 }: {
   label: string;
+  detail?: string;
   text: string;
   truncated?: boolean;
   action?: ReactNode;
@@ -1547,6 +1753,11 @@ function PayloadBlock({
       <div className="mb-0.5 flex items-center justify-between gap-2">
         <span className="text-[10px] uppercase tracking-wide text-theme-text-tertiary">
           {label}
+          {detail && (
+            <span className="ml-1.5 normal-case tracking-normal">
+              · {detail}
+            </span>
+          )}
         </span>
         <div className="flex items-center gap-2">
           {action}
@@ -1711,6 +1922,7 @@ export function ResultCard({
   showDisclaimer = true,
   coverageLimited = false,
   evidenceConflict = false,
+  evidenceConflictExplainedBy,
   compactActions = false,
   assessmentAction,
   assessmentSources,
@@ -1734,6 +1946,12 @@ export function ResultCard({
   coverageLimited?: boolean;
   /** Marks a healthy agent assessment that conflicts with same-turn Key evidence. */
   evidenceConflict?: boolean;
+  /**
+   * Titles of the conflicting cards when the agent placed a "not a problem"
+   * note on every one of them; the banner then points at the agent's reasons
+   * rather than accusing evidence it already addressed.
+   */
+  evidenceConflictExplainedBy?: string[];
   /** Show only the recommended (or first) action until the user asks for more. */
   compactActions?: boolean;
   actionNotice?: string;
@@ -1753,7 +1971,14 @@ export function ResultCard({
   // flag in its structured envelope. Never promote an ordinary answer into an
   // authoritative investigation conclusion.
   if (followup)
-    return <FollowupAnswer diagnosis={diagnosis} animate={animate} />;
+    return (
+      <>
+        <FollowupAnswer diagnosis={diagnosis} animate={animate} />
+        {assessmentSources ? (
+          <AssessmentSourceDetails>{assessmentSources}</AssessmentSourceDetails>
+        ) : null}
+      </>
+    );
   if (diagnosis.healthy && !diagnosis.rootCause)
     return section === "actions" ? null : (
       <AllClearCard
@@ -1762,6 +1987,7 @@ export function ResultCard({
         showDisclaimer={showDisclaimer}
         coverageLimited={coverageLimited}
         evidenceConflict={evidenceConflict}
+        evidenceConflictExplainedBy={evidenceConflictExplainedBy}
         assessmentAction={assessmentAction}
         assessmentSources={assessmentSources}
       />
@@ -1814,40 +2040,173 @@ export function ResultCard({
   );
 }
 
+/**
+ * Sources the assessment cites: root-cause links first, then every source an
+ * agent item cites. Each row shows the roles the agent gave that source; a
+ * claim the pane could not pin to one observation is shown here in full.
+ */
+export function assessmentSourceRows(
+  resolution: InvestigationRootCauseEvidenceResolution | undefined,
+  investigationCase: InvestigationCaseResolution | undefined,
+): Array<{
+  source: InvestigationEvidenceSource;
+  items: InvestigationCaseItem[];
+}> {
+  const rows = new Map<
+    string,
+    { source: InvestigationEvidenceSource; items: InvestigationCaseItem[] }
+  >();
+  if (resolution?.status === "linked") {
+    for (const link of resolution.links) {
+      rows.set(link.source.id, { source: link.source, items: [] });
+    }
+  }
+  for (const item of investigationCase?.items ?? []) {
+    const row = rows.get(item.source.id) ?? { source: item.source, items: [] };
+    row.items.push(item);
+    rows.set(item.source.id, row);
+  }
+  return [...rows.values()];
+}
+
+function joinTitles(titles: string[]): string {
+  if (titles.length <= 1) return titles[0] ?? "";
+  if (titles.length === 2) return `${titles[0]} and ${titles[1]}`;
+  return `${titles.slice(0, -1).join(", ")}, and ${titles[titles.length - 1]}`;
+}
+
+/**
+ * Provenance for one assessment: the exact tool results it cited, each with
+ * its source, and under a source only the agent notes that are not already
+ * shown on a card. Notes that live on cards are counted, not repeated; an
+ * earlier assessment no longer annotates the Evidence pane, so all of its
+ * notes are listed here instead of being lost.
+ */
 export function AssessmentSources({
   resolution,
+  investigationCase,
+  unlinkedEvidence = 0,
+  evidenceMalformed = false,
+  readOnly = false,
+  renderedGroupIds,
   onViewSource,
 }: {
   resolution?: InvestigationRootCauseEvidenceResolution;
+  investigationCase?: InvestigationCaseResolution;
+  /**
+   * Notes the agent wrote that could not be tied to a Radar result: a
+   * reference that named nothing, a role Radar does not know, a sentence over
+   * the length limit. Radar does not repair them, because repairing one means
+   * deciding what the agent meant, so it says how many were lost instead.
+   */
+  unlinkedEvidence?: number;
+  /**
+   * The agent's notes were not a list at all, so none of them could be read
+   * and no count describes how many were lost.
+   */
+  evidenceMalformed?: boolean;
+  readOnly?: boolean;
+  /**
+   * Groups the Evidence pane actually rendered. A card-placed note whose card
+   * was withheld is shown here instead of being counted as visible elsewhere;
+   * without this the note renders in neither place. Omitted by hosts that do
+   * not know, which keeps the original counting.
+   */
+  renderedGroupIds?: ReadonlySet<string>;
   onViewSource: (sourceId: string) => void;
 }) {
-  if (resolution?.status !== "linked" || !resolution.links.length) return null;
+  const rows = assessmentSourceRows(resolution, investigationCase);
+  if (rows.length === 0 && unlinkedEvidence === 0 && !evidenceMalformed)
+    return null;
   return (
     <div className="mt-3 border-t border-theme-border/60 pt-2">
-      <h4 className="text-xs font-medium text-theme-text-secondary">
+      <h4 className="text-[11px] font-semibold uppercase tracking-wide text-theme-text-tertiary">
         Sources used for this assessment
+        <span className="ml-1.5 font-medium normal-case tracking-normal text-theme-text-tertiary">
+          {rows.length}
+        </span>
       </h4>
-      <ul className="mt-1 space-y-1">
-        {resolution.links.map((link) => (
-          <li key={link.source.id}>
-            <button
-              type="button"
-              aria-label={`View ${prettyTool(link.source.tool)} source used for this assessment`}
-              onClick={() => onViewSource(link.source.id)}
-              className="flex w-full min-w-0 items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs text-accent-text hover:bg-theme-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50"
-            >
-              <FileSearch className="h-3.5 w-3.5 shrink-0" aria-hidden />
-              <span className="min-w-0 flex-1">
-                <span className="font-medium">
-                  {prettyTool(link.source.tool)}
-                </span>
-                <CitedSourceScope source={link.source} />
-              </span>
-              <span className="shrink-0">View source</span>
-            </button>
-          </li>
-        ))}
+      <ul className="mt-1 divide-y divide-theme-border/50">
+        {rows.map(({ source, items }) => {
+          const shownOnCard = (item: InvestigationCaseItem) =>
+            !!item.claim &&
+            item.placement !== "source" &&
+            (!renderedGroupIds ||
+              (!!item.groupId && renderedGroupIds.has(item.groupId)));
+          const onCards = items.filter(shownOnCard).length;
+          const notes = items.filter(
+            (item) => item.claim && (readOnly || !shownOnCard(item)),
+          );
+          return (
+            <li key={source.id} className="py-1.5">
+              <div className="grid grid-cols-[auto_minmax(0,1fr)_auto] items-start gap-x-2 px-2">
+                <FileSearch
+                  className="mt-0.5 h-3.5 w-3.5 shrink-0 text-theme-text-tertiary"
+                  aria-hidden
+                />
+                <div className="min-w-0 text-xs">
+                  <div className="font-medium text-theme-text-primary">
+                    {prettyTool(source.tool)}
+                  </div>
+                  <CitedSourceScope source={source} />
+                  {!readOnly && onCards > 0 ? (
+                    <div className="mt-0.5 text-[11px] text-theme-text-tertiary">
+                      {onCards === 1
+                        ? "1 agent note on an evidence card"
+                        : `${onCards} agent notes on evidence cards`}
+                    </div>
+                  ) : null}
+                </div>
+                <button
+                  type="button"
+                  aria-label={`View ${prettyTool(source.tool)} source used for this assessment`}
+                  onClick={() => onViewSource(source.id)}
+                  className="inline-flex shrink-0 items-center gap-1 rounded-md px-1.5 py-0.5 text-xs text-accent-text hover:bg-theme-hover focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/50"
+                >
+                  View source
+                </button>
+              </div>
+              {notes.length > 0 ? (
+                <div
+                  className="ml-[1.9rem] mr-2 mt-1.5 space-y-1.5"
+                  data-source-placed-claims
+                >
+                  <div className="text-[10px] font-semibold uppercase tracking-wide text-theme-text-tertiary">
+                    {readOnly
+                      ? "Notes from this assessment"
+                      : "Notes not shown on a card"}
+                  </div>
+                  {notes.map((item) => (
+                    <AgentClaimNote
+                      key={item.index}
+                      claim={item.claim}
+                      role={item.role}
+                      subject={
+                        item.placement === "source"
+                          ? undefined
+                          : item.observation?.title
+                      }
+                      className="border-t-0"
+                    />
+                  ))}
+                </div>
+              ) : null}
+            </li>
+          );
+        })}
       </ul>
+      {evidenceMalformed ? (
+        <p className="mt-2 text-[11px] text-theme-text-tertiary">
+          The agent&apos;s notes could not be read, so none are shown.
+        </p>
+      ) : null}
+      {unlinkedEvidence > 0 ? (
+        <p className="mt-2 text-[11px] text-theme-text-tertiary">
+          {unlinkedEvidence === 1
+            ? "1 agent note could not be linked to a Radar result and is not shown."
+            : `${unlinkedEvidence} agent notes could not be linked to Radar results and are not shown.`}
+        </p>
+      ) : null}
     </div>
   );
 }
@@ -2316,6 +2675,7 @@ function AllClearCard({
   showDisclaimer,
   coverageLimited,
   evidenceConflict,
+  evidenceConflictExplainedBy,
   assessmentAction,
   assessmentSources,
 }: {
@@ -2324,6 +2684,7 @@ function AllClearCard({
   showDisclaimer: boolean;
   coverageLimited: boolean;
   evidenceConflict: boolean;
+  evidenceConflictExplainedBy?: string[];
   assessmentAction?: ReactNode;
   assessmentSources?: ReactNode;
 }) {
@@ -2337,11 +2698,16 @@ function AllClearCard({
   const summary = detailed
     ? "The agent found no active problem in the evidence it reviewed."
     : report;
+  const explained =
+    evidenceConflict &&
+    !!evidenceConflictExplainedBy &&
+    evidenceConflictExplainedBy.length > 0;
+  const unexplainedConflict = evidenceConflict && !explained;
   return (
     <div className={`mt-3 space-y-2 ${animate ? "animate-result-in" : ""}`}>
       <div
         className={`rounded-lg border p-3 ${
-          evidenceConflict
+          unexplainedConflict || explained
             ? "border-amber-500/40 bg-amber-500/5"
             : coverageLimited
               ? "border-amber-500/30 bg-amber-500/5"
@@ -2351,33 +2717,44 @@ function AllClearCard({
         <div className="mb-1 flex items-center justify-between gap-2">
           <div
             className={`flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide ${
-              evidenceConflict || coverageLimited
+              unexplainedConflict || explained || coverageLimited
                 ? "text-amber-500"
                 : "text-emerald-500"
             }`}
           >
-            {evidenceConflict || coverageLimited ? (
+            {unexplainedConflict || explained || coverageLimited ? (
               <AlertTriangle className="h-3.5 w-3.5" />
             ) : (
               <CheckCircle2 className="h-3.5 w-3.5" />
             )}
-            {evidenceConflict
+            {unexplainedConflict
               ? "Assessment conflicts with captured evidence"
-              : coverageLimited
-                ? "No problem identified in available evidence"
-                : "No problem found in checked evidence"}
+              : explained
+                ? "Agent reports no active problem; adverse evidence remains"
+                : coverageLimited
+                  ? "No problem identified in available evidence"
+                  : "No problem found in checked evidence"}
           </div>
           <CopyButton text={report} label="Copy assessment" />
         </div>
         <AIMarkdown className="text-sm text-theme-text-primary [overflow-wrap:anywhere] [&_code]:font-normal [&_li]:text-theme-text-primary [&_p]:my-1 [&_p]:text-theme-text-primary [&_p:first-child]:mt-0 [&_p:last-child]:mb-0">
           {summary}
         </AIMarkdown>
-        {evidenceConflict ? (
+        {unexplainedConflict ? (
           <p className="mt-2 text-xs text-theme-text-secondary">
             Radar also captured evidence of an active problem. Review that
             evidence before treating the agent&apos;s conclusion as an
             all-clear.
           </p>
+        ) : explained ? (
+          <p className="mt-2 text-xs text-theme-text-secondary">
+            Radar captured evidence of an active problem. The agent explains its
+            interpretation in the note on{" "}
+            {joinTitles(evidenceConflictExplainedBy!)}.
+            {coverageLimited
+              ? " Evidence coverage is also limited — review the limitations in Evidence."
+              : ""}
+          </p>
         ) : coverageLimited ? (
           <p className="mt-2 text-xs text-theme-text-secondary">
             Evidence coverage is limited. Review the limitations in Evidence