restyle chat ui

.github/workflows/desktop-release.yml

@@ -124,6 +124,15 @@ jobs:
             --password "$APPLE_APP_SPECIFIC_PASSWORD" \
             --validate
 
+      - name: Install deterministic DMG builder
+        run: |
+          set -euo pipefail
+          python3 -m venv "$RUNNER_TEMP/dmgbuild-venv"
+          "$RUNNER_TEMP/dmgbuild-venv/bin/python" -m pip install \
+            --disable-pip-version-check \
+            "dmgbuild==1.6.5"
+          echo "$RUNNER_TEMP/dmgbuild-venv/bin" >> "$GITHUB_PATH"
+
       - name: Build signed and notarized DMG
         env:
           APPLE_SIGNING_IDENTITY: ${{ secrets.APPLE_SIGNING_IDENTITY }}

Makefile

@@ -20,6 +20,10 @@ DESKTOP_LINUX_BUNDLES ?= appimage deb rpm
 DESKTOP_MACOS_APP_NAME ?= LiveAgent
 DESKTOP_MACOS_NOTARY_PROFILE ?= liveagent-notary
 DESKTOP_MACOS_TAURI_CONFIG ?= src-tauri/tauri.macos.conf.json
+DESKTOP_MACOS_DMG_SETTINGS ?= scripts/release/macos-dmg-settings.py
+DESKTOP_MACOS_DMG_BACKGROUND ?= $(AGENT_GUI_DIR)/src-tauri/dmg/background.png
+DESKTOP_MACOS_DMG_VOLUME_ICON ?= $(AGENT_GUI_DIR)/src-tauri/icons/icon.icns
+DESKTOP_MACOS_DMG_VERIFY ?= scripts/release/verify-macos-dmg.sh
 DESKTOP_WINDOWS_TAURI_CONFIG ?= src-tauri/tauri.windows.conf.json
 DESKTOP_RELEASE_TAURI_CONFIG ?= src-tauri/tauri.macos.release.conf.json
 DESKTOP_RELEASE_TAURI_CONFIG_FLAGS ?= --config $(DESKTOP_RELEASE_TAURI_CONFIG) $(if $(LIVEAGENT_TAURI_VERSION_CONFIG),--config $(LIVEAGENT_TAURI_VERSION_CONFIG))
@@ -49,22 +53,34 @@ build:
 desktop-build-macos: check-rust-target-$(DESKTOP_MACOS_TARGET)
 	pnpm --dir $(AGENT_GUI_DIR) tauri build --config $(DESKTOP_MACOS_TAURI_CONFIG) --target $(DESKTOP_MACOS_TARGET)
 
-# tauri-bundler skips the Finder AppleScript that writes the DMG .DS_Store (background,
-# window size, icon positions) whenever CI=true. Hosted macOS runners do have a GUI
-# session, so release builds opt back in — the same default tauri-action ships with.
+# tauri-bundler skips the Finder AppleScript that writes the DMG .DS_Store whenever
+# CI=true, so the bundler's own DMG is only used to locate the output path. The
+# release DMG is rebuilt from the signed .app with dmgbuild, which writes the Finder
+# layout (background, window size, icon positions) directly and deterministically.
 desktop-build-macos-release: check-rust-target-$(DESKTOP_MACOS_TARGET) check-macos-signing-identity check-macos-notary-profile
