codemini-cli 0.1.11 → 0.1.13

package/src/tui/chat-app.js

@@ -3,6 +3,7 @@ import { Box, Text, useApp, useInput } from 'ink';
 import { shouldCaptureEscapeSequence } from './input-escape.js';
 
 const h = React.createElement;
+const SUGGESTION_PAGE_SIZE = 8;
 const BANNER = [
   ' ██████  ██████  ██████  ███████ ███    ███ ██ ███    ██ ██ ',
   '██      ██    ██ ██   ██ ██      ████  ████ ██ ████   ██ ██ ',
@@ -122,13 +123,13 @@ const TUI_COPY = {
     },
     suggestion: {
       singleTab: 'Tab 补全当前命令',
-      navFill: 'Tab 保持切换模式，↑↓选择，Enter 填入',
-      navEnter: 'Tab 进入切换模式，再用 ↑↓ 选择',
+      navFill: 'Tab 保持切换模式，↑↓选择，←→翻页，Enter 填入',
+      navEnter: 'Tab 进入切换模式，再用 ↑↓ 选择，←→翻页',
       noSuggestions: '/ 查看命令，Tab 自动补全，↑↓ 历史，Ctrl+T 展开工具',
       oneNav: 'Tab 或 Enter 填入当前命令，↑↓ 历史',
       oneIdle: 'Tab 补全当前唯一候选，Enter 直接发送，↑↓ 历史',
-      manyNav: (count) => `Tab 切换候选，↑↓选择，Enter 填入 (${count} 项)`,
-      manyIdle: (count) => `Tab 进入候选切换 (${count} 项)，↑↓ 历史`
+      manyNav: (count) => `Tab 切换候选，↑↓选择，←→翻页，Enter 填入 (${count} 项)`,
+      manyIdle: (count) => `Tab 进入候选切换 (${count} 项)，↑↓ 历史，←→翻页`
     },
     runtime: {
       sendingToGateway: '正在发送到网关',
@@ -224,13 +225,13 @@ const TUI_COPY = {
     },
     suggestion: {
       singleTab: 'Tab completes the current command',
-      navFill: 'Tab stays in pick mode, ↑↓ select, Enter applies',
-      navEnter: 'Tab enters pick mode, then use ↑↓ to choose',
+      navFill: 'Tab stays in pick mode, ↑↓ select, ←→ page, Enter applies',
+      navEnter: 'Tab enters pick mode, then use ↑↓ to choose, ←→ page',
       noSuggestions: '/ shows commands, Tab autocompletes, ↑↓ history, Ctrl+T tools',
       oneNav: 'Tab or Enter applies the current command, ↑↓ history',
       oneIdle: 'Tab completes the only candidate, Enter sends, ↑↓ history',
-      manyNav: (count) => `Tab cycles candidates, ↑↓ select, Enter applies (${count} items)`,
-      manyIdle: (count) => `Tab enters candidate mode (${count} items), ↑↓ history`
+      manyNav: (count) => `Tab cycles candidates, ↑↓ select, ←→ page, Enter applies (${count} items)`,
+      manyIdle: (count) => `Tab enters candidate mode (${count} items), ↑↓ history, ←→ page`
     },
     runtime: {
       sendingToGateway: 'sending to gateway',
@@ -546,6 +547,161 @@ function renderTextLine(msg, line, idx, color) {
   );
 }
 
+export function parseAutoPlanSummaryMessage(text) {
+  const raw = String(text || '').trim();
+  if (!/^Auto plan finished\b/i.test(raw)) return null;
+
+  const lines = raw
+    .split('\n')
+    .map((line) => line.trim())
+    .filter(Boolean);
+  const parsed = {
+    statusTitle: lines[0] || '',
+    filePath: '',
+    planSummary: '',
+    finalSummary: '',
+    stepsTotal: '',
+    completed: '',
+    warnings: '',
+    failed: '',
+    warningSteps: '',
+    failedSteps: ''
+  };
+
+  for (const line of lines.slice(1)) {
+    if (line.startsWith('File: ')) parsed.filePath = line.slice('File: '.length).trim();
+    else if (line.startsWith('Plan Summary: ')) parsed.planSummary = line.slice('Plan Summary: '.length).trim();
+    else if (line.startsWith('Final Summary: ')) parsed.finalSummary = line.slice('Final Summary: '.length).trim();
+    else if (line.startsWith('Steps: ')) parsed.stepsTotal = line.slice('Steps: '.length).trim();
+    else if (line.startsWith('Completed: ')) parsed.completed = line.slice('Completed: '.length).trim();
+    else if (line.startsWith('Warnings: ')) parsed.warnings = line.slice('Warnings: '.length).trim();
+    else if (line.startsWith('Failed: ')) parsed.failed = line.slice('Failed: '.length).trim();
+    else if (line.startsWith('Warning steps: ')) parsed.warningSteps = line.slice('Warning steps: '.length).trim();
+    else if (line.startsWith('Failed steps: ')) parsed.failedSteps = line.slice('Failed steps: '.length).trim();
+  }
+
+  return parsed;
+}
+
+function PlanSummaryBubble({ msg, copy }) {
+  const theme = roleStyle(msg.label);
+  const summary = msg.planSummary || parseAutoPlanSummaryMessage(msg.text);
+  if (!summary) return null;
+
+  const statusColor =
+    Number(summary.failed || 0) > 0 ? 'redBright' : Number(summary.warnings || 0) > 0 ? 'yellowBright' : 'greenBright';
+  const isEnglish = copy?.roleLabels?.system === 'SYSTEM';
+  const labels = isEnglish
+    ? {
+        conclusion: 'Conclusion',
+        plan: 'Plan',
+        warnings: 'Warnings',
+        failed: 'Failed',
+        file: 'File',
+        steps: 'steps',
+        done: 'done',
+        warn: 'warn',
+        fail: 'fail'
+      }
+    : {
+        conclusion: '结论',
+        plan: '计划',
+        warnings: '警告',
+        failed: '失败',
+        file: '文件',
+        steps: '步骤',
+        done: '完成',
+        warn: '警告',
+        fail: '失败'
+      };
+  const metaItems = [
+    summary.stepsTotal ? `${labels.steps} ${summary.stepsTotal}` : '',
+    summary.completed ? `${labels.done} ${summary.completed}` : '',
+    summary.warnings ? `${labels.warn} ${summary.warnings}` : '',
+    summary.failed ? `${labels.fail} ${summary.failed}` : ''
+  ].filter(Boolean);
+  const shortFile = summary.filePath ? trimText(summary.filePath, 96) : '';
+
+  return h(
+    Box,
+    { marginBottom: 1, flexDirection: 'row' },
+    h(Box, { width: 2 }, h(Text, { color: theme.accent }, '│')),
+    h(
+      Box,
+      {
+        flexDirection: 'column',
+        borderStyle: 'round',
+        borderColor: theme.border,
+        paddingX: 1,
+        paddingY: 0,
+        width: '100%'
+      },
+      h(
+        Box,
+        { justifyContent: 'space-between', marginBottom: summary.finalSummary ? 1 : 0 },
+        h(
+          Box,
+          null,
+          h(Text, { color: theme.badgeText, backgroundColor: theme.badgeBg }, ` ${messageLabel(msg.label, copy)} `),
+          h(Text, { color: 'gray' }, '  '),
+          h(Text, { color: statusColor }, summary.statusTitle)
+        ),
+        h(Text, { color: theme.chrome }, ' ')
+      ),
+      summary.finalSummary
+        ? h(
+            Box,
+            { marginBottom: summary.planSummary || metaItems.length > 0 || summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
+            h(Text, { color: statusColor }, labels.conclusion),
+            h(Text, { color: 'white' }, summary.finalSummary)
+          )
+        : null,
+      summary.planSummary
+        ? h(
+            Box,
+            { marginBottom: metaItems.length > 0 || summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
+            h(Text, { color: 'cyanBright' }, labels.plan),
+            h(Text, { color: 'gray' }, summary.planSummary)
+          )
+        : null,
+      metaItems.length > 0
+        ? h(
+            Box,
+            { marginBottom: summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0 },
+            ...metaItems.flatMap((item, idx) => [
+              idx > 0 ? h(Text, { key: `sep-${idx}`, color: 'gray' }, '  ') : null,
+              h(Text, { key: `meta-${idx}`, color: 'gray' }, item)
+            ])
+          )
+        : null,
+      summary.warningSteps
+        ? h(
+            Box,
+            { marginBottom: summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
+            h(Text, { color: 'yellowBright' }, labels.warnings),
+            h(Text, { color: 'gray' }, summary.warningSteps)
+          )
+        : null,
+      summary.failedSteps
+        ? h(
+            Box,
+            { marginBottom: shortFile ? 1 : 0, flexDirection: 'column' },
+            h(Text, { color: 'redBright' }, labels.failed),
+            h(Text, { color: 'gray' }, summary.failedSteps)
+          )
+        : null,
+      shortFile
+        ? h(
+            Box,
+            { flexDirection: 'column' },
+            h(Text, { color: 'gray' }, labels.file),
+            h(Text, { color: 'gray' }, shortFile)
+          )
+        : null
+    )
+  );
+}
+
 const BUBBLE_CHROME_ROWS = 4;
 
 function charDisplayWidth(ch) {
@@ -728,7 +884,70 @@ function getSuggestionDisplay(item) {
   return typeof item === 'string' ? item : String(item?.display || item?.value || '');
 }
 
+function getSuggestionDescription(item) {
+  return typeof item === 'string' ? '' : String(item?.description || '');
+}
+
+export function formatSuggestionDescription(text, maxChars = 40) {
+  const value = String(text || '').replace(/\s+/g, ' ').trim();
+  if (!value) return '';
+  const limit = Math.max(4, Number(maxChars) || 40);
+  if (value.length <= limit) return value;
+  return `${value.slice(0, limit - 3)}...`;
+}
+
+export function getSuggestionPageState(commandSuggestions, menuIndex, pageSize = SUGGESTION_PAGE_SIZE) {
+  const items = Array.isArray(commandSuggestions) ? commandSuggestions : [];
+  const normalizedPageSize = Math.max(1, Number(pageSize) || SUGGESTION_PAGE_SIZE);
+  const safeIndex = items.length === 0 ? 0 : Math.max(0, Math.min(Number(menuIndex) || 0, items.length - 1));
+  const pageIndex = Math.floor(safeIndex / normalizedPageSize);
+  const pageCount = Math.max(1, Math.ceil(items.length / normalizedPageSize));
+  const pageStart = pageIndex * normalizedPageSize;
+  const pageEnd = Math.min(items.length, pageStart + normalizedPageSize);
+  return {
+    pageSize: normalizedPageSize,
+    safeIndex,
+    pageIndex,
+    pageCount,
+    pageStart,
+    pageEnd,
+    pageItems: items.slice(pageStart, pageEnd)
+  };
+}
+
+export function moveSuggestionSelection(currentIndex, itemCount, direction, pageSize = SUGGESTION_PAGE_SIZE) {
+  const total = Math.max(0, Number(itemCount) || 0);
+  if (total <= 0) return 0;
+  const normalizedPageSize = Math.max(1, Number(pageSize) || SUGGESTION_PAGE_SIZE);
+  const safeIndex = Math.max(0, Math.min(Number(currentIndex) || 0, total - 1));
+
+  if (direction === 'left') {
+    if (safeIndex < normalizedPageSize) return 0;
+    return Math.max(0, safeIndex - normalizedPageSize);
+  }
+
+  if (direction === 'right') {
+    const currentPageStart = Math.floor(safeIndex / normalizedPageSize) * normalizedPageSize;
+    const currentPageEnd = Math.min(total, currentPageStart + normalizedPageSize);
+    if (currentPageEnd >= total) return safeIndex;
+    return Math.min(total - 1, safeIndex + normalizedPageSize);
+  }
+
+  if (direction === 'up') {
+    return Math.max(0, safeIndex - 1);
+  }
+
+  if (direction === 'down') {
+    return Math.min(total - 1, safeIndex + 1);
+  }
+
+  return safeIndex;
+}
+
 function MessageBubble({ msg, loaderTick, showToolDetails, rowWindow = null, contentWidth = 72, copy }) {
+  if (msg?.planSummary || parseAutoPlanSummaryMessage(msg?.text)) {
+    return h(PlanSummaryBubble, { msg, copy });
+  }
   const theme = roleStyle(msg.label);
   const allRows = buildMessageRows(msg, showToolDetails, contentWidth);
   const start = rowWindow ? Math.max(0, rowWindow.start || 0) : 0;
@@ -870,7 +1089,8 @@ function MessageList({ messages, loaderTick, showToolDetails, contentWidth = 72,
 
 function SuggestionPanel({ commandSuggestions, suggestionNav, menuIndex, copy }) {
   if (commandSuggestions.length === 0) return null;
-  const grouped = groupCommandSuggestions(commandSuggestions);
+  const pageState = getSuggestionPageState(commandSuggestions, menuIndex);
+  const grouped = groupCommandSuggestions(pageState.pageItems);
   let flatIndex = -1;
   const panelHint =
     commandSuggestions.length === 1
@@ -892,7 +1112,7 @@ function SuggestionPanel({ commandSuggestions, suggestionNav, menuIndex, copy })
       Box,
       { marginBottom: 1 },
       h(Text, { color: 'magentaBright' }, suggestionNav ? copy.generic.commandPaletteGroupedSelect : copy.generic.commandPaletteGroupedSuggestions),
-      h(Text, { color: 'gray' }, `  ${panelHint}`)
+      h(Text, { color: 'gray' }, `  ${panelHint}  ·  ${pageState.pageIndex + 1}/${pageState.pageCount}`)
     ),
     ...grouped.flatMap(([group, items]) => {
       const nodes = [
@@ -905,13 +1125,17 @@ function SuggestionPanel({ commandSuggestions, suggestionNav, menuIndex, copy })
       ];
       items.forEach((c) => {
         flatIndex += 1;
-        const active = suggestionNav && menuIndex === flatIndex;
+        const active = suggestionNav && menuIndex === pageState.pageStart + flatIndex;
         const label = getSuggestionDisplay(c);
+        const description = formatSuggestionDescription(getSuggestionDescription(c), 42);
         nodes.push(
           h(
             Box,
             { key: `opt-${group}-${getSuggestionValue(c)}` },
-            h(Text, { color: active ? 'black' : 'magenta', backgroundColor: active ? 'magentaBright' : undefined }, `${active ? ' > ' : '   '}${label}`)
+            h(Text, { color: active ? 'black' : 'magenta', backgroundColor: active ? 'magentaBright' : undefined }, `${active ? ' > ' : '   '}${label}`),
+            description
+              ? h(Text, { color: active ? 'black' : 'gray', backgroundColor: active ? 'magentaBright' : undefined }, `  ${description}`)
+              : null
           )
         );
       });
@@ -1143,7 +1367,7 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
 
   const commandSuggestions =
     inputValue.startsWith('/')
-      ? (runtime.getCompletionOptions(inputValue) || []).slice(0, 8)
+      ? runtime.getCompletionOptions(inputValue) || []
       : [];
   const hasTransientPanels =
     commandSuggestions.length > 0 || pendingQueue.length > 0 || debugKeys || Boolean(planState?.total);
@@ -1338,9 +1562,16 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
       }
       return;
     }
+    const parsedPlanSummary = result.type === 'system' ? parseAutoPlanSummaryMessage(result.text || '') : null;
     setMessages((prev) => [
       ...prev,
-      { id: nextId(), label: 'system', text: result.text || '', color: 'yellowBright' }
+      {
+        id: nextId(),
+        label: 'system',
+        text: result.text || '',
+        color: 'yellowBright',
+        ...(parsedPlanSummary ? { planSummary: parsedPlanSummary } : {})
+      }
     ]);
   };
 
@@ -1688,7 +1919,7 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
 
     if (key.upArrow) {
       if (suggestionNav && commandSuggestions.length > 0) {
-        setMenuIndex((prev) => Math.max(0, prev - 1));
+        setMenuIndex((prev) => moveSuggestionSelection(prev, commandSuggestions.length, 'up'));
         return;
       }
       if (history.length === 0) return;
@@ -1714,7 +1945,7 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
 
     if (key.downArrow) {
       if (suggestionNav && commandSuggestions.length > 0) {
-        setMenuIndex((prev) => Math.min(commandSuggestions.length - 1, prev + 1));
+        setMenuIndex((prev) => moveSuggestionSelection(prev, commandSuggestions.length, 'down'));
         return;
       }
       if (history.length === 0 || historyIndex === null) return;
@@ -1735,6 +1966,10 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
       return;
     }
     if (key.leftArrow) {
+      if (suggestionNav && commandSuggestions.length > 0) {
+        setMenuIndex((prev) => moveSuggestionSelection(prev, commandSuggestions.length, 'left'));
+        return;
+      }
       setSuggestionNav(false);
       const next = Math.max(0, cursorIndexRef.current - 1);
       cursorIndexRef.current = next;
@@ -1742,6 +1977,10 @@ export function ChatApp({ runtime, sessionId, model, language = 'zh', shellName
       return;
     }
     if (key.rightArrow) {
+      if (suggestionNav && commandSuggestions.length > 0) {
+        setMenuIndex((prev) => moveSuggestionSelection(prev, commandSuggestions.length, 'right'));
+        return;
+      }
       setSuggestionNav(false);
       const next = Math.min(inputValue.length, cursorIndexRef.current + 1);
       cursorIndexRef.current = next;