codemini-cli 0.4.1 → 0.4.2

package/src/tui/chat-app.js

@@ -142,6 +142,7 @@ const TUI_COPY = {
         '🧩 用 /mode plan 切换到规划模式，让 AI 先出方案再动手。',
         '🆕 /new 可以新建一个干净的会话，重新开始工作。',
         '🧠 /memory 查看和管理 AI 的持久记忆，帮助它更好地理解你的偏好。',
+        '🌐 web_fetch 默认轻量读取网页；如需更好读取 JS 渲染页面，可运行 npm install -g playwright && playwright install chromium。',
         '💤 CodeMini 会自动"做梦"休息，整理错误信息并自我优化，越用越聪明~'
       ],
       toolSummaryExpanded: '工具摘要：已展开',
@@ -314,6 +315,18 @@ const TUI_COPY = {
       inputLocked: '计划审批进行中，请在审批框输入 /yes、/edit 或 /reject',
       answerLabel: '审批输入',
       answerPlaceholder: '/yes | /edit <反馈> | /reject'
+    },
+    reflectApproval: {
+      title: '审阅 Reflect 技能草稿？',
+      scopeLabel: '范围',
+      nameLabel: '名称',
+      targetLabel: '目标',
+      prompt: '输入 /yes 写入，输入 /edit <反馈> 修改，输入 /no 丢弃。',
+      invalidAnswer: '请输入 /yes、/edit <反馈> 或 /no。',
+      missingFeedback: '请在 /edit 后提供反馈内容。',
+      inputLocked: 'Reflect 审阅进行中，请在审阅框输入 /yes、/edit 或 /no',
+      answerLabel: '审阅输入',
+      answerPlaceholder: '/yes | /edit <反馈> | /no'
     }
   },
   en: {
@@ -354,6 +367,7 @@ const TUI_COPY = {
         '🧩 Use /mode plan to switch to planning mode — AI proposes a plan before coding.',
         '🆕 /new starts a fresh session to begin a clean slate.',
         '🧠 /memory lets you view and manage the AI\'s persistent memory for better personalization.',
+        '🌐 web_fetch uses a lightweight reader by default. For better JS-rendered pages: npm install -g playwright && playwright install chromium.',
         '💤 CodeMini auto-"dreams" to rest, consolidate errors, and self-optimize — it gets smarter over time~'
       ],
       toolSummaryExpanded: 'Tool summary: expanded',
@@ -526,6 +540,18 @@ const TUI_COPY = {
       inputLocked: 'Plan approval is active; type /yes, /edit <feedback>, or /reject',
       answerLabel: 'Approval input',
       answerPlaceholder: '/yes | /edit <feedback> | /reject'
+    },
+    reflectApproval: {
+      title: 'Review this reflected skill draft?',
+      scopeLabel: 'Scope',
+      nameLabel: 'Name',
+      targetLabel: 'Target',
+      prompt: 'Type /yes to write, /edit <feedback> to revise, or /no to discard.',
+      invalidAnswer: 'Please enter /yes, /edit <feedback>, or /no.',
+      missingFeedback: 'Please provide feedback after /edit.',
+      inputLocked: 'Reflect review is active; type /yes, /edit <feedback>, or /no',
+      answerLabel: 'Review input',
+      answerPlaceholder: '/yes | /edit <feedback> | /no'
     }
   }
 };
@@ -539,13 +565,24 @@ function getCopy(language) {
 }
 
 function messageLabel(label, copy) {
-  return copy.roleLabels[label] || String(label || '').toUpperCase();
+  return copy?.roleLabels?.[label] || String(label || '').toUpperCase();
 }
 
 function roleStyle(label) {
   return ROLE_STYLES[label] || ROLE_STYLES.system;
 }
 
