fix(ui): scope a tool step to its own turn, and let the sheet own its bounds

Four review findings on the surfaces this PR adds.

**A tool step could open another turn's trace.** Resolving the step's trace by
scanning forward for the next assistant bubble runs past the turn boundary when
a tool-only run produces none, attaching the step to the *following* turn's
trace — a different trace, which does not contain that span. The search now
stops at the next user message, and the link is offered only when that turn's
trace is `available`, the same gate the turn's own "View trace" link uses. A new
test file covers all three cases.

**The embedded viewer ignored the sheet.** TraceViewerPanel is a fixed
70%-viewport overlay, so nesting it in the drawer painted over the page rather
than filling it; the AI Assistant button was also inert, since the sheet
hard-codes `aiPanelOpen: false` while `setAiPanelOpen` still reached the outer
panel. An explicit `embedded` prop drops the fixed positioning and hides that
control. The non-embedded class string is written out unchanged rather than
composed — the user-trace snapshot test compares this markup byte for byte, and
caught a reordering that was visually identical.

**A tooltip claimed a finding predated tracing.** Absent execution status means
different things depending on whether an analysis ran at all; `rca_status`
distinguishes them, so a never-analyzed finding now reads "not analyzed" and a
failed one says so, instead of both claiming they ran before tracing existed.

Co-Authored-By: Claude <noreply@anthropic.com>

Author: GabrielDrapor

frontend/ui/src/features/ai-assistant/components/agent-trace-sheet.test.tsx

