@nextclaw/ui 0.15.24 → 0.15.26

package/src/features/chat/features/workspace/components/chat-session-workspace-file-breadcrumbs.tsx

@@ -1,22 +1,20 @@
-import { Fragment, useState } from "react";
-import type { ChatFileOpenActionViewModel } from "@nextclaw/agent-chat-ui";
-import { ChevronRight, Folder, FolderTree } from "lucide-react";
-import { Popover, PopoverTrigger } from "@/shared/components/ui/popover";
-import { FileTypeIcon } from "@/shared/components/file-type-icon";
-import { ChatPopoverContent } from "@/features/chat/components/chat-popover-content";
-import { WorkspaceBreadcrumbBrowser } from "./chat-session-workspace-file-breadcrumb-browser";
+import { Fragment, useLayoutEffect, useRef, useState, type ReactNode } from 'react';
+import type { ChatFileOpenActionViewModel } from '@nextclaw/agent-chat-ui';
+import { ChevronRight, Folder, FolderTree } from 'lucide-react';
+import { Popover, PopoverTrigger } from '@/shared/components/ui/popover';
+import { FileTypeIcon } from '@/shared/components/file-type-icon';
+import { ChatPopoverContent } from '@/features/chat/components/chat-popover-content';
+import { WorkspaceBreadcrumbBrowser } from './chat-session-workspace-file-breadcrumb-browser';
 import type {
   WorkspaceFileBreadcrumbSegmentViewModel,
   WorkspaceFileBreadcrumbViewModel,
-} from "@/shared/lib/session-project";
-import { t } from "@/shared/lib/i18n";
-import { cn } from "@/shared/lib/utils";
+} from '@/shared/lib/session-project';
+import { t } from '@/shared/lib/i18n';
+import { cn } from '@/shared/lib/utils';
 
 function WorkspaceBreadcrumbWarningChip({ value }: { value: string }) {
   return (
-    <span
-      className="inline-flex h-5 items-center rounded-sm border border-amber-200 bg-amber-50 px-1.5 text-[10px] font-medium leading-none text-amber-700"
-    >
+    <span className="inline-flex h-5 items-center rounded-sm border border-amber-200 bg-amber-50 px-1.5 text-[10px] font-medium leading-none text-amber-700">
       {value}
     </span>
   );
@@ -43,20 +41,20 @@ function WorkspaceBreadcrumbSegmentButton({
       <PopoverTrigger asChild>
         <button
           type="button"
-          aria-current={segment.isCurrent ? "page" : undefined}
+          aria-current={segment.isCurrent ? 'page' : undefined}
           className={cn(
-            "inline-flex h-5 items-center gap-1 rounded-sm px-1 text-[11px] leading-none transition-colors hover:bg-gray-200/80 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border",
-            segment.kind === "workspace"
-              ? "bg-primary/8 text-primary hover:bg-primary/12"
+            'inline-flex h-5 shrink-0 items-center gap-1 whitespace-nowrap rounded-sm px-1 text-[11px] leading-none transition-colors hover:bg-gray-200/80 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border',
+            segment.kind === 'workspace'
+              ? 'bg-primary/8 text-primary hover:bg-primary/12'
               : segment.isCurrent
-                ? "bg-gray-200/70 text-gray-900"
-                : "text-gray-500",
+                ? 'bg-gray-200/70 text-gray-900'
+                : 'text-gray-500',
           )}
           disabled={!segment.browsePath}
         >
-          {segment.kind === "workspace" ? (
+          {segment.kind === 'workspace' ? (
             <FolderTree className="h-3 w-3 shrink-0" />
-          ) : segment.kind === "directory" && segment.isCurrent ? (
+          ) : segment.kind === 'directory' && segment.isCurrent ? (
             <Folder className="h-3 w-3 shrink-0" />
           ) : segment.isCurrent ? (
             <FileTypeIcon fileName={segment.label} size="compact" />
@@ -64,11 +62,7 @@ function WorkspaceBreadcrumbSegmentButton({
           <span>{segment.label}</span>
         </button>
       </PopoverTrigger>
-      <ChatPopoverContent
-        data-testid="workspace-breadcrumb-popover"
-        className="w-[22rem] rounded-md p-0"
-        align="start"
-      >
+      <ChatPopoverContent data-testid="workspace-breadcrumb-popover" className="w-[22rem] rounded-md p-0" align="start">
         <WorkspaceBreadcrumbBrowser
           browsePath={browsePath}
           onBrowsePathChange={setBrowsePath}
@@ -82,28 +76,55 @@ function WorkspaceBreadcrumbSegmentButton({
 
 export function ChatSessionWorkspaceFileBreadcrumbs({
   breadcrumb,
+  leading,
   onFileOpen,
 }: {
   breadcrumb: WorkspaceFileBreadcrumbViewModel;
+  leading?: ReactNode;
   onFileOpen: (action: ChatFileOpenActionViewModel) => void;
 }) {
+  const scrollRef = useRef<HTMLDivElement>(null);
+
+  useLayoutEffect(() => {
+    const scroll = scrollRef.current;
+    if (!scroll) return;
+    const current = scroll.querySelector<HTMLElement>('[aria-current="page"]');
+    if (!current) return;
+
+    const revealCurrentSegment = () => {
+      const scrollRect = scroll.getBoundingClientRect();
+      const currentRect = current.getBoundingClientRect();
+      if (currentRect.right > scrollRect.right) {
+        scroll.scrollLeft += currentRect.right - scrollRect.right;
+      } else if (currentRect.left < scrollRect.left) {
+        scroll.scrollLeft -= scrollRect.left - currentRect.left;
+      }
+    };
+
+    revealCurrentSegment();
+    if (typeof ResizeObserver === 'undefined') return;
+    const observer = new ResizeObserver(revealCurrentSegment);
+    observer.observe(scroll);
+    observer.observe(current);
+    return () => observer.disconnect();
+  }, [breadcrumb.fullPath]);
+
   return (
     <div
       data-testid="workspace-file-breadcrumbs"
       title={breadcrumb.fullPath}
-      className="workspace-horizontal-scrollbar overflow-x-auto overflow-y-hidden border-b border-gray-200/80 bg-gray-50/55"
+      className="flex min-w-0 items-center border-b border-gray-200/80 bg-gray-50/55"
     >
+      {leading ? <div className="flex h-full shrink-0 items-center pl-1 pr-0.5">{leading}</div> : null}
       <div
+        ref={scrollRef}
         data-testid="workspace-file-breadcrumb-scroll"
-        className="flex min-w-max items-center gap-2.5 px-3 py-1.5"
+        className="workspace-horizontal-scrollbar flex min-w-0 flex-1 items-center gap-2.5 overflow-x-auto overflow-y-hidden px-3 py-1.5"
       >
         <div className="flex min-w-0 flex-1 items-center gap-1 pr-1">
           {breadcrumb.segments.map((segment, index) => (
             <Fragment key={segment.key}>
-              <WorkspaceBreadcrumbSegmentButton
-                segment={segment}
-                onFileOpen={onFileOpen}
-              />
+              <WorkspaceBreadcrumbSegmentButton segment={segment} onFileOpen={onFileOpen} />
               {index < breadcrumb.segments.length - 1 ? (
                 <ChevronRight className="h-3 w-3 shrink-0 text-gray-300" />
               ) : null}
@@ -113,9 +134,7 @@ export function ChatSessionWorkspaceFileBreadcrumbs({
 
         {breadcrumb.truncated ? (
           <div className="flex shrink-0 flex-wrap items-center justify-end gap-1">
-            <WorkspaceBreadcrumbWarningChip
-              value={t("chatWorkspacePreviewTruncated")}
-            />
+            <WorkspaceBreadcrumbWarningChip value={t('chatWorkspacePreviewTruncated')} />
           </div>
         ) : null}
       </div>

package/src/features/chat/features/workspace/components/chat-session-workspace-file-preview.tsx

@@ -1,56 +1,44 @@
-import { useMemo } from "react";
-import type {
-  ChatFileOpenActionViewModel,
-  ChatFileOperationBlockViewModel,
-} from "@nextclaw/agent-chat-ui";
-import { NextClawClientError } from "@nextclaw/client-sdk";
-import {
-  ChatMessageMarkdown,
-  FileOperationCodeSurface,
-} from "@nextclaw/agent-chat-ui";
-import type { ChatWorkspaceFileTab } from "@/features/chat/stores/chat-thread.store";
-import { ChatSessionWorkspaceDirectoryBrowser } from "./chat-session-workspace-directory-browser";
-import { ChatSessionWorkspaceFileBreadcrumbs } from "./chat-session-workspace-file-breadcrumbs";
-import { WorkspaceTextSelectionMenu } from "./workspace-text-selection-menu";
-import type { WorkspaceTextExcerpt } from "@/features/chat/features/workspace/utils/workspace-text-excerpt.utils";
+import { useMemo, type ReactNode } from 'react';
+import type { ChatFileOpenActionViewModel, ChatFileOperationBlockViewModel } from '@nextclaw/agent-chat-ui';
+import { NextClawClientError } from '@nextclaw/client-sdk';
+import { ChatMessageMarkdown, FileOperationCodeSurface } from '@nextclaw/agent-chat-ui';
+import type { ChatWorkspaceFileTab } from '@/features/chat/stores/chat-thread.store';
+import { ChatSessionWorkspaceDirectoryBrowser } from './chat-session-workspace-directory-browser';
+import { ChatSessionWorkspaceFileBreadcrumbs } from './chat-session-workspace-file-breadcrumbs';
+import { WorkspaceTextSelectionMenu } from './workspace-text-selection-menu';
+import type { WorkspaceTextExcerpt } from '@/features/chat/features/workspace/utils/workspace-text-excerpt.utils';
 import {
   resolveWorkspaceFileContentKind,
   WorkspaceFileContentPreview,
   type WorkspaceFileContentKind,
-} from "./workspace-file-content-preview";
-import { useServerPathBrowse } from "@/shared/hooks/use-server-path-browse";
-import { useServerPathRead } from "@/shared/hooks/use-server-path-read";
-import { buildServerPathContentUrl } from "@/shared/lib/api";
+} from './workspace-file-content-preview';
+import { useServerPathBrowse } from '@/shared/hooks/use-server-path-browse';
+import { useServerPathRead } from '@/shared/hooks/use-server-path-read';
+import { buildServerPathContentUrl } from '@/shared/lib/api';
 import {
   buildLineDiff,
   buildPreviewLines,
-} from "@/features/chat/features/message/utils/file-operation/line-builder.utils";
-import { t } from "@/shared/lib/i18n";
-import {
-  buildWorkspaceFileBreadcrumb,
-  resolveWorkspaceRelativePath,
-} from "@/shared/lib/session-project";
-import { cn } from "@/shared/lib/utils";
-import { resolveWorkspaceFileViewer } from "@/features/chat/features/workspace/utils/chat-workspace-file-viewer.utils";
+} from '@/features/chat/features/message/utils/file-operation/line-builder.utils';
+import { t } from '@/shared/lib/i18n';
+import { buildWorkspaceFileBreadcrumb, resolveWorkspaceRelativePath } from '@/shared/lib/session-project';
+import { cn } from '@/shared/lib/utils';
+import { resolveWorkspaceFileViewer } from '@/features/chat/features/workspace/utils/chat-workspace-file-viewer.utils';
 
 function inferPreviewKind(params: {
   path: string;
-  serverKind?: "text" | "markdown" | "binary";
-}): "text" | "markdown" | "binary" {
+  serverKind?: 'text' | 'markdown' | 'binary';
+}): 'text' | 'markdown' | 'binary' {
   if (params.serverKind) {
     return params.serverKind;
   }
-  return /\.mdx?$/i.test(params.path) ? "markdown" : "text";
+  return /\.mdx?$/i.test(params.path) ? 'markdown' : 'text';
 }
 
-function appendPreviewRefreshVersion(
-  url: string,
-  refreshVersion: number,
-): string {
+function appendPreviewRefreshVersion(url: string, refreshVersion: number): string {
   if (refreshVersion <= 0) {
     return url;
   }
-  return `${url}${url.includes("?") ? "&" : "?"}refresh=${refreshVersion}`;
+  return `${url}${url.includes('?') ? '&' : '?'}refresh=${refreshVersion}`;
 }
 
 function buildPreviewBlock(params: {
@@ -64,10 +52,10 @@ function buildPreviewBlock(params: {
   return {
     key: `preview:${path}`,
     path,
-    display: "preview",
+    display: 'preview',
     lines: buildPreviewLines({
       text,
-      kind: "context",
+      kind: 'context',
       oldStartLine: normalizedStartLine,
       newStartLine: normalizedStartLine,
     }),
@@ -78,25 +66,19 @@ function buildPreviewBlock(params: {
   };
 }
 
-function buildDiffBlock(
-  file: ChatWorkspaceFileTab,
-): ChatFileOperationBlockViewModel | null {
+function buildDiffBlock(file: ChatWorkspaceFileTab): ChatFileOperationBlockViewModel | null {
   if (Array.isArray(file.fullLines) && file.fullLines.length > 0) {
     return {
       key: `diff:${file.key}`,
       path: file.path,
-      display: "diff",
+      display: 'diff',
       lines: file.fullLines,
       fullLines: file.fullLines,
       ...(file.beforeText ? { beforeText: file.beforeText } : {}),
       ...(file.afterText ? { afterText: file.afterText } : {}),
       ...(file.patchText ? { patchText: file.patchText } : {}),
-      ...(typeof file.oldStartLine === "number"
-        ? { oldStartLine: file.oldStartLine }
-        : {}),
-      ...(typeof file.newStartLine === "number"
-        ? { newStartLine: file.newStartLine }
-        : {}),
+      ...(typeof file.oldStartLine === 'number' ? { oldStartLine: file.oldStartLine } : {}),
+      ...(typeof file.newStartLine === 'number' ? { newStartLine: file.newStartLine } : {}),
     };
   }
 
@@ -105,8 +87,8 @@ function buildDiffBlock(
   }
 
   const lines = buildLineDiff({
-    beforeText: file.beforeText ?? "",
-    afterText: file.afterText ?? "",
+    beforeText: file.beforeText ?? '',
+    afterText: file.afterText ?? '',
     oldStartLine: file.oldStartLine ?? undefined,
     newStartLine: file.newStartLine ?? undefined,
   });
@@ -114,32 +96,22 @@ function buildDiffBlock(
   return {
     key: `diff:${file.key}`,
     path: file.path,
-    display: "diff",
+    display: 'diff',
     lines,
     fullLines: lines,
     ...(file.beforeText ? { beforeText: file.beforeText } : {}),
     ...(file.afterText ? { afterText: file.afterText } : {}),
-    ...(typeof file.oldStartLine === "number"
-      ? { oldStartLine: file.oldStartLine }
-      : {}),
-    ...(typeof file.newStartLine === "number"
-      ? { newStartLine: file.newStartLine }
-      : {}),
+    ...(typeof file.oldStartLine === 'number' ? { oldStartLine: file.oldStartLine } : {}),
+    ...(typeof file.newStartLine === 'number' ? { newStartLine: file.newStartLine } : {}),
   };
 }
 
-function WorkspaceFilePreviewStatus({
-  text,
-  tone = "muted",
-}: {
-  text: string;
-  tone?: "muted" | "error";
-}) {
+function WorkspaceFilePreviewStatus({ text, tone = 'muted' }: { text: string; tone?: 'muted' | 'error' }) {
   return (
     <div
       className={cn(
-        "flex h-full items-center justify-center px-6 text-center text-sm",
-        tone === "error" ? "text-rose-600" : "text-gray-500",
+        'flex h-full items-center justify-center px-6 text-center text-sm',
+        tone === 'error' ? 'text-rose-600' : 'text-gray-500',
       )}
     >
       {text}
@@ -148,19 +120,14 @@ function WorkspaceFilePreviewStatus({
 }
 
 export function resolveWorkspacePreviewErrorText(error: unknown): string {
-  return error instanceof NextClawClientError &&
-    error.code === "SERVER_PATH_NOT_FOUND"
-    ? t("chatWorkspacePreviewNotFound")
-    : t("chatWorkspacePreviewFailed");
+  return error instanceof NextClawClientError && error.code === 'SERVER_PATH_NOT_FOUND'
+    ? t('chatWorkspacePreviewNotFound')
+    : t('chatWorkspacePreviewFailed');
 }
 
-function WorkspaceDiffBody({
-  diffBlock,
-}: {
-  diffBlock: ChatFileOperationBlockViewModel | null;
-}) {
+function WorkspaceDiffBody({ diffBlock }: { diffBlock: ChatFileOperationBlockViewModel | null }) {
   if (!diffBlock) {
-    return <WorkspaceFilePreviewStatus text={t("chatWorkspaceDiffEmpty")} />;
+    return <WorkspaceFilePreviewStatus text={t('chatWorkspaceDiffEmpty')} />;
   }
   return <WorkspaceCodeSurface block={diffBlock} />;
 }
@@ -176,12 +143,7 @@ function WorkspaceCodeSurface({
 }) {
   return (
     <div className="h-full overflow-auto custom-scrollbar bg-white">
-      <FileOperationCodeSurface
-        block={block}
-        layout="workspace"
-        targetColumn={targetColumn}
-        targetLine={targetLine}
-      />
+      <FileOperationCodeSurface block={block} layout="workspace" targetColumn={targetColumn} targetLine={targetLine} />
     </div>
   );
 }
@@ -206,14 +168,14 @@ function WorkspacePreviewBody({
   contentUrl: string | null;
   contentUrlKind: WorkspaceFileContentKind | null;
   contentLabel: string;
-  contentParams: ChatWorkspaceFileTab["params"];
+  contentParams: ChatWorkspaceFileTab['params'];
   directoryQuery: ReturnType<typeof useServerPathBrowse> | null | undefined;
   fileBasePath: string | null;
   onFileOpen: (action: ChatFileOpenActionViewModel) => void;
   onHtmlContentHeightChange?: (height: number) => void;
   previewBlock: ChatFileOperationBlockViewModel | null;
-  previewKind: "text" | "markdown" | "binary";
-  previewViewer: "source" | "rendered" | null;
+  previewKind: 'text' | 'markdown' | 'binary';
+  previewViewer: 'source' | 'rendered' | null;
   previewQuery: ReturnType<typeof useServerPathRead> | null | undefined;
   previewText: string | null;
   targetColumn?: number | null;
@@ -242,65 +204,47 @@ function WorkspacePreviewBody({
   }
 
   if (directoryQuery?.isLoading && previewQuery?.error && !previewBlock) {
-    return (
-      <WorkspaceFilePreviewStatus text={t("chatWorkspaceLoadingDirectory")} />
-    );
+    return <WorkspaceFilePreviewStatus text={t('chatWorkspaceLoadingDirectory')} />;
   }
 
   if ((directoryQuery?.isLoading || previewQuery?.isLoading) && !previewBlock) {
-    return (
-      <WorkspaceFilePreviewStatus text={t("chatWorkspaceLoadingPreview")} />
-    );
+    return <WorkspaceFilePreviewStatus text={t('chatWorkspaceLoadingPreview')} />;
   }
 
-  if (previewQuery?.data?.kind === "binary") {
-    return (
-      <WorkspaceFilePreviewStatus text={t("chatWorkspacePreviewUnsupported")} />
-    );
+  if (previewQuery?.data?.kind === 'binary') {
+    return <WorkspaceFilePreviewStatus text={t('chatWorkspacePreviewUnsupported')} />;
   }
 
   if (previewQuery?.error && !previewBlock) {
-    return (
-      <WorkspaceFilePreviewStatus
-        tone="error"
-        text={resolveWorkspacePreviewErrorText(previewQuery.error)}
-      />
-    );
+    return <WorkspaceFilePreviewStatus tone="error" text={resolveWorkspacePreviewErrorText(previewQuery.error)} />;
   }
 
-  if (previewKind === "markdown" && previewViewer !== "source" && previewText) {
+  if (previewKind === 'markdown' && previewViewer !== 'source' && previewText) {
     return (
       <div className="h-full overflow-auto custom-scrollbar px-5 py-4">
         <ChatMessageMarkdown
           text={previewText}
           role="assistant"
           texts={{
-            copyCodeLabel: t("chatCodeCopy"),
-            copiedCodeLabel: t("chatCodeCopied"),
+            copyCodeLabel: t('chatCodeCopy'),
+            copiedCodeLabel: t('chatCodeCopied'),
           }}
           onFileOpen={onFileOpen}
-          resolveFileContentUrl={(action) =>
-            buildServerPathContentUrl(action.path, fileBasePath)
-          }
+          resolveFileContentUrl={(action) => buildServerPathContentUrl(action.path, fileBasePath)}
         />
       </div>
     );
   }
 
   if (previewBlock) {
-    return (
-      <WorkspaceCodeSurface
-        block={previewBlock}
-        targetColumn={targetColumn}
-        targetLine={targetLine}
-      />
-    );
+    return <WorkspaceCodeSurface block={previewBlock} targetColumn={targetColumn} targetLine={targetLine} />;
   }
 
-  return <WorkspaceFilePreviewStatus text={t("chatWorkspacePreviewEmpty")} />;
+  return <WorkspaceFilePreviewStatus text={t('chatWorkspacePreviewEmpty')} />;
 }
 
 type ChatSessionWorkspaceFilePreviewProps = {
+  breadcrumbLeading?: ReactNode;
   file: ChatWorkspaceFileTab;
   refreshVersion?: number;
   sessionProjectRoot: string | null;
@@ -312,6 +256,7 @@ type ChatSessionWorkspaceFilePreviewProps = {
 };
 
 export function ChatSessionWorkspaceFilePreview({
+  breadcrumbLeading,
   file,
   refreshVersion = 0,
   sessionProjectRoot,
@@ -321,7 +266,7 @@ export function ChatSessionWorkspaceFilePreview({
   onFileOpen,
   onTextExcerptAdd,
 }: ChatSessionWorkspaceFilePreviewProps) {
-  const isPreviewMode = file.viewMode === "preview";
+  const isPreviewMode = file.viewMode === 'preview';
   const suppliedContentUrl = file.contentUrl?.trim() || null;
   const usesServerPath = isPreviewMode && !suppliedContentUrl;
   const previewQuery = useServerPathRead({
@@ -336,13 +281,8 @@ export function ChatSessionWorkspaceFilePreview({
     includeFiles: true,
     enabled: usesServerPath,
   });
-  const diffBlock = useMemo(
-    () => (file.viewMode === "diff" ? buildDiffBlock(file) : null),
-    [file],
-  );
-  const previewText = isPreviewMode
-    ? (previewQuery?.data?.text ?? file.rawText ?? null)
-    : null;
+  const diffBlock = useMemo(() => (file.viewMode === 'diff' ? buildDiffBlock(file) : null), [file]);
+  const previewText = isPreviewMode ? (previewQuery?.data?.text ?? file.rawText ?? null) : null;
   const previewKind = inferPreviewKind({
     path: previewQuery?.data?.resolvedPath ?? file.path,
     serverKind: previewQuery?.data?.kind,
@@ -353,37 +293,27 @@ export function ChatSessionWorkspaceFilePreview({
         mimeType: file.mimeType,
       })
     : null;
-  const resolvedPath =
-    directoryQuery?.data?.currentPath ??
-    previewQuery?.data?.resolvedPath ??
-    file.path;
-  const previewPathKind = directoryQuery?.data ? "directory" : "file";
-  const previewViewer = resolveWorkspaceFileViewer(
-    resolvedPath,
-    file.previewViewer,
-  );
+  const resolvedPath = directoryQuery?.data?.currentPath ?? previewQuery?.data?.resolvedPath ?? file.path;
+  const previewPathKind = directoryQuery?.data ? 'directory' : 'file';
+  const previewViewer = resolveWorkspaceFileViewer(resolvedPath, file.previewViewer);
   const localContentKind = resolveWorkspaceFileContentKind({
     path: resolvedPath,
   });
-  const localContentUrlCandidate = buildServerPathContentUrl(
-    file.path,
-    sessionWorkingDir,
-  );
+  const localContentUrlCandidate = buildServerPathContentUrl(file.path, sessionWorkingDir);
   const shouldRenderLocalContent = Boolean(
     !suppliedContentUrl &&
     isPreviewMode &&
     localContentUrlCandidate &&
-    file.previewViewer !== "source" &&
-    localContentKind !== "other" &&
-    (localContentKind !== "html" || previewViewer === "rendered"),
+    file.previewViewer !== 'source' &&
+    localContentKind !== 'other' &&
+    (localContentKind !== 'html' || previewViewer === 'rendered'),
   );
   const localContentUrl =
     shouldRenderLocalContent && localContentUrlCandidate
       ? appendPreviewRefreshVersion(localContentUrlCandidate, refreshVersion)
       : null;
   const contentUrl = suppliedContentUrl ?? localContentUrl;
-  const contentUrlKind =
-    suppliedContentKind ?? (localContentUrl ? localContentKind : null);
+  const contentUrlKind = suppliedContentKind ?? (localContentUrl ? localContentKind : null);
   const previewBlock = useMemo(() => {
     if (!isPreviewMode || !previewText || contentUrl) {
       return null;
@@ -403,13 +333,13 @@ export function ChatSessionWorkspaceFilePreview({
     previewQuery?.data?.startLine,
     previewText,
   ]);
-  const isTextPreviewTruncated =
-    !contentUrl && Boolean(previewQuery?.data?.truncated);
+  const isTextPreviewTruncated = !contentUrl && Boolean(previewQuery?.data?.truncated);
   const breadcrumbBasePath = sessionProjectRoot ?? sessionWorkingDir;
-  const excerptPath = resolveWorkspaceRelativePath({
-    path: resolvedPath,
-    sessionProjectRoot: breadcrumbBasePath,
-  });
+  const excerptPath =
+    resolveWorkspaceRelativePath({
+      path: resolvedPath,
+      sessionProjectRoot: breadcrumbBasePath,
+    }) ?? resolvedPath.trim();
   const breadcrumb = useMemo(
     () =>
       buildWorkspaceFileBreadcrumb({
@@ -445,16 +375,17 @@ export function ChatSessionWorkspaceFilePreview({
       {showBreadcrumbs ? (
         <ChatSessionWorkspaceFileBreadcrumbs
           breadcrumb={breadcrumb}
+          leading={breadcrumbLeading}
           onFileOpen={onFileOpen}
         />
       ) : null}
 
       <div className="flex-1 min-h-0 overflow-hidden">
-        {file.viewMode === "diff" ? (
+        {file.viewMode === 'diff' ? (
           <WorkspaceDiffBody diffBlock={diffBlock} />
         ) : excerptPath && previewText ? (
           <WorkspaceTextSelectionMenu
-            fileLabel={file.label?.trim() || excerptPath.split("/").at(-1) || excerptPath}
+            fileLabel={file.label?.trim() || excerptPath.split('/').at(-1) || excerptPath}
             filePath={excerptPath}
             sourceStartLine={previewQuery?.data?.startLine ?? 1}
             sourceText={previewText}