claude-code-workflow 6.1.1 → 6.1.4

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

@@ -136,6 +136,13 @@ function showLiteTaskDetailPage(sessionKey) {
           <span class="tab-icon"><i data-lucide="ruler" class="w-4 h-4"></i></span>
           <span class="tab-text">Plan</span>
         </button>
+        ${session.type === 'lite-fix' ? `
+        <button class="detail-tab" data-tab="diagnoses" onclick="switchLiteDetailTab('diagnoses')">
+          <span class="tab-icon"><i data-lucide="stethoscope" class="w-4 h-4"></i></span>
+          <span class="tab-text">Diagnoses</span>
+          ${session.diagnoses?.items?.length ? `<span class="tab-count">${session.diagnoses.items.length}</span>` : ''}
+        </button>
+        ` : ''}
         <button class="detail-tab" data-tab="context" onclick="switchLiteDetailTab('context')">
           <span class="tab-icon"><i data-lucide="package" class="w-4 h-4"></i></span>
           <span class="tab-text">Context</span>
@@ -196,6 +203,17 @@ function switchLiteDetailTab(tabName) {
       break;
     case 'plan':
       contentArea.innerHTML = renderLitePlanTab(session);
+      // Re-initialize collapsible sections for plan tab
+      setTimeout(() => {
+        initCollapsibleSections(contentArea);
+      }, 50);
+      break;
+    case 'diagnoses':
+      contentArea.innerHTML = renderDiagnosesTab(session);
+      // Re-initialize collapsible sections for diagnoses tab
+      setTimeout(() => {
+        initCollapsibleSections(contentArea);
+      }, 50);
       break;
     case 'context':
       loadAndRenderLiteContextTab(session, contentArea);
@@ -287,13 +305,14 @@ function openTaskDrawerForLite(sessionId, taskId) {
 
 function renderLitePlanTab(session) {
   const plan = session.plan;
+  const isFixPlan = session.type === 'lite-fix';
 
   if (!plan) {
     return `
       <div class="tab-empty-state">
         <div class="empty-icon"><i data-lucide="ruler" class="w-12 h-12"></i></div>
         <div class="empty-title">No Plan Data</div>
-        <div class="empty-text">No plan.json found for this session.</div>
+        <div class="empty-text">No ${isFixPlan ? 'fix-plan.json' : 'plan.json'} found for this session.</div>
       </div>
     `;
   }
@@ -308,6 +327,22 @@ function renderLitePlanTab(session) {
         </div>
       ` : ''}
 
+      <!-- Root Cause (fix-plan specific) -->
+      ${plan.root_cause ? `
+        <div class="plan-section">
+          <h4 class="plan-section-title"><i data-lucide="search" class="w-4 h-4 inline mr-1"></i> Root Cause</h4>
+          <p class="plan-root-cause-text">${escapeHtml(plan.root_cause)}</p>
+        </div>
+      ` : ''}
+
+      <!-- Strategy (fix-plan specific) -->
+      ${plan.strategy ? `
+        <div class="plan-section">
+          <h4 class="plan-section-title"><i data-lucide="route" class="w-4 h-4 inline mr-1"></i> Fix Strategy</h4>
+          <p class="plan-strategy-text">${escapeHtml(plan.strategy)}</p>
+        </div>
+      ` : ''}
+
       <!-- Approach -->
       ${plan.approach ? `
         <div class="plan-section">
@@ -316,6 +351,14 @@ function renderLitePlanTab(session) {
         </div>
       ` : ''}
 
+      <!-- User Requirements (fix-plan specific) -->
+      ${plan.user_requirements ? `
+        <div class="plan-section">
+          <h4 class="plan-section-title"><i data-lucide="user" class="w-4 h-4 inline mr-1"></i> User Requirements</h4>
+          <p class="plan-requirements-text">${escapeHtml(plan.user_requirements)}</p>
+        </div>
+      ` : ''}
+
       <!-- Focus Paths -->
       ${plan.focus_paths?.length ? `
         <div class="plan-section">
@@ -330,16 +373,74 @@ function renderLitePlanTab(session) {
       <div class="plan-section">
         <h4 class="plan-section-title"><i data-lucide="info" class="w-4 h-4 inline mr-1"></i> Metadata</h4>
         <div class="plan-meta-grid">
+          ${plan.severity ? `<div class="meta-item"><span class="meta-label">Severity:</span> <span class="severity-badge ${escapeHtml(plan.severity)}">${escapeHtml(plan.severity)}</span></div>` : ''}
+          ${plan.risk_level ? `<div class="meta-item"><span class="meta-label">Risk Level:</span> <span class="risk-badge ${escapeHtml(plan.risk_level)}">${escapeHtml(plan.risk_level)}</span></div>` : ''}
           ${plan.estimated_time ? `<div class="meta-item"><span class="meta-label">Estimated Time:</span> ${escapeHtml(plan.estimated_time)}</div>` : ''}
           ${plan.complexity ? `<div class="meta-item"><span class="meta-label">Complexity:</span> ${escapeHtml(plan.complexity)}</div>` : ''}
           ${plan.recommended_execution ? `<div class="meta-item"><span class="meta-label">Execution:</span> ${escapeHtml(plan.recommended_execution)}</div>` : ''}
         </div>
       </div>
 
+      <!-- Fix Tasks Summary (fix-plan specific) -->
+      ${plan.tasks?.length ? `
+        <div class="plan-section">
+          <h4 class="plan-section-title"><i data-lucide="list-checks" class="w-4 h-4 inline mr-1"></i> Fix Tasks (${plan.tasks.length})</h4>
+          <div class="fix-tasks-summary">
+            ${plan.tasks.map((task, idx) => `
+              <div class="fix-task-summary-item collapsible-section">
+                <div class="collapsible-header">
+                  <span class="collapse-icon">▶</span>
+                  <span class="task-num">#${idx + 1}</span>
+                  <span class="task-title-brief">${escapeHtml(task.title || task.summary || 'Untitled')}</span>
+                  ${task.scope ? `<span class="task-scope-badge">${escapeHtml(task.scope)}</span>` : ''}
+                </div>
+                <div class="collapsible-content collapsed">
+                  ${task.modification_points?.length ? `
+                    <div class="task-detail-section">
+                      <strong>Modification Points:</strong>
+                      <ul class="mod-points-list">
+                        ${task.modification_points.map(mp => `
+                          <li>
+                            <code>${escapeHtml(mp.file || '')}</code>
+                            ${mp.function_name ? `<span class="func-name">→ ${escapeHtml(mp.function_name)}</span>` : ''}
+                            ${mp.change_type ? `<span class="change-type">(${escapeHtml(mp.change_type)})</span>` : ''}
+                          </li>
+                        `).join('')}
+                      </ul>
+                    </div>
+                  ` : ''}
+                  ${task.implementation?.length ? `
+                    <div class="task-detail-section">
+                      <strong>Implementation Steps:</strong>
+                      <ol class="impl-steps-list">
+                        ${task.implementation.map(step => `<li>${escapeHtml(step)}</li>`).join('')}
+                      </ol>
+                    </div>
+                  ` : ''}
+                  ${task.verification?.length ? `
+                    <div class="task-detail-section">
+                      <strong>Verification:</strong>
+                      <ul class="verify-list">
+                        ${task.verification.map(v => `<li>${escapeHtml(v)}</li>`).join('')}
+                      </ul>
+                    </div>
+                  ` : ''}
+                </div>
+              </div>
+            `).join('')}
+          </div>
+        </div>
+      ` : ''}
+
       <!-- Raw JSON -->
-      <div class="plan-section">
-        <h4 class="plan-section-title">{ } Raw JSON</h4>
-        <pre class="json-content">${escapeHtml(JSON.stringify(plan, null, 2))}</pre>
+      <div class="plan-section collapsible-section">
+        <div class="collapsible-header">
+          <span class="collapse-icon">▶</span>
+          <span class="section-label">{ } Raw JSON</span>
+        </div>
+        <div class="collapsible-content collapsed">
+          <pre class="json-content">${escapeHtml(JSON.stringify(plan, null, 2))}</pre>
+        </div>
       </div>
     </div>
   `;
@@ -393,3 +494,192 @@ async function loadAndRenderLiteSummaryTab(session, contentArea) {
     contentArea.innerHTML = `<div class="tab-error">Failed to load summaries: ${err.message}</div>`;
   }
 }
+
+// ============================================
+// DIAGNOSES TAB RENDERING (lite-fix specific)
+// ============================================
+
+function renderDiagnosesTab(session) {
+  const diagnoses = session.diagnoses;
+
+  if (!diagnoses || (!diagnoses.manifest && diagnoses.items?.length === 0)) {
+    return `
+      <div class="tab-empty-state">
+        <div class="empty-icon"><i data-lucide="stethoscope" class="w-12 h-12"></i></div>
+        <div class="empty-title">No Diagnoses</div>
+        <div class="empty-text">No diagnosis-*.json files found for this session.</div>
+      </div>
+    `;
+  }
+
+  let sections = [];
+
+  // Manifest summary (if available)
+  if (diagnoses.manifest) {
+    sections.push(`
+      <div class="diagnoses-manifest-section">
+        <h4 class="diagnoses-section-title"><i data-lucide="clipboard-check" class="w-4 h-4 inline mr-1"></i> Diagnosis Summary</h4>
+        <div class="manifest-meta-grid">
+          ${diagnoses.manifest.total_diagnoses ? `<div class="meta-item"><span class="meta-label">Total Diagnoses:</span> ${diagnoses.manifest.total_diagnoses}</div>` : ''}
+          ${diagnoses.manifest.diagnosis_angles ? `<div class="meta-item"><span class="meta-label">Angles:</span> ${diagnoses.manifest.diagnosis_angles.join(', ')}</div>` : ''}
+          ${diagnoses.manifest.created_at ? `<div class="meta-item"><span class="meta-label">Created:</span> ${formatDate(diagnoses.manifest.created_at)}</div>` : ''}
+        </div>
+      </div>
+    `);
+  }
+
+  // Individual diagnosis items
+  if (diagnoses.items && diagnoses.items.length > 0) {
+    const diagnosisCards = diagnoses.items.map(diag => renderDiagnosisCard(diag)).join('');
+    sections.push(`
+      <div class="diagnoses-items-section">
+        <h4 class="diagnoses-section-title"><i data-lucide="search" class="w-4 h-4 inline mr-1"></i> Diagnosis Details (${diagnoses.items.length})</h4>
+        <div class="diagnoses-grid">
+          ${diagnosisCards}
+        </div>
+      </div>
+    `);
+  }
+
+  return `<div class="diagnoses-tab-content">${sections.join('')}</div>`;
+}
+
+function renderDiagnosisCard(diag) {
+  const diagJsonId = `diag-json-${diag.id}`.replace(/[^a-zA-Z0-9-]/g, '-');
+  taskJsonStore[diagJsonId] = diag;
+
+  return `
+    <div class="diagnosis-card collapsible-section">
+      <div class="collapsible-header diagnosis-header">
+        <span class="collapse-icon">▶</span>
+        <span class="diagnosis-id"><i data-lucide="file-search" class="w-4 h-4 inline mr-1"></i>${escapeHtml(diag.id)}</span>
+        <button class="btn-view-json" onclick="event.stopPropagation(); showJsonModal('${diagJsonId}', '${escapeHtml(diag.id)}')">{ } JSON</button>
+      </div>
+      <div class="collapsible-content collapsed">
+        ${renderDiagnosisContent(diag)}
+      </div>
+    </div>
+  `;
+}
+
+function renderDiagnosisContent(diag) {
+  let content = [];
+
+  // Summary/Overview
+  if (diag.summary || diag.overview) {
+    content.push(`
+      <div class="diag-section">
+        <strong>Summary:</strong>
+        <p>${escapeHtml(diag.summary || diag.overview)}</p>
+      </div>
+    `);
+  }
+
+  // Root Cause Analysis
+  if (diag.root_cause || diag.root_cause_analysis) {
+    content.push(`
+      <div class="diag-section">
+        <strong>Root Cause:</strong>
+        <p>${escapeHtml(diag.root_cause || diag.root_cause_analysis)}</p>
+      </div>
+    `);
+  }
+
+  // Issues/Findings
+  if (diag.issues && Array.isArray(diag.issues)) {
+    content.push(`
+      <div class="diag-section">
+        <strong>Issues Found (${diag.issues.length}):</strong>
+        <ul class="issues-list">
+          ${diag.issues.map(issue => `
+            <li class="issue-item">
+              ${typeof issue === 'string' ? escapeHtml(issue) : `
+                <div class="issue-title">${escapeHtml(issue.title || issue.description || 'Unknown')}</div>
+                ${issue.location ? `<div class="issue-location"><code>${escapeHtml(issue.location)}</code></div>` : ''}
+                ${issue.severity ? `<span class="severity-badge ${issue.severity}">${escapeHtml(issue.severity)}</span>` : ''}
+              `}
+            </li>
+          `).join('')}
+        </ul>
+      </div>
+    `);
+  }
+
+  // Affected Files
+  if (diag.affected_files && Array.isArray(diag.affected_files)) {
+    content.push(`
+      <div class="diag-section">
+        <strong>Affected Files:</strong>
+        <div class="path-tags">
+          ${diag.affected_files.map(f => `<span class="path-tag">${escapeHtml(typeof f === 'string' ? f : f.path || f.file)}</span>`).join('')}
+        </div>
+      </div>
+    `);
+  }
+
+  // API Contracts (for api-contracts diagnosis)
+  if (diag.contracts && Array.isArray(diag.contracts)) {
+    content.push(`
+      <div class="diag-section">
+        <strong>API Contracts (${diag.contracts.length}):</strong>
+        <div class="contracts-list">
+          ${diag.contracts.map(contract => `
+            <div class="contract-item">
+              <div class="contract-header">
+                <span class="contract-endpoint">${escapeHtml(contract.endpoint || contract.name || 'Unknown')}</span>
+                ${contract.method ? `<span class="contract-method">${escapeHtml(contract.method)}</span>` : ''}
+              </div>
+              ${contract.description ? `<div class="contract-desc">${escapeHtml(contract.description)}</div>` : ''}
+              ${contract.issues?.length ? `<div class="contract-issues">${contract.issues.length} issue(s)</div>` : ''}
+            </div>
+          `).join('')}
+        </div>
+      </div>
+    `);
+  }
+
+  // Dataflow Analysis (for dataflow diagnosis)
+  if (diag.dataflow || diag.data_flow) {
+    const df = diag.dataflow || diag.data_flow;
+    content.push(`
+      <div class="diag-section">
+        <strong>Data Flow Analysis:</strong>
+        ${typeof df === 'string' ? `<p>${escapeHtml(df)}</p>` : `
+          <div class="dataflow-details">
+            ${df.source ? `<div class="df-item"><span class="df-label">Source:</span> ${escapeHtml(df.source)}</div>` : ''}
+            ${df.sink ? `<div class="df-item"><span class="df-label">Sink:</span> ${escapeHtml(df.sink)}</div>` : ''}
+            ${df.transformations?.length ? `
+              <div class="df-item">
+                <span class="df-label">Transformations:</span>
+                <ol class="df-transforms">${df.transformations.map(t => `<li>${escapeHtml(t)}</li>`).join('')}</ol>
+              </div>
+            ` : ''}
+          </div>
+        `}
+      </div>
+    `);
+  }
+
+  // Recommendations
+  if (diag.recommendations && Array.isArray(diag.recommendations)) {
+    content.push(`
+      <div class="diag-section">
+        <strong>Recommendations:</strong>
+        <ol class="recommendations-list">
+          ${diag.recommendations.map(rec => `<li>${escapeHtml(typeof rec === 'string' ? rec : rec.description || rec.action)}</li>`).join('')}
+        </ol>
+      </div>
+    `);
+  }
+
+  // If no specific content was rendered, show raw JSON preview
+  if (content.length === 0) {
+    content.push(`
+      <div class="diag-section">
+        <pre class="json-content">${escapeHtml(JSON.stringify(diag, null, 2))}</pre>
+      </div>
+    `);
+  }
+
+  return content.join('');
+}

package/package.json

@@ -1,67 +1,67 @@
-{
-  "name": "claude-code-workflow",
-  "version": "6.1.1",
-  "description": "JSON-driven multi-agent development framework with intelligent CLI orchestration (Gemini/Qwen/Codex), context-first architecture, and automated workflow execution",
-  "type": "module",
-  "main": "ccw/src/index.js",
-  "bin": {
-    "ccw": "./ccw/bin/ccw.js"
-  },
-  "scripts": {
-    "start": "node ccw/bin/ccw.js",
-    "test": "node --test",
-    "prepublishOnly": "echo 'Ready to publish @dyw/claude-code-workflow'"
-  },
-  "keywords": [
-    "claude",
-    "workflow",
-    "ai",
-    "cli",
-    "dashboard",
-    "code-review",
-    "automation",
-    "development"
-  ],
-  "author": "dyw",
-  "license": "MIT",
-  "engines": {
-    "node": ">=16.0.0"
-  },
-  "dependencies": {
-    "boxen": "^7.1.0",
-    "chalk": "^5.3.0",
-    "commander": "^11.0.0",
-    "figlet": "^1.7.0",
-    "glob": "^10.3.0",
-    "gradient-string": "^2.0.2",
-    "inquirer": "^9.2.0",
-    "open": "^9.1.0",
-    "ora": "^7.0.0"
-  },
-  "files": [
-    "ccw/bin/",
-    "ccw/src/",
-    "ccw/package.json",
-    ".claude/agents/",
-    ".claude/commands/",
-    ".claude/output-styles/",
-    ".claude/workflows/",
-    ".claude/scripts/",
-    ".claude/prompt-templates/",
-    ".claude/python_script/",
-    ".claude/skills/",
-    ".codex/",
-    ".gemini/",
-    ".qwen/",
-    "CLAUDE.md",
-    "README.md"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/catlog22/Claude-Code-Workflow.git"
-  },
-  "bugs": {
-    "url": "https://github.com/catlog22/Claude-Code-Workflow/issues"
-  },
-  "homepage": "https://github.com/catlog22/Claude-Code-Workflow#readme"
-}
+{
+  "name": "claude-code-workflow",
+  "version": "6.1.4",
+  "description": "JSON-driven multi-agent development framework with intelligent CLI orchestration (Gemini/Qwen/Codex), context-first architecture, and automated workflow execution",
+  "type": "module",
+  "main": "ccw/src/index.js",
+  "bin": {
+    "ccw": "./ccw/bin/ccw.js"
+  },
+  "scripts": {
+    "start": "node ccw/bin/ccw.js",
+    "test": "node --test",
+    "prepublishOnly": "echo 'Ready to publish @dyw/claude-code-workflow'"
+  },
+  "keywords": [
+    "claude",
+    "workflow",
+    "ai",
+    "cli",
+    "dashboard",
+    "code-review",
+    "automation",
+    "development"
+  ],
+  "author": "dyw",
+  "license": "MIT",
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "dependencies": {
+    "boxen": "^7.1.0",
+    "chalk": "^5.3.0",
+    "commander": "^11.0.0",
+    "figlet": "^1.7.0",
+    "glob": "^10.3.0",
+    "gradient-string": "^2.0.2",
+    "inquirer": "^9.2.0",
+    "open": "^9.1.0",
+    "ora": "^7.0.0"
+  },
+  "files": [
+    "ccw/bin/",
+    "ccw/src/",
+    "ccw/package.json",
+    ".claude/agents/",
+    ".claude/commands/",
+    ".claude/output-styles/",
+    ".claude/workflows/",
+    ".claude/scripts/",
+    ".claude/prompt-templates/",
+    ".claude/python_script/",
+    ".claude/skills/",
+    ".codex/",
+    ".gemini/",
+    ".qwen/",
+    "CLAUDE.md",
+    "README.md"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/catlog22/Claude-Code-Workflow.git"
+  },
+  "bugs": {
+    "url": "https://github.com/catlog22/Claude-Code-Workflow/issues"
+  },
+  "homepage": "https://github.com/catlog22/Claude-Code-Workflow#readme"
+}