@@ -8,13 +8,14 @@ import { useLayout, LayoutContext } from "@/components/layout/app-layout";
 // AgentTraceSheet's local LayoutContext.Provider actually intercepts that read
 // rather than asserting on TraceViewerPanel's (unrelated, heavy) internals.
 vi.mock("@/features/traces/components/TraceViewerPanel", () => ({
-  TraceViewerPanel: (props: { source?: string }) => {
+  TraceViewerPanel: (props: { source?: string; embedded?: boolean }) => {
     const layout = useLayout();
     layout.registerAiHost();
     return (
       <div
         data-testid="trace-panel"
         data-source={props.source}
+        data-embedded={String(!!props.embedded)}
         data-ai-panel-open={String(layout.aiPanelOpen)}
       />
     );
@@ -71,3 +72,11 @@ describe("AgentTraceSheet", () => {
     expect(screen.queryByTestId("trace-panel")).toBeNull();
   });
 });
+
+it("renders the viewer in embedded mode so it fills the sheet", () => {
+  // TraceViewerPanel is otherwise a fixed 70%-viewport overlay, which would
+  // ignore the drawer's bounds and paint over the page. Embedded also hides the
+  // AI Assistant control, whose panel lives outside this container.
+  render(<AgentTraceSheet projectId="p1" traceId={"a".repeat(32)} onClose={() => {}} />);
+  expect(screen.getByTestId("trace-panel").getAttribute("data-embedded")).toBe("true");
+});

frontend/ui/src/features/ai-assistant/components/agent-trace-sheet.tsx

@@ -51,6 +51,7 @@ export function AgentTraceSheet({
               projectId={projectId}
               traceId={traceId}
               source="agent"
+              embedded
               onClose={onClose}
               onNavigate={() => {}}
               canNavigateUp={false}

frontend/ui/src/features/ai-assistant/components/message-list.test.tsx

@@ -0,0 +1,77 @@
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+
+vi.mock("react-markdown", () => ({ default: ({ children }: { children: string }) => <>{children}</> }));
+vi.mock("remark-gfm", () => ({ default: () => {} }));
+
+import { MessageList } from "./message-list";
+import type { AIMessage } from "../types";
+
+afterEach(cleanup);
+
+const step = (id: string): AIMessage =>
+  ({
+    id,
+    role: "tool_step",
+    content: "",
+    toolStep: { toolCallId: id, toolName: "read", args: {}, spanId: `span-${id}`, isError: false },
+  }) as unknown as AIMessage;
+
+const user = (id: string): AIMessage => ({ id, role: "user", content: "ask" }) as AIMessage;
+
+const assistant = (id: string, traceId: string, traceStatus = "available"): AIMessage =>
+  ({ id, role: "assistant", content: "answer", traceId, traceStatus }) as unknown as AIMessage;
+
+/** Expand every tool step so its "Open span" control is in the DOM. */
+function openSteps() {
+  // The step header is a button carrying the raw tool name in parentheses.
+  for (const b of screen.getAllByRole("button")) {
+    if (b.textContent?.includes("(read)")) fireEvent.click(b);
+  }
+}
+
+describe("MessageList tool-step trace resolution", () => {
+  it("links a tool step to its own turn's trace", () => {
+    const onOpenTrace = vi.fn();
+    render(
+      <MessageList
+        messages={[user("u1"), step("t1"), assistant("a1", "trace-1")]}
+        onOpenTrace={onOpenTrace}
+      />,
+    );
+    openSteps();
+    fireEvent.click(screen.getByText("Open span"));
+    expect(onOpenTrace).toHaveBeenCalledWith("trace-1", "span-t1");
+  });
+
+  it("does not reach past a turn boundary for a trace", () => {
+    // A tool-only run produces no assistant bubble. Scanning past the next user
+    // message would attach this step to the following turn's trace — a
+    // different trace, which does not contain this span.
+    const onOpenTrace = vi.fn();
+    render(
+      <MessageList
+        messages={[user("u1"), step("t1"), user("u2"), assistant("a2", "trace-2")]}
+        onOpenTrace={onOpenTrace}
+      />,
+    );
+    openSteps();
+    expect(screen.queryByText("Open span")).toBeNull();
+  });
+
+  it("offers no link while the turn's trace is pending or failed", () => {
+    for (const status of ["pending", "failed", "disabled"]) {
+      const onOpenTrace = vi.fn();
+      render(
+        <MessageList
+          messages={[user("u1"), step("t1"), assistant("a1", "trace-1", status)]}
+          onOpenTrace={onOpenTrace}
+        />,
+      );
+      openSteps();
+      expect(screen.queryByText("Open span")).toBeNull();
+      cleanup();
+    }
+  });
+});

frontend/ui/src/features/ai-assistant/components/message-list.tsx

@@ -580,12 +580,19 @@ export function MessageList({ messages, sessionStreaming = false, onOpenTrace }:
       <div ref={innerRef}>
         {messages.map((msg, index) => {
           if (msg.role === "tool_step" && msg.toolStep) {
-            // The step's own turn hasn't produced its trace-carrying assistant
-            // bubble yet until that bubble appears later in the list — its
-            // traceId is the one this tool step's span belongs to.
-            const turnTraceId = messages
-              .slice(index + 1)
-              .find((m) => m.role === "assistant")?.traceId;
+            // A tool step belongs to the turn that produced it, and that turn's
+            // trace id arrives on the assistant bubble later in the list. The
+            // search must stop at the next user message: a tool-only run
+            // produces no assistant bubble, and scanning past the turn boundary
+            // would attach this step to the *next* turn's trace — a different
+            // trace that does not contain this span.
+            const turnEnd = messages.findIndex((m, i) => i > index && m.role === "user");
+            const turn = messages.slice(index + 1, turnEnd === -1 ? undefined : turnEnd);
+            const turnAssistant = turn.find((m) => m.role === "assistant");
+            // Same gate as the turn's own "View trace" link: a pending or failed
+            // export has no trace to open.
+            const turnTraceId =
+              turnAssistant?.traceStatus === "available" ? turnAssistant.traceId : undefined;
             const onOpenSpan =
               onOpenTrace && turnTraceId
                 ? (spanId: string) => onOpenTrace(turnTraceId, spanId)

frontend/ui/src/features/detectors/components/detector-runs-table.tsx

@@ -126,11 +126,20 @@ export function DetectorRunsTable({
                   title={
                     run.execution_trace_status === "available"
                       ? `${findingId} — open the analysis trace`
-                      : run.execution_trace_status == null
-                        ? `${findingId} — no analysis trace (analysis ran before tracing was enabled)`
-                        : run.execution_trace_status === "pending"
-                          ? `${findingId} — analysis trace is being recorded`
-                          : `${findingId} — analysis trace unavailable`
+                      : run.execution_trace_status === "pending"
+                        ? `${findingId} — analysis trace is being recorded`
+                        : run.execution_trace_status != null
+                          ? `${findingId} — analysis trace unavailable`
+                          : // No execution trace status. Absent means different
+                            // things depending on whether an analysis ran at
+                            // all, and saying "before tracing was enabled" for
+                            // a finding that was never analysed is simply
+                            // wrong — rca_status is what distinguishes them.
+                            run.rca_status == null
+                            ? `${findingId} — not analyzed`
+                            : run.rca_status === "done"
+                              ? `${findingId} — no analysis trace (analysis ran before tracing was enabled)`
+                              : `${findingId} — analysis ${run.rca_status}; no trace`
                   }
                   onOpen={
                     run.execution_trace_status === "available"

frontend/ui/src/features/traces/components/TraceViewerPanel.tsx

@@ -51,6 +51,14 @@ interface TraceViewerPanelProps {
   autoOpenRca?: boolean;
   /** When true, the panel mounts already expanded to full width (e.g. opened in a new tab). */
   initialFullscreen?: boolean;
+  /**
+   * Rendered inside another surface (the agent-trace sheet) rather than as the
+   * page's own overlay. Drops the fixed full-height positioning so the host
+   * controls the bounds, and hides the AI Assistant control: the assistant it
+   * would toggle lives outside this container, so the button either does
+   * nothing or opens a panel the user cannot see from here.
+   */
+  embedded?: boolean;
   /**
    * Base path the "open in new tab" button targets, so the trace pops out back
    * into the page it was opened from. Defaults to the project traces page; the
@@ -167,6 +175,7 @@ export function TraceViewerPanel({
   customEndDate,
   autoOpenRca,
   initialFullscreen,
+  embedded,
   newTabPath,
   traceOverride,
   hideDetectors,
@@ -378,16 +387,25 @@ export function TraceViewerPanel({
   return (
     <div
       className={cn(
-        "animate-slide-in-right fixed bottom-0 right-0 z-50 border-l border-border bg-background shadow-xl transition-[width,top] duration-200",
-        // Fullscreen stays clear of the chrome it would otherwise cover: it
-        // starts below the top breadcrumb/header bar (h-14) and to the right of
-        // the left navbar. Width = 100% minus the sidebar's width, which differs
-        // when the sidebar is collapsed.
-        isFullscreen
-          ? sidebarCollapsed
-            ? "top-14 w-[calc(100%-3.5rem)]"
-            : "top-14 w-[calc(100%-12rem)]"
-          : "top-0 w-[70%]",
+        // Embedded, the host (a drawer) owns the bounds: filling it is the whole
+        // job. Keeping the fixed 70%-viewport overlay here would ignore the
+        // drawer and paint over the page instead of inside it. The non-embedded
+        // branch is written out in full, in its original order, because the
+        // user-trace snapshot test compares this markup byte for byte.
+        embedded
+          ? "flex h-full w-full flex-col border-l border-border bg-background"
+          : cn(
+              "animate-slide-in-right fixed bottom-0 right-0 z-50 border-l border-border bg-background shadow-xl transition-[width,top] duration-200",
+              // Fullscreen stays clear of the chrome it would otherwise cover: it
+              // starts below the top breadcrumb/header bar (h-14) and to the right of
+              // the left navbar. Width = 100% minus the sidebar's width, which differs
+              // when the sidebar is collapsed.
+              isFullscreen
+                ? sidebarCollapsed
+                  ? "top-14 w-[calc(100%-3.5rem)]"
+                  : "top-14 w-[calc(100%-12rem)]"
+                : "top-0 w-[70%]",
+            ),
       )}
     >
       <div className="flex h-full flex-col bg-background">
@@ -531,7 +549,10 @@ export function TraceViewerPanel({
             <div className="w-2" />
             {/* AI Assistant sits immediately left of Close, separated by a gap
                 from the navigation/view controls, so the agent button stays the
-                rightmost action regardless of the other header controls. */}
+                rightmost action regardless of the other header controls. Hidden
+                when embedded — the assistant it toggles is outside this
+                container. */}
+            {!embedded && (
             <Button
               variant="outline"
               size="sm"
@@ -548,6 +569,7 @@ export function TraceViewerPanel({
             >
               <DOMAIN_ICONS.assistant className="h-4 w-4" />
             </Button>
+            )}
             <Button variant="ghost" size="sm" onClick={onClose} className="h-7 w-7 p-0">
               <X className="h-4 w-4" />
             </Button>