@springbrand/message-panel 0.1.3-alpha.1 → 0.1.3-alpha.3

package/cloud-os/chat/transcript-model.ts

@@ -0,0 +1,672 @@
+import type { UIMessage } from "ai";
+import type { OrbState } from "thinking-orbs";
+import {
+  askUserOutcome,
+  buildToolCallGroups,
+  toCloudOsToolCall,
+  type CloudOsToolCall,
+  type ToolCallGroup,
+} from "./tool-presentation";
+
+/**
+ * UIMessage → cloud-os 展示条目。
+ *
+ * cloudflare-os-main 的 `buildChatDisplayEntries` 吃的是 gadgets 自己的
+ * `AiChatMessage`(离散消息类型 + 独立的 toolCalls 数组)。UIMessage 的事实是
+ * **一条 assistant 消息里一个有序 parts 数组**,所以这里把「消息类型分派」换成
+ * 「按 parts 顺序切块」:连续的工具 part 攒成一个 ToolCallGroup,遇到非工具
+ * part 就 flush。原文件的行间距规则(rhythmTopClass)照搬。
+ */
+
+type UnknownRecord = Record<string, unknown>;
+
+export interface CloudOsMessageMetadata extends UnknownRecord {
+  authorDisplayName?: string;
+  completedAt?: number;
+  createdAt?: number;
+  error?: string;
+  interruptedByUser?: boolean;
+  turnDurationMs?: number;
+  turnStartedAt?: number;
+  turnStatus?: string;
+}
+
+export interface CloudOsAttachment {
+  url: string;
+  filename?: string;
+  mediaType?: string;
+}
+
+export interface PlanStep {
+  text: string;
+  status: "pending" | "in_progress" | "done";
+}
+
+export type AssistantBlock =
+  | { kind: "reasoning"; key: string; text: string }
+  | { kind: "text"; key: string; text: string }
+  | { kind: "toolGroup"; key: string; group: ToolCallGroup }
+  | { kind: "plan"; key: string; steps: PlanStep[]; running: boolean }
+  // 答案就在 call.output 里(`ask_user` 是 client-settled tool,用户点选后
+  // 经 respondToolInteraction 回写成这次调用的结果)。曾经靠扫下一条用户消息
+  // 推断,那是有损且会误认无关消息的,已彻底删除。
+  // `pending` 是这张卡还在等人 —— 卡片据此决定能不能点,活动指示器据此决定
+  // 该不该出现,同一条判据(askUserOutcome)算一次。
+  | { kind: "askUser"; key: string; call: CloudOsToolCall; pending: boolean }
+  | { kind: "suggestions"; key: string; items: string[] }
+  | { kind: "schedule"; key: string; call: CloudOsToolCall }
+  | { kind: "approval"; key: string; call: CloudOsToolCall; approvalId: string }
+  | { kind: "parallel"; key: string; label: string; tools: ParallelTool[] }
+  | { kind: "subagents"; key: string; agents: SubAgentView[] }
+  | { kind: "image"; key: string; src: string; alt: string }
+  | { kind: "error"; key: string; title: string; body?: string };
+
+export interface ParallelTool {
+  label: string;
+  status: "pending" | "running" | "done" | "failed";
+  meta?: string;
+}
+
+export interface SubAgentView {
+  name: string;
+  summary?: string;
+  status: "pending" | "running" | "done" | "failed";
+}
+
+export type CloudOsEntry =
+  | {
+      type: "user";
+      key: string;
+      messageId: string;
+      text: string;
+      attachments: CloudOsAttachment[];
+      authorName?: string;
+      timestamp?: number;
+    }
+  | {
+      type: "slashCommand";
+      key: string;
+      messageId: string;
+      text: string;
+      timestamp?: number;
+    }
+  | { type: "localCommandOutput"; key: string; messageId: string; text: string }
+  | { type: "notice"; key: string; messageId: string; text: string }
+  | { type: "compactionBoundary"; key: string; messageId: string; summary: string }
+  | {
+      type: "assistant";
+      key: string;
+      messageId: string;
+      blocks: AssistantBlock[];
+      copyText: string;
+      timestamp?: number;
+      terminal?: { kind: "interrupted" | "error"; title: string; body?: string };
+    };
+
+// ── 小工具 ──────────────────────────────────────────────────────────────────
+
+function recordOf(value: unknown): UnknownRecord {
+  return value != null && typeof value === "object"
+    ? (value as UnknownRecord)
+    : {};
+}
+
+function dataOf(part: unknown): UnknownRecord {
+  const record = recordOf(part);
+  return recordOf(record.data ?? record.input ?? record);
+}
+
+function nonNegativeNumber(value: unknown): number | undefined {
+  return typeof value === "number" && Number.isFinite(value) && value >= 0
+    ? value
+    : undefined;
+}
+
+export function cloudOsMetadata(message: UIMessage): CloudOsMessageMetadata {
+  return recordOf(message.metadata) as CloudOsMessageMetadata;
+}
+
+export function messageText(message: UIMessage): string {
+  return message.parts
+    .filter(
+      (part): part is { type: "text"; text: string } =>
+        part.type === "text" && typeof part.text === "string" &&
+        part.text.trim().length > 0,
+    )
+    .map((part) => part.text)
+    .join("\n");
+}
+
+export function formatClockTime(timestamp: number): string {
+  return new Date(timestamp).toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit",
+  });
+}
+
+export function formatFullTimestamp(timestamp: number): string {
+  return new Date(timestamp).toLocaleString([], {
+    dateStyle: "medium",
+    timeStyle: "short",
+  });
+}
+
+function toolNameOf(part: unknown): string | null {
+  const type = String(recordOf(part).type ?? "");
+  if (type === "dynamic-tool") {
+    const name = recordOf(part).toolName;
+    return typeof name === "string" ? name : "dynamic";
+  }
+  return type.startsWith("tool-") ? type.slice(5) : null;
+}
+
+function dataKindOf(part: unknown): string | null {
+  const type = String(recordOf(part).type ?? "");
+  return type.startsWith("data-") ? type.slice(5).replaceAll("-", "_") : null;
+}
+
+function planStepsOf(input: UnknownRecord): PlanStep[] {
+  const raw = Array.isArray(input.steps)
+    ? input.steps
+    : Array.isArray(input.todos)
+      ? input.todos
+      : [];
+  return raw.map((item) => {
+    const step = recordOf(item);
+    const status = String(step.status ?? "pending");
+    return {
+      text: String(step.text ?? step.content ?? step.activeForm ?? "Untitled step"),
+      status:
+        status === "in_progress"
+          ? "in_progress"
+          : status === "done" || status === "completed"
+            ? "done"
+            : "pending",
+    };
+  });
+}
+
+function stringList(value: unknown): string[] {
+  return Array.isArray(value)
+    ? value.filter((item): item is string => typeof item === "string")
+    : [];
+}
+
+function normalizeStatus(value: unknown): ParallelTool["status"] {
+  const status = String(value ?? "");
+  if (status === "running" || status === "done" || status === "failed") return status;
+  return "pending";
+}
+
+// ── 独立消息(非 assistant 回合)判定 ────────────────────────────────────────
+
+function standaloneEntry(
+  message: UIMessage,
+  index: number,
+): CloudOsEntry | null {
+  const metadata = cloudOsMetadata(message);
+  for (const part of message.parts) {
+    const kind = dataKindOf(part);
+    if (kind === null) continue;
+    const data = dataOf(part);
+    const text = String(data.text ?? data.command ?? data.output ?? "").trim();
+    if (kind === "slash_command") {
+      return {
+        type: "slashCommand",
+        key: `${message.id}-${index}`,
+        messageId: message.id,
+        text,
+        timestamp: nonNegativeNumber(metadata.createdAt),
+      };
+    }
+    if (kind === "local_command_output") {
+      return {
+        type: "localCommandOutput",
+        key: `${message.id}-${index}`,
+        messageId: message.id,
+        text,
+      };
+    }
+    if (kind === "compact_summary") {
+      return {
+        type: "compactionBoundary",
+        key: `${message.id}-${index}`,
+        messageId: message.id,
+        summary: text,
+      };
+    }
+    if (kind === "notice") {
+      return {
+        type: "notice",
+        key: `${message.id}-${index}`,
+        messageId: message.id,
+        text,
+      };
+    }
+  }
+  return null;
+}
+
+// ── assistant 回合切块 ──────────────────────────────────────────────────────
+
+function assistantBlocks(
+  message: UIMessage,
+  isActive: boolean,
+  showThinkingTraces: boolean,
+  approvalIdOf: (part: unknown) => string | undefined,
+): AssistantBlock[] {
+  const blocks: AssistantBlock[] = [];
+  let pendingCalls: CloudOsToolCall[] = [];
+
+  const flush = () => {
+    if (pendingCalls.length === 0) return;
+    for (const group of buildToolCallGroups(pendingCalls)) {
+      blocks.push({ kind: "toolGroup", key: group.key, group });
+    }
+    pendingCalls = [];
+  };
+
+  message.parts.forEach((part, partIndex) => {
+    const key = `${message.id}:${partIndex}`;
+    const record = recordOf(part);
+    const type = String(record.type ?? "");
+
+    if (type === "step-start") return;
+
+    if (type === "text") {
+      const text = String(record.text ?? "").trim();
+      if (!text) return;
+      flush();
+      blocks.push({ kind: "text", key, text });
+      return;
+    }
+
+    if (type === "reasoning") {
+      const text = String(record.text ?? "").trim();
+      if (!text || !showThinkingTraces) return;
+      flush();
+      blocks.push({ kind: "reasoning", key, text });
+      return;
+    }
+
+    const dataKind = dataKindOf(part);
+    if (dataKind === "error") {
+      const data = dataOf(part);
+      flush();
+      blocks.push({
+        kind: "error",
+        key,
+        title: String(data.title ?? "Error"),
+        body: String(data.body ?? data.message ?? "") || undefined,
+      });
+      return;
+    }
+    if (dataKind === "parallel") {
+      const data = dataOf(part);
+      flush();
+      blocks.push({
+        kind: "parallel",
+        key,
+        label: String(data.label ?? "Parallel tasks"),
+        tools: (Array.isArray(data.tools) ? data.tools : []).map((item) => {
+          const tool = recordOf(item);
+          return {
+            label: String(tool.label ?? "Task"),
+            status: normalizeStatus(tool.status),
+            meta: typeof tool.meta === "string" ? tool.meta : undefined,
+          };
+        }),
+      });
+      return;
+    }
+    if (dataKind === "subagents") {
+      const data = dataOf(part);
+      flush();
+      blocks.push({
+        kind: "subagents",
+        key,
+        agents: (Array.isArray(data.agents) ? data.agents : []).map((item) => {
+          const agent = recordOf(item);
+          return {
+            name: String(agent.name ?? "Sub-agent"),
+            summary:
+              typeof agent.summary === "string" && agent.summary
+                ? agent.summary
+                : undefined,
+            status: normalizeStatus(agent.status),
+          };
+        }),
+      });
+      return;
+    }
+    if (dataKind === "image" || type === "file") {
+      const data = dataOf(part);
+      const src = String(data.src ?? data.url ?? record.url ?? "");
+      const mediaType = String(record.mediaType ?? data.mediaType ?? "");
+      if (src && (dataKind === "image" || mediaType.startsWith("image/"))) {
+        flush();
+        blocks.push({
+          kind: "image",
+          key,
+          src,
+          alt: String(data.alt ?? data.filename ?? record.filename ?? "Image"),
+        });
+      }
+      return;
+    }
+
+    const toolName = toolNameOf(part);
+    if (toolName === null) return;
+
+    const call = toCloudOsToolCall(part, key, isActive);
+
+    if (call.awaitingApproval) {
+      const approvalId = approvalIdOf(part);
+      if (approvalId !== undefined) {
+        flush();
+        blocks.push({ kind: "approval", key, call, approvalId });
+        return;
+      }
+    }
+
+    if (call.kind === "tasks") {
+      const steps = planStepsOf(call.input);
+      if (steps.length > 0) {
+        flush();
+        blocks.push({ kind: "plan", key, steps, running: call.running });
+        return;
+      }
+    }
+
+    if (call.kind === "ask-user") {
+      flush();
+      blocks.push({
+        kind: "askUser",
+        key,
+        call,
+        pending: askUserOutcome(call).kind === "pending",
+      });
+      return;
+    }
+
+    if (call.kind === "suggestions") {
+      const items = stringList(call.input.items ?? dataOf(part).items);
+      if (items.length > 0) {
+        flush();
+        blocks.push({ kind: "suggestions", key, items });
+        return;
+      }
+    }
+
+    if (call.kind === "schedule" && call.toolName === "schedule") {
+      flush();
+      blocks.push({ kind: "schedule", key, call });
+      return;
+    }
+
+    pendingCalls.push(call);
+  });
+
+  flush();
+  return blocks;
+}
+
+const USER_STOP_REASON = "Stopped by user";
+
+function terminalOf(
+  message: UIMessage,
+): { kind: "interrupted" | "error"; title: string; body?: string } | undefined {
+  const metadata = cloudOsMetadata(message);
+  if (metadata.interruptedByUser === true) {
+    return { kind: "interrupted", title: USER_STOP_REASON };
+  }
+  if (metadata.turnStatus === "aborted" && metadata.error === USER_STOP_REASON) {
+    return undefined;
+  }
+  if (metadata.turnStatus === "error" || metadata.error) {
+    return {
+      kind: "error",
+      title: "Error",
+      body: metadata.error ?? "The response failed.",
+    };
+  }
+  return undefined;
+}
+
+export interface BuildEntriesOptions {
+  messages: readonly UIMessage[];
+  /** streaming/submitted 时最后一条 assistant 消息才算「活着」。 */
+  isActive: boolean;
+  showThinkingTraces: boolean;
+  /** 把某个 part 映射成待授权 id;返回 undefined 表示这条不走原位授权。 */
+  approvalIdOf?: (part: unknown) => string | undefined;
+}
+
+export function buildCloudOsEntries({
+  messages,
+  isActive,
+  showThinkingTraces,
+  approvalIdOf = () => undefined,
+}: BuildEntriesOptions): CloudOsEntry[] {
+  const entries: CloudOsEntry[] = [];
+  const lastAssistantIndex = (() => {
+    for (let index = messages.length - 1; index >= 0; index -= 1) {
+      if (messages[index].role === "assistant") return index;
+    }
+    return -1;
+  })();
+
+  messages.forEach((message, index) => {
+    if (message.role === "system") return;
+
+    const standalone = standaloneEntry(message, index);
+    if (standalone) {
+      entries.push(standalone);
+      return;
+    }
+
+    const metadata = cloudOsMetadata(message);
+
+    if (message.role === "user") {
+      const text = messageText(message);
+      const attachments = message.parts
+        .filter((part) => part.type === "file")
+        .map((part) => {
+          const record = recordOf(part);
+          return {
+            url: String(record.url ?? ""),
+            filename:
+              typeof record.filename === "string" ? record.filename : undefined,
+            mediaType:
+              typeof record.mediaType === "string" ? record.mediaType : undefined,
+          };
+        });
+      if (!text && attachments.length === 0) return;
+      entries.push({
+        type: "user",
+        key: `user-${message.id}-${index}`,
+        messageId: message.id,
+        text,
+        attachments,
+        authorName: metadata.authorDisplayName,
+        timestamp:
+          nonNegativeNumber(metadata.createdAt) ??
+          nonNegativeNumber(metadata.completedAt),
+      });
+      return;
+    }
+
+    const blocks = assistantBlocks(
+      message,
+      isActive && index === lastAssistantIndex,
+      showThinkingTraces,
+      approvalIdOf,
+    );
+    const terminal = terminalOf(message);
+    if (blocks.length === 0 && terminal === undefined) return;
+    entries.push({
+      type: "assistant",
+      key: `assistant-${message.id}-${index}`,
+      messageId: message.id,
+      blocks,
+      copyText: messageText(message),
+      timestamp:
+        nonNegativeNumber(metadata.completedAt) ??
+        nonNegativeNumber(metadata.createdAt),
+      terminal,
+    });
+  });
+
+  return dropSupersededPlans(entries);
+}
+
+/**
+ * update_plan 是**整份快照覆盖**,不是增量事件 —— 一次任务里每推进一步就会再发一份
+ * 完整计划。原样按序渲染会把同一份计划画四遍(0/3、1/3、2/3、3/3),只有最后那份
+ * 是当前事实。所以整条会话里只保留最后一份计划快照。
+ */
+function dropSupersededPlans(entries: CloudOsEntry[]): CloudOsEntry[] {
+  let lastPlanEntry = -1;
+  let lastPlanBlock = -1;
+  entries.forEach((entry, entryIndex) => {
+    if (entry.type !== "assistant") return;
+    entry.blocks.forEach((block, blockIndex) => {
+      if (block.kind !== "plan") return;
+      lastPlanEntry = entryIndex;
+      lastPlanBlock = blockIndex;
+    });
+  });
+  if (lastPlanEntry === -1) return entries;
+
+  return entries.map((entry, entryIndex) =>
+    entry.type === "assistant"
+      ? {
+          ...entry,
+          blocks: entry.blocks.filter(
+            (block, blockIndex) =>
+              block.kind !== "plan" ||
+              (entryIndex === lastPlanEntry && blockIndex === lastPlanBlock),
+          ),
+        }
+      : entry,
+  );
+}
+
+// ── 活动指示(本回合此刻在干什么)────────────────────────────────────────────
+
+/**
+ * 底部活动指示器要显示的动画与文案。
+ */
+export interface CloudOsActivity {
+  state: OrbState;
+  label: string;
+}
+
+/**
+ * 尾巴是否**自己会说话** —— 有它在动,就不该再挂一个活动指示器。
+ *
+ * 正在流的正文/思考、还在跑的工具组或计划,以及一张**还等着你作答**的
+ * `ask_user` 卡都算:前三者自身就有动效,最后一个等的是人不是模型,这时候
+ * 显示「Thinking」是在撒谎。
+ */
+function isLiveBlock(block: AssistantBlock): boolean {
+  switch (block.kind) {
+    case "text":
+    case "reasoning":
+      return true;
+    case "toolGroup":
+      return block.group.hasRunning;
+    case "plan":
+      return block.running;
+    case "askUser":
+      return block.pending;
+    // approval 块只在 awaitingApproval 时才建出来,所以它在场就是在等人。
+    case "approval":
+      return true;
+    case "parallel":
+      return block.tools.some((tool) => tool.status === "running");
+    case "subagents":
+      return block.agents.some((agent) => agent.status === "running");
+    default:
+      return false;
+  }
+}
+
+// 已结算的尾巴 → 此刻真正在发生的事。措辞刻意只说得出口的那部分:
+// 工具跑完了,模型在读它的输出;卡答完了,模型在接你的答案。
+function activityForTail(block: AssistantBlock | undefined): CloudOsActivity {
+  if (!block) return { state: "solving", label: "Thinking…" };
+  if (block.kind === "askUser") {
+    return { state: "solving", label: "Picking up your answer…" };
+  }
+  if (block.kind === "toolGroup") {
+    const kind = block.group.calls.at(-1)?.kind;
+    return kind !== undefined &&
+        ["web-search", "web-fetch", "grep", "glob", "list", "read"].includes(
+          kind,
+        )
+      ? { state: "searching", label: "Reading results…" }
+      : { state: "working", label: "Working…" };
+  }
+  return { state: "working", label: "Working…" };
+}
+
+/**
+ * 本回合此刻该显示什么活动;`null` = 尾巴自己会说话,别再叠一个。
+ *
+ * @remarks
+ * 判据是「**尾巴有没有活口**」,不是「本回合有没有出过内容」。后者曾经是这里的
+ * 写法,于是答完 `ask_user`(卡片变成 Submitted,读起来就是"结束了")到模型下一
+ * 个 chunk 之间整屏没有任何在跑的迹象 —— 而那段恰好是最长的一次 TTFT,看起来
+ * 就是卡死。凡是尾巴为**已结算卡片**的断档都是同一个洞,这里一并补上。
+ */
+export function deriveTurnActivity(
+  entries: readonly CloudOsEntry[],
+  options: { isActive: boolean; hasPendingSteer?: boolean },
+): CloudOsActivity | null {
+  if (!options.isActive) return null;
+  const tail = entries.at(-1) ?? null;
+  const block = tail?.type === "assistant" ? tail.blocks.at(-1) : undefined;
+  if (block && isLiveBlock(block)) return null;
+  return options.hasPendingSteer
+    ? { state: "solving", label: "Waiting for the current step to finish…" }
+    : activityForTail(block);
+}
+
+// ── 行间距节奏(照搬原 rhythmTopClass)──────────────────────────────────────
+
+function isUserEntry(entry: CloudOsEntry): boolean {
+  return entry.type === "user" || entry.type === "slashCommand";
+}
+
+function startsWithWorkRow(entry: CloudOsEntry): boolean {
+  return (
+    entry.type === "assistant" &&
+    entry.blocks[0] !== undefined &&
+    entry.blocks[0].kind === "toolGroup"
+  );
+}
+
+function endsInWorkRow(entry: CloudOsEntry): boolean {
+  return (
+    entry.type === "assistant" &&
+    entry.blocks.at(-1) !== undefined &&
+    entry.blocks.at(-1)!.kind === "toolGroup"
+  );
+}
+
+/**
+ * 相邻两条之间的上间距。原则(原文件注释):用户消息前后留最大的气口;
+ * 两条工作行之间贴紧;其余取中间档。
+ */
+export function rhythmTopClass(
+  previous: CloudOsEntry | null,
+  entry: CloudOsEntry,
+): string {
+  if (!previous) return "";
+  if (isUserEntry(entry)) return "mt-8";
+  if (isUserEntry(previous)) return "mt-5";
+  if (endsInWorkRow(previous) && startsWithWorkRow(entry)) return "mt-2";
+  if (previous.type === "notice" || entry.type === "notice") return "mt-4";
+  return "mt-4";
+}