a2a-ui 0.8.3

package/lib/features/chats/chatsSlice.ts

@@ -0,0 +1,479 @@
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import type { Part, TaskState } from "@a2a-js/sdk";
+import type { ExecutionEvent } from "@/lib/a2a/execution-events";
+import { buildPartsPreview } from "@/lib/a2a/parts";
+
+// ─── Chat display item types ─────────────────────────────────────────────────
+
+export type UserMessageItem = {
+  kind: "user-message";
+  id: string;
+  parts: Part[];
+  metadata?: Record<string, string>;
+  isInputResponse?: boolean; // true when this message continues an input-required task
+  timestamp: number;
+};
+
+export type TaskStatusItem = {
+  kind: "task-status";
+  id: string; // taskId
+  taskId: string;
+  state: TaskState;
+  statusMessage?: { parts: Part[] };
+  timestamp: number;
+};
+
+export type ArtifactItem = {
+  kind: "artifact";
+  id: string; // artifactId
+  taskId: string;
+  name?: string;
+  description?: string;
+  parts: Part[];
+  metadata?: Record<string, unknown>;
+  isStreaming: boolean;
+  timestamp: number;
+};
+
+export type AgentMessageItem = {
+  kind: "agent-message";
+  id: string; // messageId
+  taskId?: string;
+  parts: Part[];
+  timestamp: number;
+};
+
+export type ToolCallItem = {
+  kind: "tool-call";
+  id: string; // runId
+  toolName: string;
+  query: string;
+  resultCount?: number;
+  phase: "running" | "done" | "error";
+  timestamp: number;
+};
+
+export type ChatItem =
+  | UserMessageItem
+  | TaskStatusItem
+  | ArtifactItem
+  | AgentMessageItem
+  | ToolCallItem;
+
+// ─── Chat ────────────────────────────────────────────────────────────────────
+
+export interface Chat {
+  id: string; // contextId
+  title: string;
+  agentUrl: string;
+  agentName: string;
+  lastMessage: string;
+  timestamp: number;
+  archived?: boolean;
+  pinned?: boolean;
+  sourceChatId?: string;
+  items: ChatItem[];
+  executionEvents: ExecutionEvent[];
+}
+
+export type ChatCloneMode = "prompt" | "full";
+
+export interface ChatsState {
+  chats: Chat[];
+  activeChatId: string | null;
+}
+
+const initialState: ChatsState = {
+  chats: [],
+  activeChatId: null,
+};
+
+const MAX_EXECUTION_EVENTS = 1000;
+
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+
+function findChat(state: ChatsState, chatId: string): Chat | undefined {
+  return state.chats.find(c => c.id === chatId);
+}
+
+function cloneJson<T>(value: T): T {
+  return JSON.parse(JSON.stringify(value)) as T;
+}
+
+// ─── Slice ───────────────────────────────────────────────────────────────────
+
+export const chatsSlice = createSlice({
+  name: "chats",
+  initialState,
+  reducers: {
+    hydrateChats: (_state, action: PayloadAction<Chat[]>) => {
+      return {
+        chats: action.payload.map((chat) => ({
+          ...chat,
+          archived: chat.archived ?? false,
+          pinned: chat.pinned ?? false,
+          items: chat.items ?? [],
+          executionEvents: chat.executionEvents ?? [],
+        })),
+        activeChatId: null,
+      };
+    },
+    addChat: (state, action: PayloadAction<Omit<Chat, "items" | "executionEvents">>) => {
+      const existing = state.chats.findIndex(c => c.id === action.payload.id);
+      const chat: Chat = {
+        ...action.payload,
+        archived: action.payload.archived ?? false,
+        pinned: action.payload.pinned ?? false,
+        items: [],
+        executionEvents: [],
+      };
+      if (existing >= 0) {
+        state.chats[existing] = { ...state.chats[existing], ...action.payload };
+      } else {
+        state.chats.unshift(chat);
+      }
+      state.activeChatId = action.payload.id;
+    },
+
+    importChat: (state, action: PayloadAction<Chat>) => {
+      const chat: Chat = {
+        ...action.payload,
+        archived: action.payload.archived ?? false,
+        pinned: action.payload.pinned ?? false,
+        items: action.payload.items ?? [],
+        executionEvents: action.payload.executionEvents ?? [],
+      };
+      const existing = state.chats.findIndex(c => c.id === chat.id);
+      if (existing >= 0) {
+        state.chats[existing] = chat;
+      } else {
+        state.chats.unshift(chat);
+      }
+    },
+
+    setActiveChat: (state, action: PayloadAction<string | null>) => {
+      state.activeChatId = action.payload;
+    },
+
+    removeChat: (state, action: PayloadAction<string>) => {
+      state.chats = state.chats.filter(c => c.id !== action.payload);
+      if (state.activeChatId === action.payload) {
+        state.activeChatId = state.chats.length > 0 ? state.chats[0].id : null;
+      }
+    },
+
+    renameChat: (state, action: PayloadAction<{ chatId: string; title: string }>) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (chat && action.payload.title.trim()) {
+        chat.title = action.payload.title.trim();
+        chat.timestamp = Date.now();
+      }
+    },
+
+    setChatArchived: (
+      state,
+      action: PayloadAction<{ chatId: string; archived: boolean }>
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      chat.archived = action.payload.archived;
+      chat.timestamp = Date.now();
+      if (action.payload.archived && state.activeChatId === action.payload.chatId) {
+        state.activeChatId = null;
+      }
+    },
+
+    setChatPinned: (
+      state,
+      action: PayloadAction<{ chatId: string; pinned: boolean }>
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      chat.pinned = action.payload.pinned;
+      chat.timestamp = Date.now();
+    },
+
+    cloneChat: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        newChatId: string;
+        title?: string;
+        mode?: ChatCloneMode;
+      }>
+    ) => {
+      const source = findChat(state, action.payload.chatId);
+      if (!source) return;
+
+      const now = Date.now();
+      const mode = action.payload.mode ?? "prompt";
+      const items =
+        mode === "full"
+          ? cloneJson(source.items)
+          : cloneJson(source.items.filter((item) => item.kind === "user-message"));
+      for (const item of items) {
+        item.timestamp = now;
+        if (item.kind === "user-message") {
+          item.id = `${item.id}-clone-${now}`;
+        }
+      }
+      const lastPrompt = items.findLast(
+        (item): item is UserMessageItem => item.kind === "user-message",
+      );
+      const title =
+        action.payload.title?.trim() ||
+        (mode === "full"
+          ? `Full copy · ${source.title}`
+          : items.length > 0
+            ? `Prompt clone · ${source.title}`
+            : `New run · ${source.title}`);
+      const cloned: Chat = {
+        id: action.payload.newChatId,
+        title,
+        agentUrl: source.agentUrl,
+        agentName: source.agentName,
+        lastMessage: lastPrompt ? buildPartsPreview(lastPrompt.parts) : "",
+        timestamp: now,
+        archived: false,
+        pinned: false,
+        sourceChatId: source.id,
+        items,
+        executionEvents: mode === "full" ? cloneJson(source.executionEvents) : [],
+      };
+
+      state.chats.unshift(cloned);
+      state.activeChatId = cloned.id;
+    },
+
+    // ── Message actions ──────────────────────────────────────────────────────
+
+    addUserMessage: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        id: string;
+        parts: Part[];
+        metadata?: Record<string, string>;
+        isInputResponse?: boolean;
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      const item: UserMessageItem = {
+        kind: "user-message",
+        id: action.payload.id,
+        parts: action.payload.parts,
+        metadata: action.payload.metadata,
+        isInputResponse: action.payload.isInputResponse,
+        timestamp: Date.now(),
+      };
+      chat.items.push(item);
+      chat.lastMessage = buildPartsPreview(action.payload.parts);
+      chat.timestamp = item.timestamp;
+    },
+
+    applyStatusUpdate: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        taskId: string;
+        state: TaskState;
+        statusMessage?: { parts: Part[] };
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      const now = Date.now();
+      // Upsert: find existing status item for this task or add new one
+      const idx = chat.items.findLastIndex(
+        it => it.kind === "task-status" && it.taskId === action.payload.taskId,
+      );
+      const item: TaskStatusItem = {
+        kind: "task-status",
+        id: action.payload.taskId,
+        taskId: action.payload.taskId,
+        state: action.payload.state,
+        statusMessage: action.payload.statusMessage,
+        timestamp: now,
+      };
+      if (idx >= 0) {
+        chat.items[idx] = item;
+      } else {
+        chat.items.push(item);
+      }
+    },
+
+    applyArtifactUpdate: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        taskId: string;
+        artifactId: string;
+        name?: string;
+        description?: string;
+        parts: Part[];
+        metadata?: Record<string, unknown>;
+        append: boolean;
+        lastChunk: boolean;
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      const now = Date.now();
+      const idx = chat.items.findLastIndex(
+        it => it.kind === "artifact" && it.id === action.payload.artifactId,
+      );
+
+      if (idx >= 0) {
+        const existing = chat.items[idx] as ArtifactItem;
+        if (action.payload.append) {
+          // Merge incoming TextParts onto the last TextPart, push others
+          for (const newPart of action.payload.parts) {
+            if (newPart.kind === "text") {
+              const lastPart = existing.parts[existing.parts.length - 1];
+              if (lastPart?.kind === "text") {
+                lastPart.text += newPart.text;
+              } else {
+                existing.parts.push(newPart);
+              }
+            } else {
+              existing.parts.push(newPart);
+            }
+          }
+        } else {
+          existing.parts = action.payload.parts;
+          if (action.payload.name) existing.name = action.payload.name;
+          if (action.payload.description) existing.description = action.payload.description;
+        }
+        if (action.payload.metadata !== undefined) {
+          existing.metadata = action.payload.metadata;
+        }
+        existing.isStreaming = !action.payload.lastChunk;
+        existing.timestamp = now;
+      } else {
+        const item: ArtifactItem = {
+          kind: "artifact",
+          id: action.payload.artifactId,
+          taskId: action.payload.taskId,
+          name: action.payload.name,
+          description: action.payload.description,
+          parts: action.payload.parts,
+          metadata: action.payload.metadata,
+          isStreaming: !action.payload.lastChunk,
+          timestamp: now,
+        };
+        chat.items.push(item);
+      }
+    },
+
+    applyToolCall: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        runId: string;
+        toolName: string;
+        query: string;
+        resultCount?: number;
+        phase: "running" | "done" | "error";
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      const idx = chat.items.findLastIndex(
+        it => it.kind === "tool-call" && it.id === action.payload.runId,
+      );
+      const item: ToolCallItem = {
+        kind: "tool-call",
+        id: action.payload.runId,
+        toolName: action.payload.toolName,
+        query: action.payload.query,
+        resultCount: action.payload.resultCount,
+        phase: action.payload.phase,
+        timestamp: Date.now(),
+      };
+      if (idx >= 0) {
+        chat.items[idx] = item;
+      } else {
+        chat.items.push(item);
+      }
+    },
+
+    applyAgentMessage: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        messageId: string;
+        taskId?: string;
+        parts: Part[];
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      const item: AgentMessageItem = {
+        kind: "agent-message",
+        id: action.payload.messageId,
+        taskId: action.payload.taskId,
+        parts: action.payload.parts,
+        timestamp: Date.now(),
+      };
+      chat.items.push(item);
+    },
+
+    appendExecutionEvent: (
+      state,
+      action: PayloadAction<{
+        chatId: string;
+        event: ExecutionEvent;
+      }>,
+    ) => {
+      const chat = findChat(state, action.payload.chatId);
+      if (!chat) return;
+      chat.executionEvents.push(action.payload.event);
+      if (chat.executionEvents.length > MAX_EXECUTION_EVENTS) {
+        chat.executionEvents = chat.executionEvents.slice(
+          chat.executionEvents.length - MAX_EXECUTION_EVENTS,
+        );
+      }
+    },
+
+    // Called on chat page mount to clear stale in-flight state left by a
+    // previous session that ended mid-stream (e.g. browser refresh).
+    sanitizeStaleStreaming: (state, action: PayloadAction<string>) => {
+      const chat = findChat(state, action.payload);
+      if (!chat) return;
+      for (const item of chat.items) {
+        if (item.kind === "artifact" && item.isStreaming) {
+          item.isStreaming = false;
+        }
+        // Mark any dangling non-terminal task state as unknown so the spinner stops.
+        if (
+          item.kind === "task-status" &&
+          (item.state === "working" || item.state === "submitted")
+        ) {
+          item.state = "unknown";
+        }
+      }
+    },
+  },
+});
+
+export const {
+  hydrateChats,
+  addChat,
+  importChat,
+  setActiveChat,
+  removeChat,
+  renameChat,
+  setChatArchived,
+  setChatPinned,
+  cloneChat,
+  addUserMessage,
+  applyStatusUpdate,
+  applyArtifactUpdate,
+  applyToolCall,
+  applyAgentMessage,
+  appendExecutionEvent,
+  sanitizeStaleStreaming,
+} = chatsSlice.actions;
+
+export default chatsSlice.reducer;

