claude-code-workflow 6.3.37 → 6.3.39

package/ccw/src/templates/dashboard-js/i18n.js

@@ -289,6 +289,65 @@ const i18n = {
     'cli.fileBrowserApiError': 'Server restart required to enable file browser',
     'cli.fileBrowserManualHint': 'Type the full path above and click Select (e.g., C:\\Users\\name\\.gemini)',
 
+    // CLI History & Execution
+    'cli.executionHistory': 'Execution History',
+    'cli.conversationDetail': 'Conversation Detail',
+    'cli.nativeSessionDetail': 'Native Session Detail',
+    'cli.viewFullConversation': 'View Full Process Conversation',
+    'cli.perTurnView': 'Per-Turn View',
+    'cli.concatenatedView': 'Concatenated View',
+    'cli.userPrompt': 'User Prompt',
+    'cli.assistantResponse': 'Assistant Response',
+    'cli.user': 'User',
+    'cli.assistant': 'Assistant',
+    'cli.latest': 'Latest',
+    'cli.turn': 'Turn',
+    'cli.thinkingProcess': 'Thinking Process',
+    'cli.thoughts': 'thoughts',
+    'cli.toolCalls': 'Tool Calls',
+    'cli.totalTokens': 'Total Tokens',
+    'cli.input': 'Input',
+    'cli.output': 'Output',
+    'cli.cached': 'Cached',
+    'cli.concatenatedPrompt': 'Concatenated Prompt (sent to CLI)',
+    'cli.sessionId': 'Session ID',
+
+    // CLI History Actions & Buttons
+    'cli.refresh': 'Refresh',
+    'cli.copyId': 'Copy ID',
+    'cli.copyFullPrompt': 'Copy Full Prompt',
+    'cli.delete': 'Delete',
+    'cli.exportJson': 'Export JSON',
+    'cli.copyFilePath': 'Copy File Path',
+    'cli.copySessionId': 'Copy Session ID',
+    'cli.viewNativeSession': 'View Native Session',
+    'cli.viewDetails': 'View Details',
+    'cli.searchHistory': 'Search history...',
+    'cli.allTools': 'All Tools',
+    'cli.noExecutions': 'No executions yet',
+    'cli.noMatchingResults': 'No matching results',
+
+    // CLI History Messages
+    'cli.conversationNotFound': 'Conversation not found',
+    'cli.nativeSessionNotFound': 'Native session not found',
+    'cli.historyRefreshed': 'History refreshed',
+    'cli.executionDeleted': 'Execution deleted',
+    'cli.deleteFailed': 'Delete failed',
+    'cli.idCopied': 'ID copied',
+    'cli.promptCopied': 'Prompt copied to clipboard',
+    'cli.fullPromptCopied': 'Full prompt copied to clipboard',
+    'cli.sessionIdCopied': 'Session ID copied',
+    'cli.filePathCopied': 'File path copied',
+    'cli.pathNotAvailable': 'Path not available',
+    'cli.noSessionData': 'No session data',
+    'cli.sessionExported': 'Session exported',
+    'cli.failedToCopy': 'Failed to copy',
+    'cli.executionNotFound': 'Execution not found',
+
+    // CLI History Confirm Dialog
+    'cli.confirmDelete': 'Delete this execution record? This action cannot be undone.',
+    'cli.nativeSessionBadge': 'Native session',
+
     // CodexLens Configuration
     'codexlens.config': 'CodexLens Configuration',
     'codexlens.configDesc': 'Manage code indexing, semantic search, and embedding models',
@@ -2202,6 +2261,10 @@ const i18n = {
     'loop.kanban.noBoardData': 'No tasks to display',
     'loop.listView': 'List View',
     'loop.addTask': 'Add Task',
+    'loop.add': 'Add',
+    'loop.save': 'Save',
+    'loop.cancel': 'Cancel',
+    'loop.loadToolsError': 'Failed to load available tools. Please try again.',
 
     // Navigation & Grouping
     'loop.nav.groupBy': 'Group By',
@@ -2871,6 +2934,65 @@ const i18n = {
     'cli.fileBrowserApiError': '需要重启服务器以启用文件浏览器',
     'cli.fileBrowserManualHint': '请在上方输入完整路径后点击选择（如 C:\\Users\\用户名\\.gemini）',
 
+    // CLI 历史与执行
+    'cli.executionHistory': '执行历史',
+    'cli.conversationDetail': '对话详情',
+    'cli.nativeSessionDetail': '原生会话详情',
+    'cli.viewFullConversation': '查看完整过程对话',
+    'cli.perTurnView': '按轮次查看',
+    'cli.concatenatedView': '合并视图',
+    'cli.userPrompt': '用户提示词',
+    'cli.assistantResponse': '助手回复',
+    'cli.user': '用户',
+    'cli.assistant': '助手',
+    'cli.latest': '最新',
+    'cli.turn': '轮次',
+    'cli.thinkingProcess': '思考过程',
+    'cli.thoughts': '个思考',
+    'cli.toolCalls': '工具调用',
+    'cli.totalTokens': '总令牌数',
+    'cli.input': '输入',
+    'cli.output': '输出',
+    'cli.cached': '已缓存',
+    'cli.concatenatedPrompt': '合并提示词（发送至 CLI）',
+    'cli.sessionId': '会话 ID',
+
+    // CLI 历史操作与按钮
+    'cli.refresh': '刷新',
+    'cli.copyId': '复制 ID',
+    'cli.copyFullPrompt': '复制完整提示词',
+    'cli.delete': '删除',
+    'cli.exportJson': '导出 JSON',
+    'cli.copyFilePath': '复制文件路径',
+    'cli.copySessionId': '复制会话 ID',
+    'cli.viewNativeSession': '查看原生会话',
+    'cli.viewDetails': '查看详情',
+    'cli.searchHistory': '搜索历史...',
+    'cli.allTools': '所有工具',
+    'cli.noExecutions': '暂无执行记录',
+    'cli.noMatchingResults': '无匹配结果',
+
+    // CLI 历史消息
+    'cli.conversationNotFound': '未找到对话',
+    'cli.nativeSessionNotFound': '未找到原生会话',
+    'cli.historyRefreshed': '历史已刷新',
+    'cli.executionDeleted': '执行记录已删除',
+    'cli.deleteFailed': '删除失败',
+    'cli.idCopied': 'ID 已复制',
+    'cli.promptCopied': '提示词已复制到剪贴板',
+    'cli.fullPromptCopied': '完整提示词已复制到剪贴板',
+    'cli.sessionIdCopied': '会话 ID 已复制',
+    'cli.filePathCopied': '文件路径已复制',
+    'cli.pathNotAvailable': '路径不可用',
+    'cli.noSessionData': '无会话数据',
+    'cli.sessionExported': '会话已导出',
+    'cli.failedToCopy': '复制失败',
+    'cli.executionNotFound': '未找到执行记录',
+
+    // CLI 历史确认对话框
+    'cli.confirmDelete': '删除此执行记录？此操作无法撤销。',
+    'cli.nativeSessionBadge': '原生会话',
+
     // CodexLens 配置
     'codexlens.config': 'CodexLens 配置',
     'codexlens.configDesc': '管理代码索引、语义搜索和嵌入模型',
@@ -4796,6 +4918,10 @@ const i18n = {
     'loop.kanban.noBoardData': '没有要显示的任务',
     'loop.listView': '列表视图',
     'loop.addTask': '添加任务',
+    'loop.add': '添加',
+    'loop.save': '保存',
+    'loop.cancel': '取消',
+    'loop.loadToolsError': '加载可用工具失败，请重试。',
 
     // Navigation & Grouping
     'loop.nav.groupBy': '分组',

package/ccw/src/templates/dashboard-js/state.js

@@ -36,10 +36,12 @@ const sessionDataStore = {};
 // Store lite task session data for detail page access
 // Key: session key, Value: lite session data object
 const liteTaskDataStore = {};
+window.liteTaskDataStore = liteTaskDataStore;
 
 // Store task JSON data in a global map instead of inline script tags
 // Key: unique task ID, Value: raw task JSON data
 const taskJsonStore = {};
+window.taskJsonStore = taskJsonStore;
 
 // ========== Global Notification Queue ==========
 // Notification queue visible from any view (persisted to localStorage)

package/ccw/src/templates/dashboard-js/views/cli-manager.js

@@ -570,7 +570,7 @@ var fileBrowserState = {
 
 function showFileBrowserModal(onSelect) {
   fileBrowserState.onSelect = onSelect;
-  fileBrowserState.showHidden = false;
+  fileBrowserState.showHidden = true;
   
   // Create modal overlay
   var overlay = document.createElement('div');

package/ccw/src/templates/dashboard-js/views/issue-manager.js

@@ -185,6 +185,14 @@ function renderIssueView() {
           </div>
 
           <div class="flex items-center gap-3">
+            <!-- Pull from GitHub Button -->
+            <button class="issue-pull-btn" onclick="showPullIssuesModal()" title="Pull issues from GitHub repository">
+              <svg class="w-4 h-4 mr-1.5" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+                <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+              </svg>
+              <span>Pull from GitHub</span>
+            </button>
+
             <!-- Create Button -->
             <button class="issue-create-btn" onclick="showCreateIssueModal()">
               <i data-lucide="plus" class="w-4 h-4"></i>
@@ -281,6 +289,59 @@ function renderIssueView() {
           </div>
         </div>
       </div>
+
+      <!-- Pull Issues Modal -->
+      <div id="pullIssuesModal" class="issue-modal hidden">
+        <div class="issue-modal-backdrop" onclick="hidePullIssuesModal()"></div>
+        <div class="issue-modal-content">
+          <div class="issue-modal-header">
+            <h3>
+              <svg class="w-5 h-5 inline mr-2 -mt-1" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+                <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+              </svg>
+              Pull Issues from GitHub
+            </h3>
+            <button class="btn-icon" onclick="hidePullIssuesModal()">
+              <i data-lucide="x" class="w-5 h-5"></i>
+            </button>
+          </div>
+          <div class="issue-modal-body">
+            <div class="form-group">
+              <label>Issue State</label>
+              <select id="pullIssueState">
+                <option value="open" selected>Open</option>
+                <option value="closed">Closed</option>
+                <option value="all">All</option>
+              </select>
+            </div>
+            <div class="form-group">
+              <label>Maximum Issues</label>
+              <input type="number" id="pullIssueLimit" value="20" min="1" max="100" />
+            </div>
+            <div class="form-group">
+              <label>Labels (optional)</label>
+              <input type="text" id="pullIssueLabels" placeholder="bug, enhancement (comma-separated)" />
+            </div>
+            <div class="form-group">
+              <label class="checkbox-label">
+                <input type="checkbox" id="pullDownloadImages" checked />
+                <span>Download images to local</span>
+              </label>
+              <p class="form-hint text-xs text-muted-foreground mt-1">Images will be saved to .workflow/issues/images/ and links updated in issue context</p>
+            </div>
+            <div id="pullIssueResult" class="pull-result hidden mt-4 p-3 rounded-md bg-muted"></div>
+          </div>
+          <div class="issue-modal-footer">
+            <button class="btn-secondary" onclick="hidePullIssuesModal()">Cancel</button>
+            <button class="btn-primary" id="pullIssuesBtn" onclick="pullGitHubIssues()">
+              <svg class="w-4 h-4 mr-1 inline" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+                <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
+              </svg>
+              Pull Issues
+            </button>
+          </div>
+        </div>
+      </div>
     </div>
   `;
 
@@ -650,7 +711,7 @@ function renderQueueCard(queue, isActive) {
         <span class="queue-card-id font-mono">${safeQueueId}</span>
         <div class="queue-card-badges">
           ${isActive ? '<span class="queue-active-badge">Active</span>' : ''}
-          <span class="queue-status-badge ${statusClass}">${queue.status || 'unknown'}</span>
+          ${!isActive || queue.status !== 'active' ? `<span class="queue-status-badge ${statusClass}">${queue.status || 'unknown'}</span>` : ''}
         </div>
       </div>
 
@@ -2627,6 +2688,127 @@ function hideCreateIssueModal() {
   }
 }
 
+// ========== Pull Issues Modal ==========
+function showPullIssuesModal() {
+  const modal = document.getElementById('pullIssuesModal');
+  if (modal) {
+    modal.classList.remove('hidden');
+    // Reset result area
+    const resultDiv = document.getElementById('pullIssueResult');
+    if (resultDiv) {
+      resultDiv.classList.add('hidden');
+      resultDiv.innerHTML = '';
+    }
+    lucide.createIcons();
+  }
+}
+
+function hidePullIssuesModal() {
+  const modal = document.getElementById('pullIssuesModal');
+  if (modal) {
+    modal.classList.add('hidden');
+    // Clear form
+    const stateSelect = document.getElementById('pullIssueState');
+    const limitInput = document.getElementById('pullIssueLimit');
+    const labelsInput = document.getElementById('pullIssueLabels');
+    const downloadImagesCheck = document.getElementById('pullDownloadImages');
+    if (stateSelect) stateSelect.value = 'open';
+    if (limitInput) limitInput.value = '20';
+    if (labelsInput) labelsInput.value = '';
+    if (downloadImagesCheck) downloadImagesCheck.checked = true;
+  }
+}
+
+async function pullGitHubIssues() {
+  const stateSelect = document.getElementById('pullIssueState');
+  const limitInput = document.getElementById('pullIssueLimit');
+  const labelsInput = document.getElementById('pullIssueLabels');
+  const downloadImagesCheck = document.getElementById('pullDownloadImages');
+  const resultDiv = document.getElementById('pullIssueResult');
+  const pullBtn = document.getElementById('pullIssuesBtn');
+
+  const state = stateSelect?.value || 'open';
+  const limit = parseInt(limitInput?.value || '20');
+  const labels = labelsInput?.value?.trim();
+  const downloadImages = downloadImagesCheck?.checked || false;
+
+  // Disable button and show loading
+  if (pullBtn) {
+    pullBtn.disabled = true;
+    pullBtn.innerHTML = '<i data-lucide="loader-2" class="w-4 h-4 mr-1 animate-spin"></i>' + (t('common.loading') || 'Loading...');
+    lucide.createIcons();
+  }
+
+  try {
+    const params = new URLSearchParams({
+      path: projectPath,
+      state: state,
+      limit: limit.toString(),
+      downloadImages: downloadImages.toString()
+    });
+    if (labels) params.set('labels', labels);
+
+    const response = await fetch('/api/issues/pull?' + params.toString(), {
+      method: 'POST'
+    });
+
+    const result = await response.json();
+
+    if (!response.ok || result.error) {
+      showNotification(result.error || 'Failed to pull issues', 'error');
+      if (resultDiv) {
+        resultDiv.classList.remove('hidden');
+        resultDiv.innerHTML = `<p class="text-destructive">${result.error || 'Failed to pull issues'}</p>`;
+      }
+      return;
+    }
+
+    // Show results
+    if (resultDiv) {
+      resultDiv.classList.remove('hidden');
+      resultDiv.innerHTML = `
+        <div class="flex items-start gap-2">
+          <i data-lucide="check-circle" class="w-5 h-5 text-success mt-0.5"></i>
+          <div class="flex-1">
+            <p class="font-medium mb-2">${t('issues.pullSuccess') || 'GitHub Issues Pulled Successfully'}</p>
+            <div class="text-sm text-muted-foreground space-y-1">
+              <p>✓ Imported: <strong>${result.imported || 0}</strong> new issues</p>
+              <p>✓ Updated: <strong>${result.updated || 0}</strong> existing issues</p>
+              <p>✓ Skipped: <strong>${result.skipped || 0}</strong> unchanged issues</p>
+              ${result.images_downloaded > 0 ? `<p>✓ Downloaded: <strong>${result.images_downloaded}</strong> images</p>` : ''}
+            </div>
+          </div>
+        </div>
+      `;
+      lucide.createIcons();
+    }
+
+    showNotification(`Pulled ${result.imported + result.updated} issues from GitHub`, 'success');
+
+    // Reload data after 1 second
+    setTimeout(async () => {
+      await loadIssueData();
+      renderIssueView();
+      hidePullIssuesModal();
+    }, 1500);
+
+  } catch (err) {
+    console.error('Failed to pull issues:', err);
+    showNotification('Failed to pull issues', 'error');
+    if (resultDiv) {
+      resultDiv.classList.remove('hidden');
+      resultDiv.innerHTML = `<p class="text-destructive">${err.message || 'Unknown error occurred'}</p>`;
+    }
+  } finally {
+    // Re-enable button
+    if (pullBtn) {
+      pullBtn.disabled = false;
+      pullBtn.innerHTML = '<i data-lucide="download" class="w-4 h-4 mr-1"></i>' + (t('issues.pull') || 'Pull');
+      lucide.createIcons();
+    }
+  }
+}
+
 async function createIssue() {
   const idInput = document.getElementById('newIssueId');
   const titleInput = document.getElementById('newIssueTitle');

package/ccw/src/templates/dashboard-js/views/lite-tasks.js

@@ -418,7 +418,7 @@ function showMultiCliDetailPage(sessionKey) {
       </div>
 
       <!-- Tab Content -->
-      <div class="detail-tab-content" id="multiCliDetailTabContent">
+      <div class="detail-tab-content active" id="multiCliDetailTabContent">
         ${renderMultiCliTasksTab(session)}
       </div>
     </div>
@@ -653,12 +653,17 @@ function switchMultiCliDetailTab(tabName) {
       break;
     case 'context':
       loadAndRenderMultiCliContextTab(session, contentArea);
+      contentArea.classList.add('active');
       return; // Early return as this is async
     case 'summary':
       loadAndRenderMultiCliSummaryTab(session, contentArea);
+      contentArea.classList.add('active');
       return; // Early return as this is async
   }
 
+  // Add active class to show content
+  contentArea.classList.add('active');
+
   // Re-initialize after tab switch
   setTimeout(() => {
     if (typeof lucide !== 'undefined') lucide.createIcons();
@@ -1097,13 +1102,52 @@ function renderMultiCliSummaryContent(summary, session) {
           <span class="section-label"><i data-lucide="lightbulb" class="w-4 h-4 inline mr-1"></i> ${t('multiCli.summary.solutions')} (${synthesis.solutions.length})</span>
         </div>
         <div class="collapsible-content collapsed">
-          ${synthesis.solutions.map((sol, idx) => `
-            <div class="solution-summary-item">
-              <span class="solution-num">#${idx + 1}</span>
-              <span class="solution-name">${escapeHtml(getI18nText(sol.title) || sol.id || `${t('multiCli.summary.solution')} ${idx + 1}`)}</span>
-              ${sol.feasibility?.score ? `<span class="feasibility-badge">${Math.round(sol.feasibility.score * 100)}%</span>` : ''}
-            </div>
-          `).join('')}
+          ${synthesis.solutions.map((sol, idx) => {
+            const name = getI18nText(sol.name) || sol.title || sol.id || `${t('multiCli.summary.solution')} ${idx + 1}`;
+            const summary = getI18nText(sol.summary) || '';
+            const feasibility = sol.feasibility?.score || sol.feasibility || 0;
+            const effort = sol.effort || '';
+            const risk = sol.risk || '';
+            const pros = sol.pros || [];
+            const cons = sol.cons || [];
+
+            return `
+              <div class="solution-card">
+                <div class="solution-header">
+                  <div class="solution-title-row">
+                    <span class="solution-num">#${idx + 1}</span>
+                    <span class="solution-name">${escapeHtml(name)}</span>
+                  </div>
+                  <div class="solution-badges">
+                    ${feasibility ? `<span class="badge feasibility">${Math.round(feasibility * 100)}%</span>` : ''}
+                    ${effort ? `<span class="badge effort ${escapeHtml(effort)}">${escapeHtml(effort)}</span>` : ''}
+                    ${risk ? `<span class="badge risk ${escapeHtml(risk)}">${escapeHtml(risk)}</span>` : ''}
+                  </div>
+                </div>
+                ${summary ? `
+                  <div class="solution-summary">
+                    <p>${escapeHtml(summary)}</p>
+                  </div>
+                ` : ''}
+                ${pros.length > 0 ? `
+                  <div class="solution-details">
+                    <h5 class="details-label">✓ ${t('multiCli.summary.pros') || 'Pros'}:</h5>
+                    <ul class="details-list">
+                      ${pros.map(p => `<li>${escapeHtml(getI18nText(p) || p)}</li>`).join('')}
+                    </ul>
+                  </div>
+                ` : ''}
+                ${cons.length > 0 ? `
+                  <div class="solution-details">
+                    <h5 class="details-label">✗ ${t('multiCli.summary.cons') || 'Cons'}:</h5>
+                    <ul class="details-list">
+                      ${cons.map(c => `<li>${escapeHtml(getI18nText(c) || c)}</li>`).join('')}
+                    </ul>
+                  </div>
+                ` : ''}
+              </div>
+            `;
+          }).join('')}
         </div>
       </div>
     `);
@@ -2722,12 +2766,12 @@ function showLiteTaskDetailPage(sessionKey) {
       <div class="detail-header">
         <button class="btn-back" onclick="goBackToLiteTasks()">
           <span class="back-icon">←</span>
-          <span>Back to ${session.type === 'lite-plan' ? 'Lite Plan' : 'Lite Fix'}</span>
+          <span>${session.type === 'lite-plan' ? t('lite.backToList', { type: 'Plan' }) : session.type === 'lite-fix' ? t('lite.backToList', { type: 'Fix' }) : t('multiCli.backToList')}</span>
         </button>
         <div class="detail-title-row">
-          <h2 class="detail-session-id">${session.type === 'lite-plan' ? '<i data-lucide="file-edit" class="w-5 h-5 inline mr-2"></i>' : '<i data-lucide="wrench" class="w-5 h-5 inline mr-2"></i>'} ${escapeHtml(session.id)}</h2>
+          <h2 class="detail-session-id">${session.type === 'lite-plan' ? '<i data-lucide="file-edit" class="w-5 h-5 inline mr-2"></i>' : session.type === 'lite-fix' ? '<i data-lucide="wrench" class="w-5 h-5 inline mr-2"></i>' : '<i data-lucide="speech-icon" class="w-5 h-5 inline mr-2"></i>'} ${escapeHtml(session.id)}</h2>
           <div class="detail-badges">
-            <span class="session-type-badge ${session.type}">${session.type}</span>
+            <span class="session-type-badge ${session.type}">${session.type === 'multi-cli-plan' ? 'MULTI-CLI' : session.type}</span>
           </div>
         </div>
       </div>

package/ccw/src/templates/dashboard-js/views/loop-monitor.js

@@ -1012,15 +1012,24 @@ async function saveTaskOrder(loopId, newOrder) {
 
 /**
  * Show add task modal
+ * Loads enabled tools before displaying modal to prevent race conditions
  */
 async function showAddTaskModal(loopId) {
-  // Get enabled tools
-  const enabledTools = await getEnabledTools();
-
-  // Build tool options HTML
-  const toolOptions = enabledTools.map(tool =>
-    `<option value="${tool}">${tool.charAt(0).toUpperCase() + tool.slice(1)}</option>`
-  ).join('');
+  // Find and disable the "Add Task" button to prevent multiple clicks during loading
+  const addTaskButton = event?.target;
+  if (addTaskButton) {
+    addTaskButton.disabled = true;
+    const originalText = addTaskButton.innerHTML;
+    addTaskButton.innerHTML = '<i class="spinner"></i> ' + (t('common.loading') || 'Loading...');
+
+    try {
+      // Get enabled tools (this ensures tools are loaded before modal opens)
+      const enabledTools = await getEnabledTools();
+
+      // Build tool options HTML
+      const toolOptions = enabledTools.map(tool =>
+        `<option value="${tool}">${tool.charAt(0).toUpperCase() + tool.slice(1)}</option>`
+      ).join('');
 
   const modal = document.createElement('div');
   modal.id = 'addTaskModal';
@@ -1075,11 +1084,103 @@ async function showAddTaskModal(loopId) {
     </div>
   `;
 
-  document.body.appendChild(modal);
-  if (typeof lucide !== 'undefined') lucide.createIcons();
+      document.body.appendChild(modal);
+      if (typeof lucide !== 'undefined') lucide.createIcons();
 
-  // Focus on description field
-  setTimeout(() => document.getElementById('taskDescription').focus(), 100);
+      // Focus on description field
+      setTimeout(() => document.getElementById('taskDescription').focus(), 100);
+
+    } catch (err) {
+      console.error('Failed to show add task modal:', err);
+      alert(t('loop.loadToolsError') || 'Failed to load available tools. Please try again.');
+    } finally {
+      // Restore button state
+      if (addTaskButton) {
+        addTaskButton.disabled = false;
+        addTaskButton.innerHTML = originalText;
+      }
+    }
+  } else {
+    // Fallback if event is not available (shouldn't happen normally)
+    const enabledTools = await getEnabledTools();
+    const toolOptions = enabledTools.map(tool =>
+      `<option value="${tool}">${tool.charAt(0).toUpperCase() + tool.slice(1)}</option>`
+    ).join('');
+
+    const modal = document.createElement('div');
+    modal.id = 'addTaskModal';
+    modal.className = 'modal-overlay';
+    modal.innerHTML = `
+    <div class="modal-content">
+      <div class="modal-header">
+        <h3><i data-lucide="plus-circle" class="w-5 h-5"></i> ${t('loop.addTask') || 'Add Task'}</h3>
+        <button class="modal-close" onclick="closeTaskModal()">
+          <i data-lucide="x" class="w-5 h-5"></i>
+        </button>
+      </div>
+      <div class="modal-body">
+        <form id="addTaskForm" onsubmit="handleAddTask(event, '${loopId}')">
+          <div id="addTaskError" class="alert alert-error" style="display: none;"></div>
+
+          <!-- Description -->
+          <div class="form-group">
+            <label for="taskDescription">${t('loop.taskDescription') || 'Task Description'} <span class="required">*</span></label>
+            <textarea id="taskDescription" name="description" rows="3" required
+                      placeholder="${t('loop.taskDescriptionPlaceholder') || 'Describe what this task should do...'}"
+                      class="form-control"></textarea>
+          </div>
+
+          <!-- Tool -->
+          <div class="form-group">
+            <label for="taskTool">${t('loop.tool') || 'Tool'}</label>
+            <select id="taskTool" name="tool" class="form-control">
+              ${toolOptions}
+            </select>
+          </div>
+
+          <!-- Mode -->
+          <div class="form-group">
+            <label for="taskMode">${t('loop.mode') || 'Mode'}</label>
+            <select id="taskMode" name="mode" class="form-control">
+              <option value="analysis">${t('loop.modeAnalysis') || 'Analysis'}</option>
+              <option value="write">${t('loop.modeWrite') || 'Write'}</option>
+              <option value="review">${t('loop.modeReview') || 'Review'}</option>
+            </select>
+          </div>
+
+          <!-- Prompt Template -->
+          <div class="form-group">
+            <label for="taskPrompt">${t('loop.promptTemplate') || 'Prompt Template'} <span class="required">*</span></label>
+            <textarea id="taskPrompt" name="prompt_template" rows="5" required
+                      placeholder="${t('loop.promptPlaceholder') || 'Enter the prompt to execute...'}"
+                      class="form-control"></textarea>
+            <small class="form-help">${t('loop.promptHelp') || 'Variables: {iteration}, {output_prev}'}</small>
+          </div>
+
+          <!-- Error Handling -->
+          <div class="form-group">
+            <label for="taskOnError">${t('loop.onError') || 'On Error'}</label>
+            <select id="taskOnError" name="on_error" class="form-control">
+              <option value="continue">${t('loop.errorContinue') || 'Continue'}</option>
+              <option value="pause">${t('loop.errorPause') || 'Pause'}</option>
+              <option value="fail_fast">${t('loop.errorFailFast') || 'Fail Fast'}</option>
+            </select>
+          </div>
+
+          <!-- Form Actions -->
+          <div class="modal-footer">
+            <button type="button" class="btn btn-secondary" onclick="closeTaskModal()">${t('loop.cancel') || 'Cancel'}</button>
+            <button type="submit" class="btn btn-primary">${t('loop.add') || 'Add'}</button>
+          </div>
+        </form>
+      </div>
+    </div>
+  `;
+
+    document.body.appendChild(modal);
+    if (typeof lucide !== 'undefined') lucide.createIcons();
+    setTimeout(() => document.getElementById('taskDescription').focus(), 100);
+  }
 }
 
 /**