refactor(webapp): move dashboard-agent render UI to the UI PR

Author: kathiekiwi

apps/webapp/app/components/dashboard-agent/ActionsBlock.tsx

@@ -1,24 +1,17 @@
 import type { UIMessage } from "@ai-sdk/react";
-import { memo, useMemo, useRef } from "react";
+import { memo } from "react";
 import { Spinner } from "~/components/primitives/Spinner";
 import { MessageBubble, renderPart } from "~/components/runs/v3/agent/AgentMessageView";
 import { useAutoScrollToBottom } from "~/hooks/useAutoScrollToBottom";
-import { reuseWinners } from "./investigation-winners";
-import { answerContinuesAfter } from "./view-actions";
 import { ViewBlocks } from "./view-catalog";
 
-// The shared MessageBubble renders `step-start` parts as a dashed "step" separator —
-// useful in the run inspector / playground, just noise in this simple chat.
-// Cached so a stripped message keeps its identity across renders and memoization holds.
-const strippedMessages = new WeakMap<UIMessage, UIMessage>();
-
+// The shared MessageBubble renders `step-start` parts as a dashed "step"
+// separator — useful in the run inspector / playground, just noise in this
+// simple chat. Drop them before rendering (reference preserved when there are
+// none, so memoization still holds for those messages).
 function stripStepParts(message: UIMessage): UIMessage {
   if (!message.parts?.some((p) => p.type === "step-start")) return message;
-  const cached = strippedMessages.get(message);
-  if (cached) return cached;
-  const stripped = { ...message, parts: message.parts.filter((p) => p.type !== "step-start") };
-  strippedMessages.set(message, stripped);
-  return stripped;
+  return { ...message, parts: message.parts.filter((p) => p.type !== "step-start") };
 }
 
 // A completed render_view tool part carries a `{ blocks }` view spec the agent
@@ -30,109 +23,28 @@ function viewSpecFor(part: UIMessage["parts"][number]): { blocks: unknown[] } |
   return Array.isArray(p.output?.blocks) ? { blocks: p.output!.blocks! } : null;
 }
 
