@steerable/agent-shell-web 0.6.64 → 0.6.66

package/src/components/chat/MessageList.tsx

@@ -21,7 +21,8 @@ import type { InspectTaskInput } from './executed-actions-model';
 import type { ChildInfo } from './OrchestrationChildrenCard';
 import type { ChatMode } from './ChatInput';
 import type { TurnBlock } from './turn-timeline';
-import type { TurnFile } from './turn-files';
+import { followedPreviewPath, type TurnFile } from './turn-files';
+import { publishConversationPreview } from '@/layouts/conversation-preview';
 import { inferDurationMs, readPersistedDurationMs } from './elapsed';
 import type { LlmSpeedSnapshot } from './process-status';
 
@@ -54,6 +55,27 @@ import type { LlmSpeedSnapshot } from './process-status';
 
 const NEAR_BOTTOM_THRESHOLD_PX = 100;
 
+/** 视口上三分之一附近的助手消息，当作当前正在看的回合。 */
+function assistantIdInView(container: HTMLElement): string | null {
+  const bounds = container.getBoundingClientRect();
+  const anchor = bounds.top + container.clientHeight * 0.35;
+  const nodes = container.querySelectorAll<HTMLElement>(
+    '[data-message-role="assistant"][data-message-id]',
+  );
+  let bestId: string | null = null;
+  let bestDistance = Number.POSITIVE_INFINITY;
+  for (const node of nodes) {
+    const rect = node.getBoundingClientRect();
+    if (rect.bottom < bounds.top || rect.top > bounds.bottom) continue;
+    const distance = Math.abs(rect.top - anchor);
+    const messageId = node.getAttribute('data-message-id');
+    if (!messageId || distance >= bestDistance) continue;
+    bestId = messageId;
+    bestDistance = distance;
+  }
+  return bestId;
+}
+
 function internalTrigger(message: ChatMessage): 'goal' | 'loop' | null {
   if (!message.messageMetadata) return null;
   try {
@@ -240,6 +262,41 @@ export function MessageList({
     };
   }, [checkAtBottom]);
 
+  // 右侧预览跟着这一屏在看的回合。停在底部时用最近一份能打开的产物。
+  useEffect(() => {
+    if (!chatId) return;
+    const publish = () => {
+      const el = containerRef.current;
+      if (!el) return;
+      const atBottom =
+        el.scrollHeight - el.scrollTop - el.clientHeight < NEAR_BOTTOM_THRESHOLD_PX;
+      const ordered = visibleMessages
+        .filter((message) => message.role === 'assistant')
+        .map((message) => ({
+          id: message.id,
+          files: message.id === lastAssistantId
+            ? (turnFilesByMessageId?.[message.id] ?? currentTurnFiles)
+            : turnFilesByMessageId?.[message.id],
+        }));
+      const selected = followedPreviewPath(ordered, {
+        atBottom,
+        focusedId: atBottom ? null : assistantIdInView(el),
+      });
+      if (!selected) return;
+      publishConversationPreview({
+        chatId,
+        messageId: selected.messageId,
+        path: selected.path,
+      });
+    };
+    publish();
+    const el = containerRef.current;
+    el?.addEventListener('scroll', publish, { passive: true });
+    return () => {
+      el?.removeEventListener('scroll', publish);
+    };
+  }, [chatId, currentTurnFiles, lastAssistantId, messages, turnFilesByMessageId]);
+
   // Snap to bottom on first paint, regardless of whether the user "was" at
   // the bottom — there's no "before" on mount.
   useLayoutEffect(() => {

package/src/components/chat/TaskOutcomeCards.tsx

@@ -42,7 +42,7 @@ export function TaskOutcomeCards({ tasks, onInspect, onDismiss }: TaskOutcomeCar
       ))}
       {overflow > 0 && (
         <div className="px-1 text-[11px] text-agent-muted-foreground">
-          {t('{count} more background tasks finished. See the tasks button in the title bar.', {
+          {t('{count} more background tasks finished. See Chat resources in the title bar.', {
             count: overflow,
           })}
         </div>
@@ -103,7 +103,7 @@ function TaskOutcomeCard({
             <span className="min-w-0 truncate font-mono text-[10px]">
               {task.worktreeBranch}
             </span>
-            <span>{t('Awaiting merge. Handle it from the tasks button in the title bar.')}</span>
+            <span>{t('Awaiting merge. Handle it from Chat resources in the title bar.')}</span>
           </div>
         )}
       </div>

package/src/components/chat/turn-files.ts

@@ -388,3 +388,60 @@ export function groupTurnFiles(
 
   return { deliverables, intermediates, totalAdditions, totalDeletions };
 }
+
+/** 右侧栏能直接打开的扩展名。交付物优先，同层里靠前的类型优先。 */
+const RIGHT_PREVIEW_EXTENSIONS = [
+  '.pptx', // shell-neutral:allow — Office 幻灯片扩展名，不是产品品牌
+  '.ppt', // shell-neutral:allow — Office 幻灯片扩展名，不是产品品牌
+  '.docx',
+  '.doc',
+  '.md',
+  '.markdown',
+];
+
+/**
+ * 这一轮在右侧栏里该显示的文件。
+ * 交付物压过脚本和中间产物；同一层里幻灯片、文档、Markdown 依次优先。
+ */
+export function previewPathForTurn(files: readonly TurnFile[] | undefined): string | null {
+  if (!files || files.length === 0) return null;
+  let best: { path: string; rank: number; deliverable: boolean } | null = null;
+  for (const file of files) {
+    if (isIgnoredTurnFile(file.path)) continue;
+    const rank = RIGHT_PREVIEW_EXTENSIONS.indexOf(getFileExtension(file.path));
+    if (rank < 0) continue;
+    const deliverable = getTurnFileCategory(file) === 'deliverable';
+    if (
+      !best
+      || (deliverable && !best.deliverable)
+      || (deliverable === best.deliverable && rank < best.rank)
+    ) {
+      best = { path: file.path, rank, deliverable };
+    }
+  }
+  return best?.path ?? null;
+}
+
+/**
+ * 右侧预览跟着对话走。
+ * 停在底部时用最近一轮有预览的产物；往上翻时只用当前看着的那条助手消息。
+ */
+export function followedPreviewPath(
+  ordered: readonly { id: string; files?: readonly TurnFile[] }[],
+  options: { atBottom: boolean; focusedId: string | null },
+): { messageId: string; path: string } | null {
+  const pick = (entry: { id: string; files?: readonly TurnFile[] } | undefined) => {
+    if (!entry) return null;
+    const path = previewPathForTurn(entry.files);
+    return path ? { messageId: entry.id, path } : null;
+  };
+  if (options.atBottom) {
+    for (let index = ordered.length - 1; index >= 0; index -= 1) {
+      const found = pick(ordered[index]);
+      if (found) return found;
+    }
+    return null;
+  }
+  if (!options.focusedId) return null;
+  return pick(ordered.find((entry) => entry.id === options.focusedId));
+}

package/src/hooks/useProjects.ts

@@ -5,7 +5,8 @@
 import { useCallback, useEffect, useSyncExternalStore } from 'react';
 import { hasHostBridge } from '@/lib/host-bridge';
 import { hostToolChrome } from '@/lib/host-tools';
-import { listProjects, type LocalProject } from '@/lib/local-api';
+import { listProjects, reorderProjects, type LocalProject } from '@/lib/local-api';
+import { applyProjectIdOrder } from '@/lib/project-order';
 
 type ProjectsSnapshot = {
   projects: LocalProject[];
@@ -57,6 +58,34 @@ export async function refreshProjects(): Promise<void> {
   }
 }
 
+/**
+ * 立刻按 orderedIds 重排共享列表，再写到服务端。
+ * 保存失败时把列表滚回拖拽前的顺序，并抛出原来的错误。
+ */
+export async function persistProjectOrder(orderedIds: string[]): Promise<void> {
+  const previous = snapshot;
+  const seq = ++requestSeq;
+  snapshot = {
+    projects: applyProjectIdOrder(previous.projects, orderedIds),
+    error: previous.error,
+  };
+  emit();
+  try {
+    const res = await reorderProjects(orderedIds);
+    if (seq !== requestSeq) return;
+    snapshot = {
+      projects: Array.isArray(res.projects) ? res.projects : snapshot.projects,
+      error: null,
+    };
+    emit();
+  } catch (err) {
+    if (seq !== requestSeq) return;
+    snapshot = previous;
+    emit();
+    throw err instanceof Error ? err : new Error(String(err));
+  }
+}
+
 export function useProjects(): {
   projects: LocalProject[];
   error: string | null;