@tablestore/tablestore-agent-cli 0.2.3 → 0.2.4

package/dist/dashboard-runtime/dashboard/src/components/layout/detail-sidebar.tsx

@@ -111,6 +111,10 @@ interface DetailSidebarHeaderProps
   typeLabel?: React.ReactNode;
   description?: React.ReactNode;
   actions?: React.ReactNode;
+  /** Status pills (multimodal / subspace / etc.) rendered as their own
+   *  row directly below the icon — kept separate from `name` so they
+   *  get their own line and don't crowd the title row. */
+  pills?: React.ReactNode;
   /** Tags / chips / dates / extra info. Wrapped in a flex container with
    *  small text already applied. */
   extra?: React.ReactNode;
@@ -123,21 +127,53 @@ export function DetailSidebarHeader({
   typeLabel,
   description,
   actions,
+  pills,
   extra,
 }: DetailSidebarHeaderProps) {
   const { toggle } = useDetailSidebarCollapsed();
   return (
     <header className="flex flex-col gap-2 border-b border-[hsl(var(--border-light))] px-4 pb-4 pt-4">
-      <div className="flex items-start justify-between gap-2">
-        <div className={detailIconAccent({ accent })}>{icon}</div>
+      {/*
+        Identity row: accent icon on the left, the name + optional type
+        label in the middle (truncates with ellipsis when too long), and
+        consumer actions plus the built-in "collapse sidebar" button on
+        the right. Status pills sit on their own row underneath so they
+        can wrap freely without squeezing the title.
+      */}
+      <div className="flex items-center gap-3">
+        <div className={cn(detailIconAccent({ accent }), "shrink-0")}>
+          {icon}
+        </div>
+        <div className="min-w-0 flex-1 space-y-0.5">
+          {typeof name === "string" ? (
+            <TooltipProvider delayDuration={200}>
+              <Tooltip>
+                <TooltipTrigger asChild>
+                  <div className="truncate text-sm font-semibold leading-tight text-[hsl(var(--foreground))]">
+                    {name}
+                  </div>
+                </TooltipTrigger>
+                <TooltipContent side="bottom" sideOffset={4}>
+                  {name}
+                </TooltipContent>
+              </Tooltip>
+            </TooltipProvider>
+          ) : (
+            <div className="truncate text-sm font-semibold leading-tight text-[hsl(var(--foreground))]">
+              {name}
+            </div>
+          )}
+          {typeLabel ? (
+            <div className="truncate text-[11px] font-semibold uppercase tracking-wider text-[hsl(var(--muted-foreground))]">
+              {typeLabel}
+            </div>
+          ) : null}
+        </div>
         {/*
-          Right-side controls: any consumer-supplied actions (delete, etc.)
-          plus a built-in "collapse sidebar" button. The collapse button is
-          baked in so every detail page gets it for free; it sits to the
-          right of consumer actions so it always lands at the far edge —
-          the visual anchor users learn to reach for.
+          Right-side controls: consumer actions (delete, etc.) plus a
+          built-in "collapse sidebar" button anchored at the far edge.
         */}
-        <div className="-mt-1 -mr-1 flex items-center gap-0.5">
+        <div className="-mr-1 flex shrink-0 items-center gap-0.5">
           {actions}
           <TooltipProvider delayDuration={200}>
             <Tooltip>
@@ -158,16 +194,9 @@ export function DetailSidebarHeader({
           </TooltipProvider>
         </div>
       </div>
-      <div className="space-y-0.5">
-        <div className="text-sm font-semibold leading-tight text-[hsl(var(--foreground))]">
-          {name}
-        </div>
-        {typeLabel ? (
-          <div className="text-[11px] font-semibold uppercase tracking-wider text-[hsl(var(--muted-foreground))]">
-            {typeLabel}
-          </div>
-        ) : null}
-      </div>
+      {pills ? (
+        <div className="flex flex-wrap gap-2">{pills}</div>
+      ) : null}
       {description ? (
         <p className="line-clamp-3 text-[13px] leading-snug text-[hsl(var(--muted-foreground))]">
           {description}

package/dist/dashboard-runtime/dashboard/src/components/layout/sidebar-instance-card.tsx

@@ -60,7 +60,7 @@ export function SidebarInstanceCard({ collapsed }: SidebarInstanceCardProps) {
           <DropdownMenuTrigger asChild>
             <button
               type="button"
-              aria-label={activeName ? `当前实例：${activeName}` : "选择项目"}
+              aria-label={activeName ? `当前项目：${activeName}` : "选择项目"}
               title={activeName ?? "选择项目"}
               disabled={isLoading}
               className={cn(
@@ -103,7 +103,7 @@ export function SidebarInstanceCard({ collapsed }: SidebarInstanceCardProps) {
           >
             <div className="flex flex-1 flex-col overflow-hidden">
               <span className="text-[11px] uppercase tracking-wider text-[hsl(var(--muted-foreground))]">
-                当前实例
+                当前项目
               </span>
               <span className="truncate text-sm font-semibold text-[hsl(var(--foreground))]">
                 {activeName ?? "未选择"}

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-add-dialog.tsx

@@ -67,7 +67,7 @@ export function MemoryAddDialog({
         </DialogHeader>
         <div className="space-y-4">
           <div className="space-y-2">
-            <Label>Text</Label>
+            <Label>记忆文本</Label>
             <Textarea
               value={text}
               onChange={(event) => setText(event.target.value)}
@@ -76,7 +76,7 @@ export function MemoryAddDialog({
             />
           </div>
           <div className="space-y-2">
-            <Label>Metadata JSON（可选）</Label>
+            <Label>元数据（JSON，可选）</Label>
             <Textarea
               value={metadataJson}
               onChange={(event) => setMetadataJson(event.target.value)}

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-edit-dialog.tsx

@@ -70,11 +70,11 @@ export function MemoryEditDialog({
         </DialogHeader>
         <form key={unitKey} onSubmit={handleSubmit} className="space-y-4">
           <div className="space-y-2">
-            <Label>Text</Label>
+            <Label>记忆文本</Label>
             <Textarea name="text" defaultValue={unit?.text ?? ""} rows={5} />
           </div>
           <div className="space-y-2">
-            <Label>Metadata JSON</Label>
+            <Label>元数据（JSON）</Label>
             <Textarea
               name="metadata"
               defaultValue={unit?.metadata ? JSON.stringify(unit.metadata, null, 2) : ""}

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-messages-table.tsx

@@ -76,7 +76,7 @@ export function MemoryMessagesTable({ messages }: MemoryMessagesTableProps) {
   if (!messages.length) {
     return (
       <div className="rounded-lg border border-dashed py-12 text-center text-sm text-muted-foreground">
-        当前 scope 下暂无消息记录
+        当前范围下暂无消息记录
       </div>
     );
   }
@@ -88,9 +88,9 @@ export function MemoryMessagesTable({ messages }: MemoryMessagesTableProps) {
           <TableRow>
             <TableHead className="w-[180px]">时间</TableHead>
             <TableHead className="w-[120px]">角色</TableHead>
-            <TableHead className="w-[140px]">Speaker</TableHead>
+            <TableHead className="w-[140px]">说话人</TableHead>
             <TableHead>内容</TableHead>
-            <TableHead className="w-[260px]">Metadata</TableHead>
+            <TableHead className="w-[260px]">元数据</TableHead>
           </TableRow>
         </TableHeader>
         <TableBody>

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-requests-table.tsx

@@ -72,15 +72,15 @@ function RequestDetailDialog({ request, open, onOpenChange }: {
         </DialogHeader>
         <div className="grid gap-4 sm:grid-cols-2">
           <div className="space-y-1">
-            <p className="text-xs text-muted-foreground">Operation</p>
+            <p className="text-xs text-muted-foreground">操作</p>
             <p className="text-sm font-medium">{request.operation ?? "-"}</p>
           </div>
           <div className="space-y-1">
-            <p className="text-xs text-muted-foreground">Request ID</p>
+            <p className="text-xs text-muted-foreground">请求 ID</p>
             <p className="text-sm font-mono">{request.requestId ?? "-"}</p>
           </div>
           <div className="space-y-1">
-            <p className="text-xs text-muted-foreground">Target ID</p>
+            <p className="text-xs text-muted-foreground">目标 ID</p>
             <p className="text-sm font-medium">{request.targetId ?? "-"}</p>
           </div>
           <div className="space-y-1">
@@ -96,18 +96,18 @@ function RequestDetailDialog({ request, open, onOpenChange }: {
             <p className="text-sm font-medium">{formatTimestamp(request.createdAt)}</p>
           </div>
           <div className="space-y-1">
-            <p className="text-xs text-muted-foreground">Ingest 状态</p>
+            <p className="text-xs text-muted-foreground">入库状态</p>
             <p className="text-sm font-medium">{request.ingestStatus ?? "-"}</p>
           </div>
           <div className="space-y-1 sm:col-span-2">
-            <p className="text-xs text-muted-foreground">Scope</p>
+            <p className="text-xs text-muted-foreground">范围</p>
             <p className="text-sm font-medium">{scopeLabel(request.scope)}</p>
             {request.scope && (
               <div className="mt-2 grid grid-cols-2 gap-x-4 gap-y-1 text-xs text-muted-foreground">
-                <span>App ID:</span><span className="font-mono">{request.scope.appId ?? "-"}</span>
-                <span>Tenant ID:</span><span className="font-mono">{request.scope.tenantId ?? "-"}</span>
-                <span>Agent ID:</span><span className="font-mono">{request.scope.agentId ?? "-"}</span>
-                <span>Run ID:</span><span className="font-mono">{request.scope.runId ?? "-"}</span>
+                <span>应用：</span><span className="font-mono">{request.scope.appId ?? "-"}</span>
+                <span>租户：</span><span className="font-mono">{request.scope.tenantId ?? "-"}</span>
+                <span>智能体：</span><span className="font-mono">{request.scope.agentId ?? "-"}</span>
+                <span>会话：</span><span className="font-mono">{request.scope.runId ?? "-"}</span>
               </div>
             )}
           </div>
@@ -173,7 +173,7 @@ export function MemoryRequestsTable({ requests }: MemoryRequestsTableProps) {
   if (!requests.length) {
     return (
       <div className="rounded-lg border border-dashed py-12 text-center text-sm text-muted-foreground">
-        当前 scope 下暂无请求审计记录
+        当前范围下暂无请求审计记录
       </div>
     );
   }
@@ -185,8 +185,8 @@ export function MemoryRequestsTable({ requests }: MemoryRequestsTableProps) {
           <TableHeader>
             <TableRow>
               <TableHead className="w-[160px]">时间</TableHead>
-              <TableHead className="w-[120px]">Operation</TableHead>
-              <TableHead className="w-[160px]">Request ID</TableHead>
+              <TableHead className="w-[120px]">操作</TableHead>
+              <TableHead className="w-[160px]">请求 ID</TableHead>
               <TableHead className="w-[80px]">响应码</TableHead>
               <TableHead className="w-[80px]">耗时</TableHead>
               <TableHead className="w-[80px]">操作</TableHead>

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-scope-bar.tsx

@@ -19,10 +19,10 @@ import { describeMemoryStore, listMemoryUnits } from "@/services/memory";
 import type { MemoryScope } from "@/types/memory";
 
 const FIELDS: Array<{ key: keyof MemoryScope; label: string; placeholder: string }> = [
-  { key: "appId", label: "App", placeholder: "app-001" },
-  { key: "tenantId", label: "Tenant", placeholder: "tenant-001" },
-  { key: "agentId", label: "Agent", placeholder: "agent-001" },
-  { key: "runId", label: "Run", placeholder: "run-001" },
+  { key: "appId", label: "应用", placeholder: "app-001" },
+  { key: "tenantId", label: "租户", placeholder: "tenant-001" },
+  { key: "agentId", label: "智能体", placeholder: "agent-001" },
+  { key: "runId", label: "会话", placeholder: "run-001" },
 ];
 
 function isWildcardScope(scope: MemoryScope): boolean {
@@ -47,7 +47,11 @@ export function MemoryScopeBar() {
   const router = useRouter();
   const pathname = usePathname();
   const searchParams = useSearchParams();
-  const currentScope = useMemo(() => buildMemoryScope(searchParams), [searchParams.toString()]);
+  const searchParamsString = searchParams.toString();
+  const currentScope = useMemo(
+    () => buildMemoryScope(new URLSearchParams(searchParamsString)),
+    [searchParamsString],
+  );
   const [expanded, setExpanded] = useState(false);
   const [draft, setDraft] = useState<MemoryScope>(currentScope);
   const [error, setError] = useState<string | null>(null);
@@ -90,15 +94,20 @@ export function MemoryScopeBar() {
   // Default to wildcard on memory detail pages
   useEffect(() => {
     if (!storeName || pathname.includes("/create")) return;
-    
-    const appId = searchParams.get("appId");
+
+    // 基于 searchParamsString 重建以避免 closure 捕获 searchParams 引用。
+    const sp = new URLSearchParams(searchParamsString);
+    const appId = sp.get("appId");
     if (!appId) {
       const params = new URLSearchParams({ appId: "*", tenantId: "*", agentId: "*", runId: "*" });
       router.replace(`${pathname}?${params.toString()}`);
     }
-  }, [searchParams.toString(), pathname, router, storeName]);
+  }, [searchParamsString, pathname, router, storeName]);
 
-  // Sync draft when URL changes
+  // Sync draft when URL changes.
+  // currentScope 来自 useMemo，仅当 searchParamsString 变化才会更新引用。
+  // setDraft 内部已经对 4 个字段做了相等性比较再返回 prev 以避免无效重渲染；
+  // setError(null) 在 error 已是 null 时也会被 React 自动跳过。
   useEffect(() => {
     setDraft(prev => {
       // Only update if values actually changed
@@ -113,7 +122,7 @@ export function MemoryScopeBar() {
       return currentScope;
     });
     setError(null);
-  }, [currentScope.appId, currentScope.tenantId, currentScope.agentId, currentScope.runId]);
+  }, [currentScope]);
 
   const presetLabel = firstUnitScope
     ? `${firstUnitScope.appId ?? "-"}/${firstUnitScope.tenantId ?? "-"}/${firstUnitScope.agentId ?? "-"}/${firstUnitScope.runId ?? "-"}`
@@ -127,7 +136,7 @@ export function MemoryScopeBar() {
       runId: (draft.runId ?? "").trim() || undefined,
     };
     if (!trimmed.appId || trimmed.appId === "appId") {
-      setError("App 是必填项");
+      setError("应用 是必填项");
       return;
     }
     setError(null);

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-search-form.tsx

@@ -36,15 +36,15 @@ export function MemorySearchForm({ scope, isLoading, onSubmit }: MemorySearchFor
     event.preventDefault();
     setError(null);
     if (!searchable) {
-      setError("请先在 Scope 栏中设置 appId 和 tenantId 的具体值");
+      setError("请先在范围栏中设置「应用」和「租户」的具体值");
       return;
     }
     if (!query.trim()) {
-      setError("请输入搜索 query");
+      setError("请输入检索内容");
       return;
     }
     if (topK < 0 || topK > 50) {
-      setError("topK 必须在 0 到 50 之间");
+      setError("Top K 必须在 0 到 50 之间");
       return;
     }
 
@@ -71,7 +71,7 @@ export function MemorySearchForm({ scope, isLoading, onSubmit }: MemorySearchFor
       </div>
 
       <div className="space-y-2">
-        <Label>Query</Label>
+        <Label>检索内容</Label>
         <Textarea
           value={query}
           onChange={(event) => setQuery(event.target.value)}
@@ -95,13 +95,13 @@ export function MemorySearchForm({ scope, isLoading, onSubmit }: MemorySearchFor
         <div className="flex items-end pb-1">
           <label className="flex items-center gap-2 text-sm">
             <Checkbox checked={enableRerank} onCheckedChange={(checked) => setEnableRerank(checked === true)} />
-            启用 Rerank
+            启用重排序
           </label>
         </div>
       </div>
 
       <div className="space-y-2">
-        <Label>Metadata Filter JSON</Label>
+        <Label>元数据过滤（JSON）</Label>
         <Textarea
           value={metadataJson}
           onChange={(event) => setMetadataJson(event.target.value)}
@@ -116,7 +116,7 @@ export function MemorySearchForm({ scope, isLoading, onSubmit }: MemorySearchFor
         {isLoading ? "搜索中..." : "搜索"}
       </Button>
       {!searchable && (
-        <p className="text-xs text-muted-foreground">请先在 Scope 栏中设置 appId 和 tenantId 的具体值。</p>
+        <p className="text-xs text-muted-foreground">请先在范围栏中设置「应用」和「租户」的具体值。</p>
       )}
     </form>
   );

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-search-results.tsx

@@ -35,7 +35,7 @@ export function MemorySearchResults({ results, elapsedMs }: MemorySearchResultsP
       <EmptyState
         icon={Brain}
         title="尚未搜索"
-        description="填写左侧查询条件后，可以验证当前 scope 下的记忆检索效果"
+        description="填写左侧查询条件后，可以验证当前范围下的记忆检索效果"
       />
     );
   }
@@ -65,17 +65,17 @@ export function MemorySearchResults({ results, elapsedMs }: MemorySearchResultsP
             <CardContent className="space-y-3 p-4">
               <div className="flex flex-wrap items-center gap-2">
                 {hit.score !== undefined && (
-                  <Badge variant="secondary">score {hit.score.toFixed(4)}</Badge>
+                  <Badge variant="secondary">相似度 {hit.score.toFixed(4)}</Badge>
                 )}
                 {hit.source && <Badge variant="outline">{hit.source}</Badge>}
                 {hit.unit.unit_type && <Badge variant="outline">{hit.unit.unit_type}</Badge>}
               </div>
               <p className="whitespace-pre-wrap text-sm">{hit.unit.text}</p>
               <div className="grid gap-2 text-xs text-muted-foreground sm:grid-cols-2">
-                <span>ID: {hit.unit.id ?? hit.unit.memoryId ?? "-"}</span>
-                <span>Scope: {formatScope(hit.unit.scope)}</span>
-                <span>Created: {formatTimestamp(hit.unit.created_at)}</span>
-                <span>Version: {hit.unit.version ?? "-"}</span>
+                <span>ID：{hit.unit.id ?? hit.unit.memoryId ?? "-"}</span>
+                <span>范围：{formatScope(hit.unit.scope)}</span>
+                <span>创建时间：{formatTimestamp(hit.unit.created_at)}</span>
+                <span>版本：{hit.unit.version ?? "-"}</span>
               </div>
             </CardContent>
           </Card>

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-store-card.tsx

@@ -85,7 +85,7 @@ function MemoryStoreCardImpl({ memoryStore, onDelete }: MemoryStoreCardProps) {
 
           <div className="mt-auto flex items-center gap-2 pt-5">
             <Badge variant="secondary" className="border-0 bg-[hsl(var(--primary-50))] text-primary">
-              Agent Memory
+              智能体记忆
             </Badge>
           </div>
         </CardContent>

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-store-list.tsx

@@ -53,7 +53,7 @@ export function MemoryStoreList() {
       <EmptyState
         icon={Brain}
         title="还没有记忆库"
-        description="创建第一个记忆库，开始管理 Agent 的长期记忆"
+        description="创建第一个记忆库，开始管理智能体的长期记忆"
         action={
           <Button asChild>
             <Link href="/memory/create">

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-unit-detail-panel.tsx

@@ -87,18 +87,18 @@ export function MemoryUnitDetailPanel({
               </p>
             </DetailRow>
             {detailUnit.search_text && (
-              <DetailRow label="Search Text">
+              <DetailRow label="检索文本">
                 <p className="whitespace-pre-wrap rounded-md bg-muted p-3 text-sm">
                   {detailUnit.search_text}
                 </p>
               </DetailRow>
             )}
-            <DetailRow label="Scope">{formatScope(detailUnit.scope)}</DetailRow>
+            <DetailRow label="范围">{formatScope(detailUnit.scope)}</DetailRow>
             <DetailRow label="类型">{detailUnit.unit_type ?? "-"}</DetailRow>
-            <DetailRow label="Salience">{detailUnit.salience ?? "-"}</DetailRow>
+            <DetailRow label="重要度">{detailUnit.salience ?? "-"}</DetailRow>
             <DetailRow label="版本">{detailUnit.version ?? "-"}</DetailRow>
             {detailUnit.metadata && (
-              <DetailRow label="Metadata">
+              <DetailRow label="元数据">
                 <pre className="overflow-auto rounded-md bg-muted p-3 text-xs">
                   {JSON.stringify(detailUnit.metadata, null, 2)}
                 </pre>

package/dist/dashboard-runtime/dashboard/src/components/memory/memory-unit-table.tsx

@@ -22,7 +22,7 @@ interface MemoryUnitTableProps {
   onDelete?: (unit: MemoryUnit) => void;
 }
 
-const DISABLED_TITLE = "当前记忆单元缺少精确 scope 或 ID，无法操作";
+const DISABLED_TITLE = "当前记忆单元缺少精确范围或 ID，无法操作";
 
 function unitId(unit: MemoryUnit): string {
   return unit.id ?? unit.memoryId ?? "-";
@@ -135,7 +135,7 @@ export function MemoryUnitTable({
   if (!units.length) {
     return (
       <div className="rounded-lg border border-dashed py-12 text-center text-sm text-muted-foreground">
-        当前 scope 下暂无记忆单元
+        当前范围下暂无记忆单元
       </div>
     );
   }

package/dist/dashboard-runtime/dashboard/src/components/qa/qa-message.tsx

@@ -24,8 +24,14 @@ import {
   CollapsibleTrigger,
 } from "@/components/ui/collapsible";
 import { Textarea } from "@/components/ui/textarea";
+import {
+  Dialog,
+  DialogContent,
+  DialogTitle,
+} from "@/components/ui/dialog";
 import { ConfirmDialog } from "@/components/shared/confirm-dialog";
 import { cn } from "@/lib/utils";
+import { IMAGE_FALLBACK_DATA_PREFIX } from "@/lib/constants";
 import type {
   ChatMessage,
   RetrievalGroup,
@@ -35,6 +41,24 @@ import type { MemorySearchHit } from "@/types/memory";
 
 import { Markdown } from "./markdown";
 
+/** Fallback for clipboard copy when navigator.clipboard is unavailable (e.g.
+ *  non-HTTPS contexts). Uses the deprecated execCommand approach. */
+function fallbackCopy(text: string) {
+  try {
+    const textarea = document.createElement("textarea");
+    textarea.value = text;
+    textarea.style.position = "fixed";
+    textarea.style.opacity = "0";
+    document.body.appendChild(textarea);
+    textarea.select();
+    document.execCommand("copy");
+    document.body.removeChild(textarea);
+    toast.success("已复制");
+  } catch {
+    toast.error("复制失败");
+  }
+}
+
 interface QaMessageProps {
   message: ChatMessage;
   /** Whether ANY turn in the session is currently streaming. All action
@@ -297,8 +321,21 @@ function UserBubble({
   const [withNextAssistant, setWithNextAssistant] = useState(true);
 
   const handleCopy = useCallback(() => {
-    void navigator.clipboard.writeText(message.content);
-    toast.success("已复制");
+    if (!message.content) return;
+    try {
+      if (navigator.clipboard && window.isSecureContext) {
+        void navigator.clipboard.writeText(message.content).then(
+          () => toast.success("已复制"),
+          () => {
+            fallbackCopy(message.content);
+          },
+        );
+      } else {
+        fallbackCopy(message.content);
+      }
+    } catch {
+      fallbackCopy(message.content);
+    }
   }, [message.content]);
 
   const handleSaveEdit = useCallback(() => {
@@ -470,8 +507,21 @@ function AssistantBlock({
     .map((g) => ({ name: g.knowledgeBaseName, reason: g.error ?? "" }));
 
   const handleCopy = useCallback(() => {
-    void navigator.clipboard.writeText(message.content);
-    toast.success("已复制");
+    if (!message.content) return;
+    try {
+      if (navigator.clipboard && window.isSecureContext) {
+        void navigator.clipboard.writeText(message.content).then(
+          () => toast.success("已复制"),
+          () => {
+            fallbackCopy(message.content);
+          },
+        );
+      } else {
+        fallbackCopy(message.content);
+      }
+    } catch {
+      fallbackCopy(message.content);
+    }
   }, [message.content]);
 
   return (
@@ -875,8 +925,17 @@ function GroupedChunkList({
 }
 
 function ChunkCard({ chunk, index }: { chunk: RetrievedChunk; index: number }) {
+  const [zoomedImage, setZoomedImage] = useState<string | null>(null);
   const fileName =
     chunk.ossKey?.split("/").pop() || chunk.ossKey || "未知文件";
+
+  const isImageChunk = chunk.chunkType?.toLowerCase() === "image";
+  const imageSrc = chunk.imageBase64
+    ? chunk.imageBase64.startsWith("data:")
+      ? chunk.imageBase64
+      : `${IMAGE_FALLBACK_DATA_PREFIX}${chunk.imageBase64}`
+    : undefined;
+
   return (
     <div className="rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--muted)/0.3)] p-3">
       <div className="mb-1.5 flex items-center gap-2 text-xs text-muted-foreground">
@@ -885,11 +944,49 @@ function ChunkCard({ chunk, index }: { chunk: RetrievedChunk; index: number }) {
         </span>
         <span className="font-medium text-foreground/80">{fileName}</span>
         <span>Chunk #{chunk.chunkId}</span>
+        {isImageChunk && (
+          <span className="rounded bg-primary/10 px-1 py-0.5 text-[10px] font-medium text-primary">
+            IMAGE
+          </span>
+        )}
         <span className="ml-auto font-mono">{chunk.score.toFixed(4)}</span>
       </div>
-      <p className="line-clamp-4 whitespace-pre-wrap text-xs text-foreground/80">
-        {chunk.content}
-      </p>
+
+      {/* 图片缩略图 */}
+      {isImageChunk && imageSrc && (
+        <img
+          src={imageSrc}
+          alt={`Image chunk #${chunk.chunkId}`}
+          className="mt-2 max-w-[180px] max-h-[180px] object-contain rounded border border-border cursor-pointer hover:opacity-80 transition-opacity"
+          onClick={() => setZoomedImage(imageSrc)}
+        />
+      )}
+
+      {/* 文本内容 */}
+      {chunk.content && (
+        <p
+          className={cn(
+            "line-clamp-4 whitespace-pre-wrap text-xs text-foreground/80",
+            isImageChunk && "mt-2",
+          )}
+        >
+          {chunk.content}
+        </p>
+      )}
+
+      {/* 图片放大预览 */}
+      <Dialog open={!!zoomedImage} onOpenChange={() => setZoomedImage(null)}>
+        <DialogContent className="max-w-[90vw] max-h-[90vh] p-2 flex items-center justify-center border-none bg-black/90 data-[state=open]:animate-none data-[state=closed]:animate-none duration-0">
+          <DialogTitle className="sr-only">图片放大预览</DialogTitle>
+          {zoomedImage && (
+            <img
+              src={zoomedImage}
+              alt="放大预览"
+              className="max-w-full max-h-[85vh] object-contain"
+            />
+          )}
+        </DialogContent>
+      </Dialog>
     </div>
   );
 }