+const PLAN_AGENT_ROLES = new Set(['planner', 'coder', 'reviewer', 'tester', 'summarizer']);
+
+function normalizePlanAgentRole(role) {
+  const roleKey = String(role || '').trim().toLowerCase();
+  return PLAN_AGENT_ROLES.has(roleKey) ? roleKey : 'coder';
+}
+
+export function formatPlanAgentLabel(role, copy) {
+  return messageLabel(normalizePlanAgentRole(role), copy);
+}
+
 function StatusPill({ label, value, color = 'cyanBright', textColor = 'black' }) {
   return h(
     Box,
@@ -892,7 +929,7 @@ function textFromSessionContent(content) {
   return sanitizeRenderableText(String(content || ''));
 }
 
-function buildUiMessagesFromSessionHistory(sessionMessages, nextId) {
+export function buildUiMessagesFromSessionHistory(sessionMessages, nextId) {
   const source = Array.isArray(sessionMessages) ? sessionMessages : [];
   const out = [];
 
@@ -901,7 +938,7 @@ function buildUiMessagesFromSessionHistory(sessionMessages, nextId) {
     if (message.role === 'tool') continue;
 
     const text = textFromSessionContent(message.content);
-    if (!text.trim() && message.role !== 'assistant') continue;
+    if (!text.trim()) continue;
 
     if (message.role === 'user') {
       out.push({ id: nextId(), label: 'you', text, color: 'blueBright' });
@@ -1109,6 +1146,25 @@ export function parsePlanApprovalAnswer(value) {
   return { action: 'invalid', command: '' };
 }
 
+export function parseReflectApprovalAnswer(value) {
+  const raw = String(value || '').trim();
+  if (!raw) return { action: 'empty', command: '' };
+  const normalized = raw.toLowerCase();
+  if (normalized === '/yes' || normalized === 'yes') {
+    return { action: 'approve', command: '/yes' };
+  }
+  if (normalized === '/no' || normalized === 'no') {
+    return { action: 'reject', command: '/no' };
+  }
+  const editMatch = raw.match(/^\/?edit(?:\s+(.+))?$/i);
+  if (editMatch) {
+    const feedback = String(editMatch[1] || '').trim();
+    if (!feedback) return { action: 'missing_feedback', command: '' };
+    return { action: 'edit', feedback, command: `/edit ${feedback}` };
+  }
+  return { action: 'invalid', command: '' };
+}
+
 export function parsePendingPlanApprovalMessage(text = '') {
   const raw = String(text || '');
   if (!/^Plan approval is still pending\./i.test(raw.trim())) return null;
@@ -1122,6 +1178,21 @@ export function parsePendingPlanApprovalMessage(text = '') {
   return out;
 }
 
+export function parsePendingReflectSkillMessage(text = '') {
+  const raw = String(text || '');
+  if (!/\bReflect skill draft pending\./i.test(raw)) return null;
+  const lines = raw.split(/\r?\n/);
+  const out = { scope: '', name: '', confidence: '', targetPath: '' };
+  for (const line of lines) {
+    const trimmed = line.trim();
+    if (trimmed.startsWith('Scope: ')) out.scope = trimmed.slice('Scope: '.length).trim();
+    else if (/^\[\d+\]\s+/.test(trimmed) && !out.name) out.name = trimmed.replace(/^\[\d+\]\s+/, '').trim();
+    else if (trimmed.startsWith('Confidence: ')) out.confidence = trimmed.slice('Confidence: '.length).trim();
+    else if (trimmed.startsWith('Target: ')) out.targetPath = trimmed.slice('Target: '.length).trim();
+  }
+  return out;
+}
+
 export function formatDeleteApprovalLines(copy, request) {
   const details = normalizeDeleteApprovalRequest(request);
   if (!details) return [];
@@ -1141,6 +1212,17 @@ export function formatPlanApprovalLines(copy, request) {
   return [String(copy?.planApproval?.title || '').trim()].filter(Boolean);
 }
 
+export function formatReflectApprovalLines(copy, request) {
+  if (!request) return [];
+  const c = copy?.reflectApproval || {};
+  const lines = [String(c.title || '').trim()];
+  if (request.scope) lines.push(`${c.scopeLabel || 'Scope'}: ${request.scope}`);
+  if (request.name) lines.push(`${c.nameLabel || 'Name'}: ${request.name}`);
+  if (request.targetPath) lines.push(`${c.targetLabel || 'Target'}: ${request.targetPath}`);
+  if (c.prompt) lines.push(c.prompt);
+  return lines.filter(Boolean);
+}
+
 function getActivityDisplayParts(activity) {
   if (isCodeGenerationActivityName(activity?.name)) {
     return {
@@ -1419,10 +1501,9 @@ function PlanStrip({ planState, copy }) {
             Box,
             { flexDirection: 'column' },
             ...planState.steps.map((step, idx) => {
-                const roleKey = step.role ? step.role.toLowerCase() : '';
-                const normalizedRole = ['planner', 'coder', 'reviewer', 'tester', 'summarizer'].includes(roleKey) ? roleKey : 'coder';
+                const normalizedRole = normalizePlanAgentRole(step.role);
                 const stepTheme = roleStyle(normalizedRole);
-                const roleTag = step.role ? step.role.toUpperCase() : '';
+                const roleTag = formatPlanAgentLabel(normalizedRole, copy);
                 const stepDone = step.status === 'done' || isDone;
                 const stepFailed = step.status === 'failed';
                 const marker = stepFailed ? '✗' : stepDone ? '✓' : '·';
@@ -1431,8 +1512,8 @@ function PlanStrip({ planState, copy }) {
                   Box,
                   { key: `plan-step-${idx}` },
                   h(Text, { color: markerColor }, `${marker} `),
-                  roleTag ? h(Text, { color: stepTheme.badgeText, backgroundColor: stepTheme.badgeBg }, ` ${roleTag} `) : null,
-                  roleTag ? h(Text, { color: 'gray' }, ' ') : null,
+                  h(Text, { color: stepTheme.badgeText, backgroundColor: stepTheme.badgeBg }, ` ${roleTag} `),
+                  h(Text, { color: 'gray' }, ' '),
                   h(Text, { color: stepDone && !stepFailed ? 'gray' : 'white' }, `${step.index}. ${step.title}`)
                 );
               }
@@ -1519,6 +1600,30 @@ function renderTextLine(msg, line, idx, color) {
   );
 }
 
+function historyListLineColor(line, fallbackColor) {
+  const raw = String(line || '');
+  const trimmed = raw.trim();
+  if (!trimmed) return fallbackColor;
+  if (/^Current session\s+/i.test(trimmed) || /^Recent sessions$/i.test(trimmed) || /^\d+\.\s+\S+/.test(trimmed)) {
+    return 'cyanBright';
+  }
+  if (/^Messages\s+\d+$/i.test(trimmed) || /^\d+\s+msgs?\s+\|\s+updated\b/i.test(trimmed) || /^Tip:/i.test(trimmed)) {
+    return 'gray';
+  }
+  if (/^resume:\s+\/history resume\b/i.test(trimmed)) {
+    return 'blueBright';
+  }
+  return 'white';
+}
+
+function isHistoryListMessage(msg) {
+  const text = String(msg?.text || '');
+  return msg?.label === 'system' &&
+    /^Current session\s+/m.test(text) &&
+    /^Recent sessions$/m.test(text) &&
+    /resume:\s+\/history resume\b/m.test(text);
+}
+
 export function parseAutoPlanSummaryMessage(text) {
   const raw = String(text || '').trim();
   if (!/^Auto plan finished\b/i.test(raw)) return null;
@@ -1963,7 +2068,7 @@ function PlanSummaryBubble({ msg, copy }) {
             Box,
             { marginBottom: planSteps.length > 0 || summary.approval || metaItems.length > 0 || summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
             h(Text, { color: 'cyanBright' }, labels.plan),
-            h(Text, { color: 'gray' }, summary.planSummary)
+            h(Text, { color: 'white' }, summary.planSummary)
           )
         : null,
       planSteps.length > 0
@@ -1972,12 +2077,20 @@ function PlanSummaryBubble({ msg, copy }) {
             { marginBottom: summary.approval || metaItems.length > 0 || summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
             h(Text, { color: 'cyanBright' }, labels.steps),
             ...planSteps.flatMap((step, idx) => {
-              const roleTag = String(step?.role || '').trim().toUpperCase() || 'CODER';
+              const roleKey = normalizePlanAgentRole(step?.role);
+              const stepTheme = roleStyle(roleKey);
+              const roleTag = formatPlanAgentLabel(roleKey, copy);
               const titleText = String(step?.title || '-').trim() || '-';
               const taskText = String(step?.task || '').trim();
-              const titleRow = h(Text, { key: `plan-step-title-${idx}`, color: 'gray' }, `${idx + 1}. [${roleTag}] ${titleText}`);
+              const titleRow = h(
+                Text,
+                { key: `plan-step-title-${idx}`, color: 'white' },
+                `${idx + 1}. `,
+                h(Text, { color: stepTheme.badgeText, backgroundColor: stepTheme.badgeBg }, ` ${roleTag} `),
+                ` ${titleText}`
+              );
               if (!taskText) return [titleRow];
-              const taskRow = h(Text, { key: `plan-step-task-${idx}`, color: 'gray' }, `   - task: ${taskText}`);
+              const taskRow = h(Text, { key: `plan-step-task-${idx}`, color: 'white' }, `   - task: ${taskText}`);
               return [titleRow, taskRow];
             })
           )
@@ -1987,7 +2100,7 @@ function PlanSummaryBubble({ msg, copy }) {
             Box,
             { marginBottom: metaItems.length > 0 || summary.warningSteps || summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
             h(Text, { color: 'yellowBright' }, labels.approval),
-            h(Text, { color: 'gray' }, summary.approval)
+            h(Text, { color: 'white' }, summary.approval)
           )
         : null,
       metaItems.length > 0
@@ -1996,7 +2109,7 @@ function PlanSummaryBubble({ msg, copy }) {
             { 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)
+              h(Text, { key: `meta-${idx}`, color: 'white' }, item)
             ])
           )
         : null,
@@ -2005,7 +2118,7 @@ function PlanSummaryBubble({ msg, copy }) {
             Box,
             { marginBottom: summary.failedSteps || shortFile ? 1 : 0, flexDirection: 'column' },
             h(Text, { color: 'yellowBright' }, labels.warnings),
-            h(Text, { color: 'gray' }, summary.warningSteps)
+            h(Text, { color: 'white' }, summary.warningSteps)
           )
         : null,
       summary.failedSteps
@@ -2013,7 +2126,7 @@ function PlanSummaryBubble({ msg, copy }) {
             Box,
             { marginBottom: shortFile ? 1 : 0, flexDirection: 'column' },
             h(Text, { color: 'redBright' }, labels.failed),
-            h(Text, { color: 'gray' }, summary.failedSteps)
+            h(Text, { color: 'white' }, summary.failedSteps)
           )
         : null,
       shortFile
@@ -2309,6 +2422,7 @@ export function collapseActivityChainRows(inputRows, showToolDetails, copy, maxV
 
 export function buildMessageRows(msg, showToolDetails, contentWidth = 72, copy) {
   const rows = [];
+  const isHistoryList = isHistoryListMessage(msg);
   const pushTextRows = (text) => {
     const lines = String(text || '').split('\n');
     let codeFence = false;
@@ -2329,8 +2443,8 @@ export function buildMessageRows(msg, showToolDetails, contentWidth = 72, copy)
         continue;
       }
       if (isMarkdownTableHeader(line, lines[lineIndex + 1])) {
-        const tableLines = [line];
-        lineIndex += 1; // skip separator
+        const tableLines = [line, lines[lineIndex + 1]];
+        lineIndex += 1; // separator included above
         while (lineIndex + 1 < lines.length && splitMarkdownTableCells(lines[lineIndex + 1]).length > 1) {
           tableLines.push(lines[lineIndex + 1]);
           lineIndex += 1;
@@ -2339,7 +2453,8 @@ export function buildMessageRows(msg, showToolDetails, contentWidth = 72, copy)
         continue;
       }
       let color = msg.color || roleStyle(msg.label).text || 'white';
-      if (line.startsWith('#')) color = 'cyanBright';
+      if (isHistoryList) color = historyListLineColor(line, color);
+      else if (line.startsWith('#')) color = 'cyanBright';
       else if (trimmed.startsWith('- ') || trimmed.startsWith('* ')) color = 'magentaBright';
       else if (trimmed.startsWith('>')) color = 'yellow';
       else if (/^[|└├│]/.test(trimmed)) color = 'gray';
@@ -2515,36 +2630,36 @@ export function renderMessageRow(msg, row, idx, loaderTick) {
     return h(
       Box,
       { key: `row-table-${msg.id}-${idx}`, marginLeft: 1 },
-      h(Text, { color: row.isHeader ? 'cyanBright' : 'gray', bold: Boolean(row.isHeader) }, row.text)
+      h(Text, { color: 'white', bold: Boolean(row.isHeader) }, row.text)
     );
   }
   if (row.kind === 'table-separator') {
     return h(
       Box,
       { key: `row-table-sep-${msg.id}-${idx}`, marginLeft: 1 },
-      h(Text, { color: 'gray' }, row.text)
+      h(Text, { color: 'white' }, row.text)
     );
   }
   if (row.kind === 'table-vertical') {
     return h(
       Box,
       { key: `row-table-v-${msg.id}-${idx}`, marginLeft: 1 },
-      h(Text, { color: 'cyanBright', bold: true }, `${row.label}:`),
-      h(Text, { color: 'gray' }, row.text ? ` ${row.text}` : '')
+      h(Text, { color: 'white', bold: true }, `${row.label}:`),
+      h(Text, { color: 'white' }, row.text ? ` ${row.text}` : '')
     );
   }
   if (row.kind === 'table-vertical-continuation') {
     return h(
       Box,
       { key: `row-table-vc-${msg.id}-${idx}`, marginLeft: 3 },
-      h(Text, { color: 'gray' }, row.text)
+      h(Text, { color: 'white' }, row.text)
     );
   }
   if (row.kind === 'table-vertical-separator') {
     return h(
       Box,
       { key: `row-table-vs-${msg.id}-${idx}`, marginLeft: 1 },
-      h(Text, { color: 'gray' }, row.text)
+      h(Text, { color: 'white' }, row.text)
     );
   }
   if (row.kind === 'activity-collapsed') {
@@ -3150,6 +3265,38 @@ function PlanApprovalPanel({ request, inputValue, errorText, copy, cursorVisible
   );
 }
 
+function ReflectApprovalPanel({ request, inputValue, errorText, copy, cursorVisible }) {
+  if (!request) return null;
+  const placeholder = String(copy.reflectApproval.answerPlaceholder || '').trim();
+  const lines = formatReflectApprovalLines(copy, request);
+  return h(
+    Box,
+    {
+      marginTop: 1,
+      flexDirection: 'column',
+      borderStyle: 'round',
+      borderColor: 'yellowBright',
+      paddingX: 1,
+      paddingY: 0
+    },
+    ...lines.map((line, index) =>
+      h(Text, { key: `reflect-approval-line-${index}`, color: 'yellowBright' }, line)
+    ),
+    h(
+      Box,
+      { marginTop: 1 },
+      h(Text, { color: 'yellowBright' }, `${copy.reflectApproval.answerLabel}: `),
+      h(ApprovalCursorLine, {
+        inputValue,
+        placeholder: placeholder || ' ',
+        cursorVisible,
+        accent: 'yellowBright'
+      })
+    ),
+    errorText ? h(Text, { color: 'yellowBright' }, errorText) : null
+  );
+}
+
 function SignatureBar({ version = '' }) {
   return h(
     Box,
@@ -3240,7 +3387,10 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
   const [pendingPlanApproval, setPendingPlanApproval] = useState(null);
   const [planApprovalInput, setPlanApprovalInput] = useState('');
   const [planApprovalError, setPlanApprovalError] = useState('');
-  const approvalLockActive = Boolean(pendingDeleteApproval || pendingRunApproval || pendingPlanApproval);
+  const [pendingReflectApproval, setPendingReflectApproval] = useState(null);
+  const [reflectApprovalInput, setReflectApprovalInput] = useState('');
+  const [reflectApprovalError, setReflectApprovalError] = useState('');
+  const approvalLockActive = Boolean(pendingDeleteApproval || pendingRunApproval || pendingPlanApproval || pendingReflectApproval);
   const activeAssistantIdRef = useRef(null);
   const activeAssistantAutoSkillNamesRef = useRef([]);
   const streamedAssistantHandledRef = useRef(false);
@@ -3656,6 +3806,13 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
         setPlanState((prev) => ({ ...prev, pendingApproval: true }));
         setPlanApprovalInput('');
         setPlanApprovalError('');
+      } else {
+        const pendingReflectMeta = parsePendingReflectSkillMessage(result.text || '');
+        if (pendingReflectMeta) {
+          setPendingReflectApproval(pendingReflectMeta);
+          setReflectApprovalInput('');
+          setReflectApprovalError('');
+        }
       }
     }
     setMessages((prev) => [
@@ -3798,6 +3955,9 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
     setPendingPlanApproval(null);
     setPlanApprovalInput('');
     setPlanApprovalError('');
+    setPendingReflectApproval(null);
+    setReflectApprovalInput('');
+    setReflectApprovalError('');
     setPlanState({
       current: 0,
       total: 0,
@@ -4485,6 +4645,46 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
       return;
     }
 
+    if (pendingReflectApproval) {
+      if (key.return) {
+        const parsed = parseReflectApprovalAnswer(reflectApprovalInput);
+        if (parsed.action === 'approve' || parsed.action === 'reject' || parsed.action === 'edit') {
+          setPendingReflectApproval(null);
+          setReflectApprovalInput('');
+          setReflectApprovalError('');
+          runSubmission(parsed.command);
+        } else if (parsed.action === 'missing_feedback') {
+          setReflectApprovalError(copy.reflectApproval.missingFeedback);
+        } else {
+          setReflectApprovalError(copy.reflectApproval.invalidAnswer);
+        }
+        return;
+      }
+
+      if (isBackspaceKey(value, key) || isDeleteKey(value, key)) {
+        setReflectApprovalInput((prev) => prev.slice(0, -1));
+        setReflectApprovalError('');
+        return;
+      }
+
+      if (isPrintableInput(value, key)) {
+        setReflectApprovalInput((prev) => `${prev}${value}`);
+        setReflectApprovalError('');
+        return;
+      }
+
+      if (key.ctrl && value === 'c') {
+        if (busy && typeof runtime.abort === 'function') {
+          runtime.abort();
+          return;
+        }
+        exit();
+        return;
+      }
+
+      return;
+    }
+
     if (key.upArrow) {
       if (suggestionNav && commandSuggestions.length > 0) {
         setMenuIndex((prev) => moveSuggestionSelection(prev, commandSuggestions.length, 'up'));
@@ -4754,6 +4954,17 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
     }
   }, [runtimeState?.pendingPlanApproval, busy]);
 
+  useEffect(() => {
+    const pending = Boolean(runtimeState?.pendingReflectSkill);
+    if (!pending) {
+      setPendingReflectApproval(null);
+      return;
+    }
+    if (!busy) {
+      setPendingReflectApproval((prev) => prev || { scope: '', name: '', targetPath: '' });
+    }
+  }, [runtimeState?.pendingReflectSkill, busy]);
+
   useEffect(() => {
     if (commandSuggestions.length === 0) {
       setSuggestionNav(false);
@@ -4800,7 +5011,9 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
       ? { text: copy.runApproval.inputLocked }
       : pendingPlanApproval
         ? { text: copy.planApproval.inputLocked }
-        : null;
+        : pendingReflectApproval
+          ? { text: copy.reflectApproval.inputLocked }
+          : null;
 
   return h(
     Box,
@@ -4850,6 +5063,13 @@ export function ChatApp({ runtime, sessionId, model, sdkProvider = 'openai-compa
       copy,
       cursorVisible
     }),
+    h(ReflectApprovalPanel, {
+      request: pendingReflectApproval,
+      inputValue: reflectApprovalInput,
+      errorText: reflectApprovalError,
+      copy,
+      cursorVisible
+    }),
     debugKeys
       ? h(
           Box,