-	env -u APPLE_ID -u APPLE_PASSWORD -u APPLE_API_ISSUER -u APPLE_API_KEY -u APPLE_API_KEY_PATH APPLE_SIGNING_IDENTITY="$(APPLE_SIGNING_IDENTITY)" TAURI_BUNDLER_DMG_IGNORE_CI=true pnpm --dir $(AGENT_GUI_DIR) tauri build $(DESKTOP_RELEASE_TAURI_CONFIG_FLAGS) --target $(DESKTOP_MACOS_TARGET)
+	env -u APPLE_ID -u APPLE_PASSWORD -u APPLE_API_ISSUER -u APPLE_API_KEY -u APPLE_API_KEY_PATH APPLE_SIGNING_IDENTITY="$(APPLE_SIGNING_IDENTITY)" pnpm --dir $(AGENT_GUI_DIR) tauri build $(DESKTOP_RELEASE_TAURI_CONFIG_FLAGS) --target $(DESKTOP_MACOS_TARGET)
 	@set -e; \
 	app_path="target/$(DESKTOP_MACOS_TARGET)/release/bundle/macos/$(DESKTOP_MACOS_APP_NAME).app"; \
 	dmg_path="$$(find "target/$(DESKTOP_MACOS_TARGET)/release/bundle/dmg" -maxdepth 1 -name '$(DESKTOP_MACOS_APP_NAME)_*.dmg' -print -quit)"; \
 	if [ ! -d "$$app_path" ]; then echo "macOS app not found: $$app_path"; exit 1; fi; \
 	if [ -z "$$dmg_path" ] || [ ! -f "$$dmg_path" ]; then echo "macOS dmg not found under target/$(DESKTOP_MACOS_TARGET)/release/bundle/dmg"; exit 1; fi; \
-	scripts/release/verify-macos-dmg-layout.sh "$$dmg_path" "$(DESKTOP_MACOS_APP_NAME)"; \
+	if ! command -v dmgbuild >/dev/null 2>&1; then echo "dmgbuild is required. Install dmgbuild==1.6.5 before building a macOS release."; exit 1; fi; \
 	codesign --verify --deep --strict --verbose=4 "$$app_path"; \
+	styled_dmg_path="$${dmg_path%.dmg}.styled.dmg"; \
+	trap 'rm -f "$$styled_dmg_path"' EXIT; \
+	dmgbuild \
+		-s "$(DESKTOP_MACOS_DMG_SETTINGS)" \
+		-D app="$$app_path" \
+		-D background="$(DESKTOP_MACOS_DMG_BACKGROUND)" \
+		-D volume_icon="$(DESKTOP_MACOS_DMG_VOLUME_ICON)" \
+		"$(DESKTOP_MACOS_APP_NAME)" "$$styled_dmg_path"; \
+	mv -f "$$styled_dmg_path" "$$dmg_path"; \
+	trap - EXIT; \
 	codesign --force --timestamp --sign "$(APPLE_SIGNING_IDENTITY)" "$$dmg_path"; \
 	xcrun notarytool submit "$$dmg_path" --keychain-profile "$(DESKTOP_MACOS_NOTARY_PROFILE)" --wait; \
 	xcrun stapler staple "$$dmg_path"; \
 	xcrun stapler validate -v "$$dmg_path"; \
+	bash "$(DESKTOP_MACOS_DMG_VERIFY)" "$$dmg_path"; \
 	spctl --assess --type execute --verbose=4 "$$app_path"; \
 	spctl --assess --type open --context context:primary-signature --verbose=4 "$$dmg_path"; \
 	echo "macOS release dmg is ready: $$dmg_path"
@@ -251,7 +267,7 @@ desktop-verify-macos:
 	dmg_path="$$(find "target/$(DESKTOP_MACOS_TARGET)/release/bundle/dmg" -maxdepth 1 -name '$(DESKTOP_MACOS_APP_NAME)_*.dmg' -print -quit)"; \
 	if [ ! -d "$$app_path" ]; then echo "macOS app not found: $$app_path"; exit 1; fi; \
 	if [ -z "$$dmg_path" ] || [ ! -f "$$dmg_path" ]; then echo "macOS dmg not found under target/$(DESKTOP_MACOS_TARGET)/release/bundle/dmg"; exit 1; fi; \