-function hostViewBlocks(part: UIMessage["parts"][number]): unknown[] | null {
-  const p = part as { type: string; data?: { blocks?: unknown[] } };
-  if (p.type !== "data-view") return null;
-  return Array.isArray(p.data?.blocks) ? p.data!.blocks! : null;
-}
-
-// Both carriers render as cards, so whichever one wins a revision is one the panel
-// can actually draw — a host-written card can never suppress a tool-rendered one
-// into nothing.
-function viewBlocksFor(part: UIMessage["parts"][number]): unknown[] | null {
-  return viewSpecFor(part)?.blocks ?? hostViewBlocks(part);
-}
-
-type InvestigationRef = { id: string; revision: number };
-
-function investigationRef(block: unknown): InvestigationRef | null {
-  const b = block as { type?: string; id?: string; revision?: number };
-  if (b?.type !== "investigation" || typeof b.id !== "string") return null;
-  return { id: b.id, revision: typeof b.revision === "number" ? b.revision : 0 };
-}
-
-/**
- * Per investigation id, the one `messageId:partIndex` allowed to render: highest revision.
- * Indexed over the same stripped parts the renderer walks, so the two agree on what part 0 is.
- */
-export function winningInvestigationOccurrences(messages: UIMessage[]): Map<string, string> {
-  const best = new Map<string, { revision: number; occurrence: string }>();
-  for (const message of messages.map(stripStepParts)) {
-    (message.parts ?? []).forEach((part, partIndex) => {
-      for (const block of viewBlocksFor(part) ?? []) {
-        const ref = investigationRef(block);
-        if (!ref) continue;
-        const current = best.get(ref.id);
-        if (!current || ref.revision >= current.revision) {
-          best.set(ref.id, { revision: ref.revision, occurrence: `${message.id}:${partIndex}` });
-        }
-      }
-    });
-  }
-  return new Map([...best.entries()].map(([id, w]) => [id, w.occurrence]));
-}
-
-// The stable identity is the point: a fresh `Map` re-renders the whole transcript per token.
-function useInvestigationWinners(messages: UIMessage[]): Map<string, string> {
-  const previous = useRef<Map<string, string>>();
-  const next = useMemo(() => winningInvestigationOccurrences(messages), [messages]);
-  previous.current = reuseWinners(previous.current, next);
-  return previous.current;
-}
-
-function withoutSupersededInvestigations(
-  blocks: unknown[],
-  occurrence: string,
-  winners: Map<string, string> | undefined
-): unknown[] {
-  if (!winners) return blocks;
-  return blocks.filter((block) => {
-    const ref = investigationRef(block);
-    return !ref || winners.get(ref.id) === occurrence;
-  });
-}
-
-// Renders one message. Assistant messages carrying a view spec get the catalog
-// cards (plus the gather tool rows / lead-in text for transparency); everything
-// else uses the shared MessageBubble unchanged, so its streaming memoization is
-// preserved for the common case.
-export function DashboardAgentMessageBubble({
+// Renders one message. Assistant messages that include a completed render_view
+// part get the catalog cards (plus the gather tool rows / lead-in text for
+// transparency); everything else uses the shared MessageBubble unchanged, so
+// its streaming memoization is preserved for the common case.
+const DashboardAgentMessageBubble = memo(function DashboardAgentMessageBubble({
   message,
-  investigationWinners,
 }: {
   message: UIMessage;
-  /** See {@link winningInvestigationOccurrences}. */
-  investigationWinners?: Map<string, string>;
 }) {
-  if (message.role !== "assistant" || !message.parts?.some((p) => viewBlocksFor(p))) {
+  if (message.role !== "assistant" || !message.parts?.some((p) => viewSpecFor(p))) {
     return <MessageBubble message={message} />;
   }
   return (
     <div className="space-y-2">
       {message.parts.map((part, i) => {
-        const spec = viewBlocksFor(part);
-        if (!spec) return renderPart(part, i);
-        const blocks = withoutSupersededInvestigations(
-          spec,
-          `${message.id}:${i}`,
-          investigationWinners
-        );
-        if (blocks.length === 0) return null;
-        // No `onIntent`: nothing here can act on one yet, so the cards drop their
-        // action rows rather than offer buttons that would do nothing.
-        return (
-          <ViewBlocks
-            key={i}
-            blocks={blocks as never}
-            answered={answerContinuesAfter(message.parts as never, i)}
-          />
-        );
+        const spec = viewSpecFor(part);
+        if (spec) return <ViewBlocks key={i} blocks={spec.blocks as never} />;
+        return renderPart(part, i);
       })}
     </div>
   );
-}
-
-const MemoizedMessageBubble = memo(DashboardAgentMessageBubble);
+});
 
 // Renders the conversation with the shared agent message renderer — the same
 // MessageBubble the run inspector and playground use, so agent output looks
@@ -148,19 +60,12 @@ export function DashboardAgentMessages({
   error?: Error;
 }) {
   const rootRef = useAutoScrollToBottom([messages, isThinking]);
-  // Must be the exact parts the bubbles render: the winners map keys by part index.
-  const stripped = useMemo(() => messages.map(stripStepParts), [messages]);
-  const investigationWinners = useInvestigationWinners(stripped);
 
   return (
     <div className="flex-1 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-surface-control">
       <div ref={rootRef} className="space-y-4 p-4">
-        {stripped.map((message) => (
-          <MemoizedMessageBubble
-            key={message.id}
-            message={message}
-            investigationWinners={investigationWinners}
-          />
+        {messages.map((message) => (
+          <DashboardAgentMessageBubble key={message.id} message={stripStepParts(message)} />
         ))}
         {isThinking && (
           <div className="flex items-center gap-2 text-sm text-text-dimmed">