package/lib/features/chats/compareRuns.ts

@@ -0,0 +1,136 @@
+import type { Chat, ArtifactItem } from "./chatsSlice";
+import { getArtifactText, summarizeTextDiff, type TextDiffSummary } from "./artifactRevision";
+import { partsToPlainText } from "@/lib/a2a/parts";
+
+export interface ComparableArtifact {
+  key: string;
+  label: string;
+  text: string;
+}
+
+export interface RunSnapshot {
+  chatId: string;
+  title: string;
+  agentName: string;
+  agentUrl: string;
+  latestPrompt: string;
+  latestPromptMetadata?: Record<string, string>;
+  latestOutput: string;
+  artifacts: ComparableArtifact[];
+  durationMs: number | null;
+}
+
+export interface ArtifactComparison {
+  key: string;
+  label: string;
+  left: string;
+  right: string;
+  diff: TextDiffSummary;
+}
+
+export interface RunComparison {
+  left: RunSnapshot;
+  right: RunSnapshot;
+  sameAgent: boolean;
+  samePrompt: boolean;
+  outputDiff: TextDiffSummary;
+  artifactComparisons: ArtifactComparison[];
+  durationDeltaMs: number | null;
+}
+
+function getLatestPrompt(chat: Chat) {
+  return chat.items.findLast((item) => item.kind === "user-message");
+}
+
+function getLatestOutput(chat: Chat): string {
+  const agentMessage = chat.items.findLast((item) => item.kind === "agent-message");
+  if (agentMessage) {
+    return agentMessage.parts
+      .filter((part): part is Extract<(typeof agentMessage.parts)[number], { kind: "text" }> => part.kind === "text")
+      .map((part) => part.text)
+      .join("");
+  }
+
+  const artifact = chat.items.findLast((item) => item.kind === "artifact");
+  return artifact ? getArtifactText(artifact) : "";
+}
+
+function getComparableArtifacts(chat: Chat): ComparableArtifact[] {
+  return chat.items
+    .filter((item): item is ArtifactItem => item.kind === "artifact")
+    .filter((item) => item.parts.every((part) => part.kind === "text"))
+    .map((item) => ({
+      key: item.name ?? item.id,
+      label: item.name ?? item.id,
+      text: getArtifactText(item),
+    }));
+}
+
+function getDurationMs(chat: Chat): number | null {
+  const outgoing = chat.executionEvents.find((event) => event.kind === "outgoing-message");
+  const terminal = [...chat.executionEvents]
+    .reverse()
+    .find(
+      (event) =>
+        event.kind === "task-status" &&
+        (event.details?.state === "completed" ||
+          event.details?.state === "failed" ||
+          event.details?.state === "rejected" ||
+          event.details?.state === "canceled"),
+    );
+
+  if (!outgoing || !terminal) return null;
+  return terminal.timestamp - outgoing.timestamp;
+}
+
+function toSnapshot(chat: Chat): RunSnapshot {
+  const latestPrompt = getLatestPrompt(chat);
+  return {
+    chatId: chat.id,
+    title: chat.title,
+    agentName: chat.agentName,
+    agentUrl: chat.agentUrl,
+    latestPrompt: latestPrompt ? partsToPlainText(latestPrompt.parts) : "",
+    latestPromptMetadata: latestPrompt?.metadata,
+    latestOutput: getLatestOutput(chat),
+    artifacts: getComparableArtifacts(chat),
+    durationMs: getDurationMs(chat),
+  };
+}
+
+export function compareRuns(leftChat: Chat, rightChat: Chat): RunComparison {
+  const left = toSnapshot(leftChat);
+  const right = toSnapshot(rightChat);
+
+  const artifactKeys = new Set([
+    ...left.artifacts.map((artifact) => artifact.key),
+    ...right.artifacts.map((artifact) => artifact.key),
+  ]);
+
+  const artifactComparisons = [...artifactKeys].map((key) => {
+    const leftArtifact = left.artifacts.find((artifact) => artifact.key === key);
+    const rightArtifact = right.artifacts.find((artifact) => artifact.key === key);
+    const leftText = leftArtifact?.text ?? "";
+    const rightText = rightArtifact?.text ?? "";
+    return {
+      key,
+      label: leftArtifact?.label ?? rightArtifact?.label ?? key,
+      left: leftText,
+      right: rightText,
+      diff: summarizeTextDiff(leftText, rightText),
+    };
+  });
+
+  return {
+    left,
+    right,
+    sameAgent: left.agentUrl === right.agentUrl,
+    samePrompt: left.latestPrompt === right.latestPrompt,
+    outputDiff: summarizeTextDiff(left.latestOutput, right.latestOutput),
+    artifactComparisons,
+    durationDeltaMs:
+      left.durationMs != null && right.durationMs != null
+        ? right.durationMs - left.durationMs
+        : null,
+  };
+}

package/lib/features/chats/rerunDraft.ts

@@ -0,0 +1,27 @@
+import type { Part } from "@a2a-js/sdk";
+
+export interface RerunDraft {
+  parts: Part[];
+  metadata?: Record<string, string>;
+}
+
+function storageKey(chatId: string) {
+  return `a2a-ui:rerun:${chatId}`;
+}
+
+export function queueRerunDraft(chatId: string, draft: RerunDraft) {
+  if (typeof window === "undefined") return;
+  window.sessionStorage.setItem(storageKey(chatId), JSON.stringify(draft));
+}
+
+export function consumeRerunDraft(chatId: string): RerunDraft | null {
+  if (typeof window === "undefined") return null;
+  const raw = window.sessionStorage.getItem(storageKey(chatId));
+  if (!raw) return null;
+  window.sessionStorage.removeItem(storageKey(chatId));
+  try {
+    return JSON.parse(raw) as RerunDraft;
+  } catch {
+    return null;
+  }
+}