-	scripts/release/verify-macos-dmg-layout.sh "$$dmg_path" "$(DESKTOP_MACOS_APP_NAME)"; \
+	bash "$(DESKTOP_MACOS_DMG_VERIFY)" "$$dmg_path"; \
 	codesign -dv --verbose=4 "$$app_path" 2>&1; \
 	codesign --verify --deep --strict --verbose=4 "$$app_path"; \
 	xcrun stapler validate -v "$$dmg_path"; \

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

@@ -14,7 +14,7 @@ import {
 import { UserAttachmentCards } from "@liveagent/ui/components/chat/UserAttachmentCards";
 import { Loader2 } from "@liveagent/ui/components/IconSet";
 import { useLocale } from "@liveagent/ui/i18n/LocaleContext";
-import { normalizeLiveToolStatus, VIBING_STATUS } from "@liveagent/ui/lib/chat/assistantStatus";
+import { normalizeLiveToolStatus } from "@liveagent/ui/lib/chat/assistantStatus";
 import type { ChatFileLink } from "@liveagent/ui/lib/chat/chatFileLinks";
 import type { ConversationMentionReference } from "@liveagent/ui/lib/chat/mentionReferences";
 import {
@@ -160,15 +160,6 @@ function resolveNearestScrollViewport(element: HTMLElement | null) {
   return element?.closest("[data-scroll-viewport]") as HTMLDivElement | null;
 }
 
-function LiveStatusFooter(props: { status: string; isCompaction?: boolean }) {
-  const { status, isCompaction = false } = props;
-  return (
-    <div className="gateway-live-status-footer ml-9 min-w-0 overflow-hidden pt-1">
-      <LiveAssistantStatus status={status} isCompaction={isCompaction} className="w-full" />
-    </div>
-  );
-}
-
 function HistoryLoadingState(props: { title?: string }) {
   const title = props.title?.trim();
   return (
@@ -345,8 +336,6 @@ const GatewayUserMessageRowBody = memo(function GatewayUserMessageRowBody(props:
   );
 });
 
-// Retry actions render only for mounted assistant rows. Resolve their prompt
-// locally instead of rebuilding an all-history map on every streamed token.
 function findRetryTarget(rows: readonly TranscriptRow[], assistantIndex: number) {
   for (let index = assistantIndex - 1; index >= 0; index -= 1) {
     const row = rows[index];
@@ -355,14 +344,14 @@ function findRetryTarget(rows: readonly TranscriptRow[], assistantIndex: number)
   return null;
 }
 
-// Shared assistant-row hover actions (copy / retry). Retry re-sends the
-// nearest preceding user prompt through the edit-resend pipeline: this reply
-// and everything after it are discarded, same as editing that prompt
-// unchanged. Both transcript regions render it below the bubble.
+// Compact assistant footer: primary reply actions stay one click away while
+// detailed usage remains behind the info popover.
 const GatewayAssistantMessageActions = memo(function GatewayAssistantMessageActions(props: {
   row: Extract<TranscriptRow, { kind: "assistant" }>;
   retryTarget: Extract<TranscriptRow, { kind: "user" }> | null;
   isStreaming: boolean;
+  showUsage?: boolean;
+  usageContextWindow?: number;
   isCopied: boolean;
   setCopiedMessageId: Dispatch<SetStateAction<string | null>>;
   onResendFromEdit?: (
@@ -378,6 +367,8 @@ const GatewayAssistantMessageActions = memo(function GatewayAssistantMessageActi
     row,
     retryTarget,
     isStreaming,
+    showUsage,
+    usageContextWindow,
     isCopied,
     setCopiedMessageId,
     onResendFromEdit,
@@ -389,6 +380,15 @@ const GatewayAssistantMessageActions = memo(function GatewayAssistantMessageActi
     .map((round) => getRoundText(round).trim())
     .filter((text) => text.length > 0)
     .join("\n\n");
+  const usageEntries = useMemo(
+    () =>
+      showUsage
+        ? row.rounds.flatMap((round) =>
+            round.meta?.usage ? [{ key: `round-${round.round}`, usage: round.meta.usage }] : [],
+          )
+        : undefined,
+    [row.rounds, showUsage],
+  );
   const retryMessageRef = retryTarget?.messageRef;
   const retryDisabled = isStreaming || !onResendFromEdit || !retryMessageRef;
   const retryTitle = retryMessageRef
@@ -415,6 +415,8 @@ const GatewayAssistantMessageActions = memo(function GatewayAssistantMessageActi
           }, 1500);
         });
       }}
+      usageEntries={usageEntries}
+      usageContextWindow={showUsage ? usageContextWindow : undefined}
       retryDisabled={retryDisabled}
       retryTitle={retryTitle}
       onRetry={() => {
@@ -761,21 +763,36 @@ const GatewayTranscriptListRegion = memo(function GatewayTranscriptListRegion(pr
   // further back keeps paging one request at a time: readers load exactly as
   // far as they scroll, servers transfer only the pages actually walked to,
   // and a failed fetch retries only on the next user scroll (no hammering).
+  // The distance is read from the virtualizer's settled offset, not DOM
+  // scrollTop: a page anchored through the 'origin' keeps scrollTop parked
+  // near the top until the rebase lands, and a raw scrollTop check would
+  // re-arm on every wheel tick and stack page after page. The hard top (DOM
+  // scrollTop 0) is a trigger of its own: WebKit defers the rebase until the
+  // gesture settles, so a fling can pin the viewport at 0 with unsettled
+  // debt still above it — the reader is pushing against the top and cannot
+  // scroll into that debt until the rebase lands. Fire once per visit there;
+  // rubber-band scroll events at 0 must not re-fire it.
   const autoLoadEarlierInFlightRef = useRef(false);
+  const hardTopLatchedRef = useRef(false);
   const maybeAutoLoadEarlierRef = useRef(() => {});
   maybeAutoLoadEarlierRef.current = () => {
+    if (!scrollViewport) return;
+    const atHardTop = scrollViewport.scrollTop <= 1;
+    if (!atHardTop) hardTopLatchedRef.current = false;
     if (
       readOnly ||
       isStreaming ||
       !hasMoreHistory ||
       !onLoadEarlierHistory ||
       isLoadingMoreHistory ||
-      autoLoadEarlierInFlightRef.current ||
-      !scrollViewport ||
-      scrollViewport.scrollTop > scrollViewport.clientHeight
+      autoLoadEarlierInFlightRef.current
     ) {
       return;
     }
+    const nearSettledTop =
+      transcriptVirtualizer.getSettledScrollOffset() <= scrollViewport.clientHeight;
+    if (!nearSettledTop && (!atHardTop || hardTopLatchedRef.current)) return;
+    if (atHardTop) hardTopLatchedRef.current = true;
     autoLoadEarlierInFlightRef.current = true;
     onLoadEarlierHistory();
   };
@@ -870,10 +887,11 @@ const GatewayTranscriptListRegion = memo(function GatewayTranscriptListRegion(pr
               <div className="flex w-full max-w-full items-start gap-3">
                 <AssistantAvatar />
                 <div className="min-w-0 flex-1 space-y-2 pt-1">
-                  <div className="flex items-center py-1">
+                  <div className="flex w-full items-center py-1">
                     <LiveAssistantStatus
                       status={displayedToolStatus}
                       isCompaction={displayedToolStatusIsCompaction}
+                      className={displayedToolStatusIsCompaction ? "w-full" : undefined}
                     />
                   </div>
                   {retryAttempts && retryAttempts.length > 0 ? (
@@ -916,6 +934,11 @@ const GatewayTranscriptListRegion = memo(function GatewayTranscriptListRegion(pr
           const rowIndex = virtualRow.index - leadingOffset;
           const isLatestLiveAssistant = rowIndex === liveAssistantIndex;
           const isLatestLiveStreaming = isStreaming && isLatestLiveAssistant;
+          const retryTarget = findRetryTarget(rows, rowIndex);
+          const durationMs =
+            row.timestamp !== undefined && retryTarget?.timestamp !== undefined
+              ? Math.max(0, row.timestamp - retryTarget.timestamp)
+              : undefined;
           return (
             <article
               key={virtualRow.key}
@@ -928,22 +951,17 @@ const GatewayTranscriptListRegion = memo(function GatewayTranscriptListRegion(pr
               <div className="group/assistant min-w-0 w-full max-w-full space-y-1">
                 <AssistantBubble
                   rounds={row.rounds}
-                  showUsage={showUsage}
-                  usageContextWindow={usageContextWindow}
                   isLive={isLatestLiveAssistant}
                   isStreaming={isLatestLiveStreaming}
                   renderMode={rowRenderMode(row)}
+                  toolStatus={isLatestLiveStreaming ? displayedToolStatus : null}
+                  toolStatusVariant={displayedToolStatusIsCompaction ? "compaction" : "default"}
+                  durationMs={durationMs}
                   readOnly={readOnly}
                   redactToolContent={redactToolContent}
                   workdir={workspaceRoot}
                   onOpenFileLink={onOpenFileLink}
                 />
-                {isLatestLiveStreaming ? (
-                  <LiveStatusFooter
-                    status={displayedToolStatus ?? VIBING_STATUS}
-                    isCompaction={displayedToolStatusIsCompaction}
-                  />
-                ) : null}
                 {isLatestLiveStreaming &&
                 !shouldShowPendingLiveBubble &&
                 retryAttempts &&
@@ -955,8 +973,10 @@ const GatewayTranscriptListRegion = memo(function GatewayTranscriptListRegion(pr
                 {!readOnly && !isLatestLiveStreaming ? (
                   <GatewayAssistantMessageActions
                     row={row}
-                    retryTarget={findRetryTarget(rows, rowIndex)}
+                    retryTarget={retryTarget}
                     isStreaming={isStreaming}
+                    showUsage={showUsage}
+                    usageContextWindow={usageContextWindow}
                     isCopied={copiedMessageId === row.key}
                     setCopiedMessageId={setCopiedMessageId}
                     onResendFromEdit={onResendFromEdit}

crates/agent-gateway/web/src/lib/chat/transcript/rows.ts

@@ -1,3 +1,8 @@
+import {
+  assembleContinuousReply,
+  type ReplyStitchClass,
+  stitchCompactedReplies,
+} from "@liveagent/ui/lib/chat/replyContinuity";
 import type { SubagentBatchDetails } from "@liveagent/ui/lib/subagents/protocol";
 import type { ToolCall, ToolResultMessage } from "@/lib/agentTypes";
 import {
@@ -173,6 +178,69 @@ function buildParentAgentToolCallForBatchResult(toolResult: ToolResultMessage):
 export function buildRowsFromEntries(
   entries: ChatEntry[],
   origin: TranscriptRowOrigin,
+): TranscriptRow[] {
+  return stitchCompactedRows(buildRawRowsFromEntries(entries, origin));
+}
+
+function classifyRow(row: TranscriptRow): ReplyStitchClass {
+  if (row.kind === "assistant") return "assistant";
+  if (row.kind === "checkpoint") return "checkpoint";
+  return "other";
+}
+
+// A compaction that fires inside a reply is persisted as
+// `assistant → checkpoint → assistant` with no user entry between the
+// halves. The raw pass emits that as two assistant rows around a card;
+// this pass folds the chain into ONE assistant row whose round list carries
+// the checkpoint as a zero-block seam round, so the reply renders with one
+// avatar, one processing trace (seam milestone inline) and one footer.
+// A checkpoint that ends the chain — idle manual compaction, a run stopped
+// right after compacting — stays a standalone divider card. Round keys
+// already carry a group-unique prefix, so no positional re-keying.
+export function stitchCompactedRows(rows: TranscriptRow[]): TranscriptRow[] {
+  const groups = stitchCompactedReplies(rows, classifyRow);
+  if (groups.every((group) => group.kind === "single")) return rows;
+  const stitched: TranscriptRow[] = [];
+  for (const group of groups) {
+    if (group.kind === "single") {
+      stitched.push(group.item);
+      continue;
+    }
+    const leader = group.items[0];
+    if (!leader || leader.kind !== "assistant") continue;
+    if (group.items.length === 1) {
+      stitched.push(leader);
+      continue;
+    }
+    const reply = assembleContinuousReply<TranscriptRow, GatewayTranscriptRound>(group.items, {
+      classify: classifyRow,
+      roundsOf: (row) => (row.kind === "assistant" ? row.rounds : []),
+      seamOf: (row) => {
+        if (row.kind !== "checkpoint") throw new Error("seamOf called on a non-checkpoint row");
+        return row;
+      },
+      rekeyParts: false,
+    });
+    let timestamp = leader.timestamp;
+    let turnKey = leader.turnKey;
+    for (const item of group.items) {
+      if (item.kind !== "assistant") continue;
+      if (item.timestamp !== undefined) timestamp = item.timestamp;
+      if (item.turnKey !== undefined) turnKey = item.turnKey;
+    }
+    stitched.push({
+      ...leader,
+      rounds: reply.rounds as GatewayTranscriptRound[],
+      timestamp,
+      ...(turnKey !== undefined ? { turnKey } : {}),
+    });
+  }
+  return stitched;
+}
+
+function buildRawRowsFromEntries(
+  entries: ChatEntry[],
+  origin: TranscriptRowOrigin,
 ): TranscriptRow[] {
   const rows: TranscriptRow[] = [];
   let assistantGroup: AssistantGroupBuilder | null = null;

crates/agent-gateway/web/src/lib/chatUi.ts

@@ -12,6 +12,7 @@ import {
   normalizeHostedSearchBlock,
 } from "@liveagent/ui/lib/chat/hostedSearch";
 import type { ConversationMentionReference } from "@liveagent/ui/lib/chat/mentionReferences";
+import type { CompactionSeam } from "@liveagent/ui/lib/chat/replyContinuity";
 import {
   getUserMessageAttachments,
   getUserMessageDisplayText,
@@ -31,6 +32,11 @@ export type GatewayTranscriptRound = UiRound & {
   key: string;
   runningToolCallIds: string[];
   thinkingOpen?: boolean;
+  /**
+   * Set on the zero-block seam round that stands in for a context
+   * compaction inside a stitched reply (see lib/chat/replyContinuity).
+   */
+  checkpoint?: CompactionSeam;
 };
 
 type SharedGatewayChatEntry = SharedChatEntry<

crates/agent-gateway/web/src/styles/base-chat.css

@@ -933,10 +933,6 @@ html[data-liveagent-webui="gateway"] [role="textbox"]:focus-visible {
   html[data-liveagent-webui="gateway"] .changed-file-row-action {
     display: none;
   }
-  .chat-user-bubble-actions,
-  .chat-assistant-actions {
-    opacity: 1;
-  }
 
   .chat-user-bubble-action,
   .chat-assistant-action {
@@ -949,6 +945,15 @@ html[data-liveagent-webui="gateway"] [role="textbox"]:focus-visible {
   }
 }
 
+/* Only force the action row visible when *no* hover-capable pointer exists.
+ * `(pointer: coarse)` alone matches many desktop 2-in-1s that still have a mouse. */
+@media (any-hover: none) {
+  .chat-user-bubble-actions,
+  .chat-assistant-actions {
+    opacity: 1;
+  }
+}
+
 .gateway-bubble {
   width: min(100%, 760px);
   border-radius: 22px;