refactor(ui): share chat rendering across GUI and WebUI

crates/agent-gateway/test/webui/chat-turn-queue.test.mjs

@@ -5,7 +5,9 @@ import { createWebModuleLoader } from "../helpers/load-web-module.mjs";
 // The chat turn queue itself lives in the desktop GUI (the gateway relays
 // snapshots); the web module keeps only the composer-side content check.
 const loader = createWebModuleLoader();
-const { queuedChatTurnHasContent } = loader.loadModule("src/pages/chat/queue/chatTurnQueue.ts");
+const { queuedChatTurnHasContent } = loader.loadModule(
+  "@liveagent/ui/lib/chat/queuedChatTurn.ts",
+);
 
 function draft(overrides = {}) {
   return {

crates/agent-gateway/test/webui/history-chat-ui.test.mjs

@@ -794,7 +794,7 @@ test("GatewayTranscript renders folded and live rows in one virtualized list", (
           return { type: "ImagePreview", props };
         },
       },
-      "@/pages/chat/AssistantBubble": {
+      "@liveagent/ui/components/chat/AssistantBubble": {
         AssistantAvatar() {
           return { type: "AssistantAvatar", props: {} };
         },

crates/agent-gateway/web/src/agent-ui-adapters/assistantBubble.ts

@@ -0,0 +1,25 @@
+import type { AskUserQuestionAnswer } from "@liveagent/ui/lib/chat/askUserQuestion";
+import { readAskUserQuestionDeadlineAt } from "@liveagent/ui/lib/chat/askUserQuestion";
+import { readToolApprovalPending } from "@liveagent/ui/lib/chat/toolApprovalArgs";
+import { submitAskUserQuestionAnswer } from "../lib/chat/askUserQuestionBridge";
+
+export const deferLargeToolImages = true;
+export const retainRunningToolContent = false;
+
+export function usePendingToolApproval(
+  _toolCallId: string,
+  toolArguments: Record<string, unknown>,
+) {
+  return readToolApprovalPending(toolArguments);
+}
+
+export function readAskUserQuestionDeadline(
+  _toolCallId: string,
+  toolArguments: Record<string, unknown>,
+) {
+  return readAskUserQuestionDeadlineAt(toolArguments) ?? undefined;
+}
+
+export function submitAskUserQuestionAnswers(toolCallId: string, answers: AskUserQuestionAnswer[]) {
+  return submitAskUserQuestionAnswer(toolCallId, answers);
+}

crates/agent-gateway/web/src/app/GatewayApp.tsx

@@ -1,5 +1,6 @@
 import { ApplicationView } from "@liveagent/ui/application/ApplicationView";
 import { AppErrorBoundary } from "@liveagent/ui/components/AppErrorBoundary";
+import { FileDropOverlay } from "@liveagent/ui/components/chat/FileDropOverlay";
 import type {
   MentionComposerDraft,
   MentionComposerHandle,
@@ -17,9 +18,11 @@ import { RightDockPanel } from "@liveagent/ui/components/project-tools/RightDock
 import { Button } from "@liveagent/ui/components/ui/button";
 import { useConfirmDialog } from "@liveagent/ui/components/ui/confirm-dialog";
 import { ScrollArea } from "@liveagent/ui/components/ui/scroll-area";
+import { WorkspaceOverlayHost } from "@liveagent/ui/components/workspace-editor/WorkspaceOverlayHost";
 import { LocaleContext, t as translate } from "@liveagent/ui/i18n/index";
 import { normalizeLogicalLineEndings } from "@liveagent/ui/lib/chat/composerText";
 import { openChatFileLink } from "@liveagent/ui/lib/chat/openChatFileLink";
+import { queuedChatTurnHasContent } from "@liveagent/ui/lib/chat/queuedChatTurn";
 import { selectLatestTaskProgress } from "@liveagent/ui/lib/chat/taskProgress";
 import {
   readToolApprovalDeadlineAt,
@@ -29,6 +32,7 @@ import {
 import { memoryDeleteProject } from "@liveagent/ui/lib/memory/api";
 import { createUuid } from "@liveagent/ui/lib/shared/id";
 import { mergeAlwaysEnabledSkillNames } from "@liveagent/ui/lib/skills/index";
+import { useChatSkills } from "@liveagent/ui/lib/skills/useChatSkills";
 import { terminalSessionBelongsToProject } from "@liveagent/ui/lib/terminal/sessionStore";
 import type { TerminalSession } from "@liveagent/ui/lib/terminal/types";
 import {
@@ -140,8 +144,6 @@ import {
   workspaceProjectPathKey,
 } from "@/lib/settings";
 import { createGatewayWorkspaceActivityClient } from "@/lib/workspace-activity/gatewayWorkspaceActivityClient";
-import { queuedChatTurnHasContent } from "@/pages/chat/queue/chatTurnQueue";
-import { useChatSkills } from "@/pages/chat/useChatSkills";
 import type { SectionId } from "@/pages/settings/types";
 
 const LOCAL_DRAFT_PREFIX = "__local_draft__:";
@@ -225,7 +227,6 @@ import {
   SHARED_HISTORY_LIST_PAGE_SIZE,
   SKILLS_HUB_BROWSER_TITLE,
 } from "./constants";
-import { FileDropOverlay } from "./FileDropOverlay";
 import { HistorySwitchLoadingOverlay } from "./HistorySwitchLoadingOverlay";
 import {
   createWorkspaceProjectFromPath,
@@ -249,7 +250,6 @@ import {
 } from "./sidebar/gatewaySidebarAvailability";
 import type { ModelProviderSource, OverlayState, SendChatFn, SendChatOptions } from "./types";
 import { UserMenu } from "./UserMenu";
-import { WorkspaceOverlayHost } from "./WorkspaceOverlayHost";
 
 const STALE_HISTORY_RETRY_INITIAL_DELAY_MS = 1_000;
 const STALE_HISTORY_RETRY_MAX_DELAY_MS = 30_000;

crates/agent-gateway/web/src/components/GatewayTranscript.tsx

@@ -1,3 +1,11 @@
+import {
+  AssistantAvatar,
+  AssistantBubble,
+  AssistantStatus,
+  CompactingText,
+  RetryDetailsBlock,
+  VibingText,
+} from "@liveagent/ui/components/chat/AssistantBubble";
 import { ChatEmptyState } from "@liveagent/ui/components/chat/ChatEmptyState";
 import { getUploadedFileTypeIcon } from "@liveagent/ui/components/chat/fileTypeIcons";
 import { ImagePreview, type ImagePreviewSlide } from "@liveagent/ui/components/chat/ImagePreview";
@@ -56,14 +64,6 @@ import {
 } from "@/lib/chat/userMessageContent";
 import { DEFAULT_CHAT_TRANSCRIPT_WIDTH } from "@/lib/settings";
 import { extractLiveRange } from "@/lib/transcript-virtual/liveRangeExtractor";
-import {
-  AssistantAvatar,
-  AssistantBubble,
-  AssistantStatus,
-  CompactingText,
-  RetryDetailsBlock,
-  VibingText,
-} from "@/pages/chat/AssistantBubble";
 import type { RetryAttemptRecord, TranscriptRow } from "../lib/chat/transcript/types";
 import type { SectionId } from "../pages/settings/types";
 import { CheckCircle2, ChevronDown, Loader2, X } from "./icons";

crates/agent-gateway/web/src/lib/chat/assistantBubbleAdapter.ts

@@ -0,0 +1,33 @@
+export type { ImageContent, ToolResultMessage } from "../agentTypes";
+export type {
+  DeleteResultDetails,
+  DisplayImageItemDetails,
+  DisplayImageResultDetails,
+  EditResultDetails,
+  GlobResultDetails,
+  GrepResultDetails,
+  ListResultDetails,
+  McpManagerResultDetails,
+  ReadDocumentResultDetails,
+  ReadImageResultDetails,
+  ReadNotebookResultDetails,
+  ReadPdfResultDetails,
+  ReadTextResultDetails,
+  SkillsManagerResultDetails,
+  WriteResultDetails,
+} from "../tools/builtinTypes";
+export { normalizeLiveToolStatus, VIBING_STATUS } from "./chatPageHelpers";
+export { deriveFileChangeStats } from "./fileChangeStats";
+export type { HostedSearchBlock } from "./hostedSearch";
+export { deriveFileToolPreview, FILE_TOOL_TEXT_FIELDS } from "./toolPreview";
+export type { RetryAttemptRecord } from "./transcript/types";
+export {
+  previewText,
+  safeStringify,
+  shouldDisplayToolTraceItem,
+  summarizeToolCall,
+  type ToolTraceItem,
+  toolCallArgsForDisplay,
+  toolResultMessageToText,
+  type UiRound,
+} from "./uiMessages";

crates/agent-gateway/web/src/lib/chat/changedFilesAdapter.ts

@@ -1 +1,2 @@
 export type { ChangedFileEntry, ChangedFilesSummary } from "./changedFiles";
+export { collectChangedFiles } from "./changedFiles";

crates/agent-gateway/web/test/assistant-bubble-utils.test.mjs

@@ -8,7 +8,7 @@ const rootDir = fileURLToPath(new URL("../", import.meta.url));
 const loader = createWebModuleLoader({ rootDir });
 const { BUILTIN_TOOL_CATALOG } = loader.loadModule("@liveagent/ui/lib/tools/builtinToolCatalog.ts");
 const { groupRoundBlocks, isBuiltinShareToolName } = loader.loadModule(
-  "src/pages/chat/assistant-bubble/assistantBubbleUtils.ts",
+  "@liveagent/ui/components/chat/assistant-bubble/assistantBubbleUtils.ts",
 );
 
 test("shared history recognizes every catalog tool as builtin", () => {

crates/agent-gateway/web/test/chat-file-links.test.mjs

@@ -84,16 +84,21 @@ test("Gateway historical and streaming rows keep the explicit file-open prop cha
     "../src/app/GatewayApp.tsx",
     "../src/components/GatewayTranscript.tsx",
     "../../../agent-ui/src/components/chat/ThinkingActivity.tsx",
-    "../src/pages/chat/AssistantBubble.tsx",
-    "../src/pages/chat/assistant-bubble/RoundContent.tsx",
+    "../../../agent-ui/src/components/chat/AssistantBubble.tsx",
+    "../../../agent-ui/src/components/chat/assistant-bubble/RoundContent.tsx",
   ];
   for (const relativePath of files) {
     const source = fs.readFileSync(fileURLToPath(new URL(relativePath, import.meta.url)), "utf8");
     assert.match(source, /onOpenFileLink/, relativePath);
   }
 
   const roundContent = fs.readFileSync(
-    fileURLToPath(new URL("../src/pages/chat/assistant-bubble/RoundContent.tsx", import.meta.url)),
+    fileURLToPath(
+      new URL(
+        "../../../agent-ui/src/components/chat/assistant-bubble/RoundContent.tsx",
+        import.meta.url,
+      ),
+    ),
     "utf8",
   );
   assert.match(roundContent, /isStreaming \? "streaming" : "static"/);

crates/agent-gateway/web/test/live-markdown-caret.test.mjs

@@ -3,7 +3,10 @@ import fs from "node:fs";
 import test from "node:test";
 
 const roundContentSource = fs.readFileSync(
-  new URL("../src/pages/chat/assistant-bubble/RoundContent.tsx", import.meta.url),
+  new URL(
+    "../../../agent-ui/src/components/chat/assistant-bubble/RoundContent.tsx",
+    import.meta.url,
+  ),
   "utf8",
 );
 

crates/agent-gateway/web/test/task-progress.test.mjs

@@ -88,7 +88,12 @@ test("WebUI hides all task tool blocks while preserving ordinary tools", () => {
     false,
   );
   const source = readFileSync(
-    fileURLToPath(new URL("../src/pages/chat/assistant-bubble/RoundContent.tsx", import.meta.url)),
+    fileURLToPath(
+      new URL(
+        "../../../agent-ui/src/components/chat/assistant-bubble/RoundContent.tsx",
+        import.meta.url,
+      ),
+    ),
     "utf8",
   );
   assert.match(source, /groupedBlocks\.filter\(\(block\) => !isTaskToolBlock\(block\)\)/);

crates/agent-gateway/web/test/thinking-overlay-model.test.mjs

@@ -13,7 +13,10 @@ const componentSource = fs.readFileSync(
   "utf8",
 );
 const roundContentSource = fs.readFileSync(
-  new URL("../src/pages/chat/assistant-bubble/RoundContent.tsx", import.meta.url),
+  new URL(
+    "../../../agent-ui/src/components/chat/assistant-bubble/RoundContent.tsx",
+    import.meta.url,
+  ),
   "utf8",
 );