feat: Dashboard 增强 - MCP管理器、Review Session 和 UI 改进

- 添加 MCP Manager 组件，支持服务器状态管理
- 增强 Review Session 视图，添加 conflict/review tabs
- 新增 _conflict_tab.js 和 _review_tab.js 组件
- 改进 carousel、tabs-other 等组件
- 大量 CSS 样式更新和优化
- home.js 添加新功能支持

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

ccw/src/templates/dashboard-js/components/_conflict_tab.js

@@ -0,0 +1,112 @@
+// ==========================================
+// Conflict Resolution Tab
+// ==========================================
+
+async function loadAndRenderConflictTab(session, contentArea) {
+  contentArea.innerHTML = '<div class="tab-loading">Loading conflict resolution...</div>';
+
+  try {
+    if (window.SERVER_MODE && session.path) {
+      const response = await fetch(`/api/session-detail?path=${encodeURIComponent(session.path)}&type=conflict`);
+      if (response.ok) {
+        const data = await response.json();
+        contentArea.innerHTML = renderConflictCards(data.conflictResolution);
+        return;
+      }
+    }
+    contentArea.innerHTML = `
+      <div class="tab-empty-state">
+        <div class="empty-icon">⚖️</div>
+        <div class="empty-title">No Conflict Resolution</div>
+        <div class="empty-text">No conflict-resolution-decisions.json found for this session.</div>
+      </div>
+    `;
+  } catch (err) {
+    contentArea.innerHTML = `<div class="tab-error">Failed to load conflict resolution: ${err.message}</div>`;
+  }
+}
+
+function renderConflictCards(conflictResolution) {
+  if (!conflictResolution) {
+    return `
+      <div class="tab-empty-state">
+        <div class="empty-icon">⚖️</div>
+        <div class="empty-title">No Conflict Resolution</div>
+        <div class="empty-text">No conflict decisions found for this session.</div>
+      </div>
+    `;
+  }
+
+  let cards = [];
+
+  // Header info
+  cards.push(`
+    <div class="conflict-tab-header">
+      <h3>⚖️ Conflict Resolution Decisions</h3>
+      <div class="conflict-meta-info">
+        <span>Session: <strong>${escapeHtml(conflictResolution.session_id || 'N/A')}</strong></span>
+        ${conflictResolution.resolved_at ? `<span>Resolved: <strong>${formatDate(conflictResolution.resolved_at)}</strong></span>` : ''}
+      </div>
+    </div>
+  `);
+
+  // User Decisions as cards
+  if (conflictResolution.user_decisions && Object.keys(conflictResolution.user_decisions).length > 0) {
+    const decisions = Object.entries(conflictResolution.user_decisions);
+
+    cards.push(`<div class="conflict-section-title">🎯 User Decisions (${decisions.length})</div>`);
+    cards.push('<div class="conflict-cards-grid">');
+
+    for (const [key, decision] of decisions) {
+      const label = key.replace(/_/g, ' ').replace(/\b\w/g, c => c.toUpperCase());
+      cards.push(`
+        <div class="conflict-card decision-card">
+          <div class="conflict-card-header">
+            <span class="conflict-card-label">${escapeHtml(label)}</span>
+          </div>
+          <div class="conflict-card-choice">
+            <span class="choice-label">Choice:</span>
+            <span class="choice-value">${escapeHtml(decision.choice || 'N/A')}</span>
+          </div>
+          ${decision.description ? `
+            <div class="conflict-card-desc">${escapeHtml(decision.description)}</div>
+          ` : ''}
+          ${decision.implications && decision.implications.length > 0 ? `
+            <div class="conflict-card-implications">
+              <span class="impl-label">Implications:</span>
+              <ul>
+                ${decision.implications.map(impl => `<li>${escapeHtml(impl)}</li>`).join('')}
+              </ul>
+            </div>
+          ` : ''}
+        </div>
+      `);
+    }
+    cards.push('</div>');
+  }
+
+  // Resolved Conflicts as cards
+  if (conflictResolution.resolved_conflicts && conflictResolution.resolved_conflicts.length > 0) {
+    cards.push(`<div class="conflict-section-title">✅ Resolved Conflicts (${conflictResolution.resolved_conflicts.length})</div>`);
+    cards.push('<div class="conflict-cards-grid">');
+
+    for (const conflict of conflictResolution.resolved_conflicts) {
+      cards.push(`
+        <div class="conflict-card resolved-card">
+          <div class="conflict-card-header">
+            <span class="conflict-card-id">${escapeHtml(conflict.id || 'N/A')}</span>
+            <span class="conflict-category-tag">${escapeHtml(conflict.category || 'General')}</span>
+          </div>
+          <div class="conflict-card-brief">${escapeHtml(conflict.brief || '')}</div>
+          <div class="conflict-card-strategy">
+            <span class="strategy-label">Strategy:</span>
+            <span class="strategy-tag">${escapeHtml(conflict.strategy || 'N/A')}</span>
+          </div>
+        </div>
+      `);
+    }
+    cards.push('</div>');
+  }
+
+  return `<div class="conflict-tab-content">${cards.join('')}</div>`;
+}

ccw/src/templates/dashboard-js/components/_exp_helpers.js

@@ -1,3 +1,5 @@
+// Exploration helpers loaded
+
 // Helper: Render exploration field with smart type detection
 function renderExpField(label, value) {
   if (value === null || value === undefined) return '';

ccw/src/templates/dashboard-js/components/_review_tab.js

@@ -0,0 +1,640 @@
+// ==========================================
+// Enhanced Review Tab with Multi-Select & Preview
+// ==========================================
+
+// Review tab state
+let reviewTabState = {
+  allFindings: [],
+  filteredFindings: [],
+  selectedFindings: new Set(),
+  currentFilters: {
+    dimension: 'all',
+    severities: new Set(),
+    search: ''
+  },
+  sortConfig: {
+    field: 'severity',
+    order: 'desc'
+  },
+  previewFinding: null,
+  sessionPath: null,
+  sessionId: null
+};
+
+// ==========================================
+// Main Review Tab Render
+// ==========================================
+
+function renderReviewContent(review) {
+  if (!review || !review.dimensions) {
+    return `
+      <div class="tab-empty-state">
+        <div class="empty-icon">🔍</div>
+        <div class="empty-title">No Review Data</div>
+        <div class="empty-text">No review findings in .review/</div>
+      </div>
+    `;
+  }
+
+  // Convert dimensions object to flat findings array
+  const findings = [];
+  let findingIndex = 0;
+
+  Object.entries(review.dimensions).forEach(([dim, rawFindings]) => {
+    let dimFindings = [];
+    if (Array.isArray(rawFindings)) {
+      dimFindings = rawFindings;
+    } else if (rawFindings && typeof rawFindings === 'object') {
+      if (Array.isArray(rawFindings.findings)) {
+        dimFindings = rawFindings.findings;
+      }
+    }
+
+    dimFindings.forEach(f => {
+      findings.push({
+        id: f.id || `finding-${findingIndex++}`,
+        title: f.title || 'Finding',
+        description: f.description || '',
+        severity: (f.severity || 'medium').toLowerCase(),
+        dimension: dim,
+        category: f.category || '',
+        file: f.file || '',
+        line: f.line || '',
+        code_context: f.code_context || f.snippet || '',
+        recommendations: f.recommendations || (f.recommendation ? [f.recommendation] : []),
+        root_cause: f.root_cause || '',
+        impact: f.impact || '',
+        references: f.references || [],
+        metadata: f.metadata || {}
+      });
+    });
+  });
+
+  if (findings.length === 0) {
+    return `
+      <div class="tab-empty-state">
+        <div class="empty-icon">🔍</div>
+        <div class="empty-title">No Findings</div>
+        <div class="empty-text">No review findings found.</div>
+      </div>
+    `;
+  }
+
+  // Store findings in state
+  reviewTabState.allFindings = findings;
+  reviewTabState.filteredFindings = [...findings];
+  reviewTabState.selectedFindings.clear();
+  reviewTabState.previewFinding = null;
+
+  // Get dimensions for tabs
+  const dimensions = [...new Set(findings.map(f => f.dimension))];
+
+  // Count by severity
+  const severityCounts = {
+    critical: findings.filter(f => f.severity === 'critical').length,
+    high: findings.filter(f => f.severity === 'high').length,
+    medium: findings.filter(f => f.severity === 'medium').length,
+    low: findings.filter(f => f.severity === 'low').length
+  };
+
+  return `
+    <div class="review-enhanced-container">
+      <!-- Header with Stats & Controls -->
+      <div class="review-header-bar">
+        <div class="review-severity-stats">
+          <span class="severity-stat critical" onclick="filterReviewBySeverity('critical')" title="Filter Critical">
+            🔴 ${severityCounts.critical}
+          </span>
+          <span class="severity-stat high" onclick="filterReviewBySeverity('high')" title="Filter High">
+            🟠 ${severityCounts.high}
+          </span>
+          <span class="severity-stat medium" onclick="filterReviewBySeverity('medium')" title="Filter Medium">
+            🟡 ${severityCounts.medium}
+          </span>
+          <span class="severity-stat low" onclick="filterReviewBySeverity('low')" title="Filter Low">
+            🟢 ${severityCounts.low}
+          </span>
+        </div>
+
+        <div class="review-search-box">
+          <input type="text"
+                 id="reviewSearchInput"
+                 placeholder="Search findings..."
+                 oninput="onReviewSearch(this.value)">
+        </div>
+
+        <div class="review-selection-controls">
+          <span class="selection-counter" id="reviewSelectionCounter">0 selected</span>
+          <button class="btn-mini" onclick="selectAllReviewFindings()">Select All</button>
+          <button class="btn-mini" onclick="selectVisibleReviewFindings()">Select Visible</button>
+          <button class="btn-mini" onclick="clearReviewSelection()">Clear</button>
+        </div>
+
+        <button class="btn-export-fix" id="exportFixBtn" onclick="exportReviewFixJson()" disabled>
+          🔧 Export Fix JSON
+        </button>
+      </div>
+
+      <!-- Filter Bar -->
+      <div class="review-filter-bar">
+        <div class="filter-group">
+          <span class="filter-label">Severity:</span>
+          <div class="filter-chips">
+            <label class="filter-chip" id="filter-critical">
+              <input type="checkbox" onchange="toggleReviewSeverityFilter('critical')">
+              <span>Critical</span>
+            </label>
+            <label class="filter-chip" id="filter-high">
+              <input type="checkbox" onchange="toggleReviewSeverityFilter('high')">
+              <span>High</span>
+            </label>
+            <label class="filter-chip" id="filter-medium">
+              <input type="checkbox" onchange="toggleReviewSeverityFilter('medium')">
+              <span>Medium</span>
+            </label>
+            <label class="filter-chip" id="filter-low">
+              <input type="checkbox" onchange="toggleReviewSeverityFilter('low')">
+              <span>Low</span>
+            </label>
+          </div>
+        </div>
+
+        <div class="filter-group">
+          <span class="filter-label">Sort:</span>
+          <select id="reviewSortSelect" class="sort-select" onchange="sortReviewFindings()">
+            <option value="severity">By Severity</option>
+            <option value="dimension">By Dimension</option>
+            <option value="file">By File</option>
+          </select>
+          <button class="btn-sort-order" id="reviewSortOrderBtn" onclick="toggleReviewSortOrder()">
+            <span id="reviewSortOrderIcon">↓</span>
+          </button>
+        </div>
+
+        <button class="btn-mini" onclick="resetReviewFilters()">Reset Filters</button>
+      </div>
+
+      <!-- Dimension Tabs -->
+      <div class="review-dimension-tabs">
+        <button class="dim-tab active" data-dimension="all" onclick="filterReviewByDimension('all')">
+          All (${findings.length})
+        </button>
+        ${dimensions.map(dim => `
+          <button class="dim-tab" data-dimension="${dim}" onclick="filterReviewByDimension('${dim}')">
+            ${escapeHtml(dim)} (${findings.filter(f => f.dimension === dim).length})
+          </button>
+        `).join('')}
+      </div>
+
+      <!-- Split Panel: List + Preview -->
+      <div class="review-split-panel">
+        <!-- Left: Findings List -->
+        <div class="review-findings-panel">
+          <div class="findings-list-header">
+            <span id="reviewFindingsCount">${findings.length} findings</span>
+          </div>
+          <div class="review-findings-list" id="reviewFindingsList">
+            ${renderReviewFindingsList(findings)}
+          </div>
+        </div>
+
+        <!-- Right: Preview Panel -->
+        <div class="review-preview-panel" id="reviewPreviewPanel">
+          <div class="preview-empty-state">
+            <div class="preview-icon">👆</div>
+            <div class="preview-text">Click on a finding to preview details</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  `;
+}
+
+// ==========================================
+// Findings List Rendering
+// ==========================================
+
+function renderReviewFindingsList(findings) {
+  if (findings.length === 0) {
+    return `
+      <div class="findings-empty">
+        <span class="empty-icon">✨</span>
+        <span>No findings match your filters</span>
+      </div>
+    `;
+  }
+
+  return findings.map(finding => `
+    <div class="review-finding-item ${finding.severity} ${reviewTabState.selectedFindings.has(finding.id) ? 'selected' : ''}"
+         data-finding-id="${finding.id}"
+         onclick="previewReviewFinding('${finding.id}')">
+      <input type="checkbox"
+             class="finding-checkbox"
+             ${reviewTabState.selectedFindings.has(finding.id) ? 'checked' : ''}
+             onclick="toggleReviewFindingSelection('${finding.id}', event)">
+      <div class="finding-content">
+        <div class="finding-top-row">
+          <span class="severity-badge ${finding.severity}">${finding.severity}</span>
+          <span class="dimension-badge">${escapeHtml(finding.dimension)}</span>
+        </div>
+        <div class="finding-title">${escapeHtml(finding.title)}</div>
+        ${finding.file ? `<div class="finding-file">📄 ${escapeHtml(finding.file)}${finding.line ? ':' + finding.line : ''}</div>` : ''}
+      </div>
+    </div>
+  `).join('');
+}
+
+// ==========================================
+// Preview Panel Rendering
+// ==========================================
+
+function previewReviewFinding(findingId) {
+  const finding = reviewTabState.allFindings.find(f => f.id === findingId);
+  if (!finding) return;
+
+  reviewTabState.previewFinding = finding;
+
+  // Update active state in list
+  document.querySelectorAll('.review-finding-item').forEach(item => {
+    item.classList.toggle('previewing', item.dataset.findingId === findingId);
+  });
+
+  const previewPanel = document.getElementById('reviewPreviewPanel');
+  if (!previewPanel) return;
+
+  previewPanel.innerHTML = `
+    <div class="preview-content">
+      <div class="preview-header">
+        <div class="preview-badges">
+          <span class="severity-badge ${finding.severity}">${finding.severity}</span>
+          <span class="dimension-badge">${escapeHtml(finding.dimension)}</span>
+          ${finding.category ? `<span class="category-badge">${escapeHtml(finding.category)}</span>` : ''}
+        </div>
+        <button class="btn-select-finding ${reviewTabState.selectedFindings.has(finding.id) ? 'selected' : ''}"
+                onclick="toggleReviewFindingSelection('${finding.id}', event)">
+          ${reviewTabState.selectedFindings.has(finding.id) ? '✓ Selected' : '+ Select for Fix'}
+        </button>
+      </div>
+
+      <h3 class="preview-title">${escapeHtml(finding.title)}</h3>
+
+      ${finding.file ? `
+        <div class="preview-section">
+          <div class="preview-section-title">📄 Location</div>
+          <div class="preview-location">
+            <code>${escapeHtml(finding.file)}${finding.line ? ':' + finding.line : ''}</code>
+          </div>
+        </div>
+      ` : ''}
+
+      <div class="preview-section">
+        <div class="preview-section-title">📝 Description</div>
+        <div class="preview-description">${escapeHtml(finding.description)}</div>
+      </div>
+
+      ${finding.code_context ? `
+        <div class="preview-section">
+          <div class="preview-section-title">💻 Code Context</div>
+          <pre class="preview-code">${escapeHtml(finding.code_context)}</pre>
+        </div>
+      ` : ''}
+
+      ${finding.recommendations && finding.recommendations.length > 0 ? `
+        <div class="preview-section">
+          <div class="preview-section-title">✅ Recommendations</div>
+          <ul class="preview-recommendations">
+            ${finding.recommendations.map(r => `<li>${escapeHtml(r)}</li>`).join('')}
+          </ul>
+        </div>
+      ` : ''}
+
+      ${finding.root_cause ? `
+        <div class="preview-section">
+          <div class="preview-section-title">🔍 Root Cause</div>
+          <div class="preview-root-cause">${escapeHtml(finding.root_cause)}</div>
+        </div>
+      ` : ''}
+
+      ${finding.impact ? `
+        <div class="preview-section">
+          <div class="preview-section-title">⚠️ Impact</div>
+          <div class="preview-impact">${escapeHtml(finding.impact)}</div>
+        </div>
+      ` : ''}
+
+      ${finding.references && finding.references.length > 0 ? `
+        <div class="preview-section">
+          <div class="preview-section-title">🔗 References</div>
+          <ul class="preview-references">
+            ${finding.references.map(ref => {
+              const isUrl = ref.startsWith('http');
+              return `<li>${isUrl ? `<a href="${ref}" target="_blank">${ref}</a>` : ref}</li>`;
+            }).join('')}
+          </ul>
+        </div>
+      ` : ''}
+
+      ${finding.metadata && Object.keys(finding.metadata).length > 0 ? `
+        <div class="preview-section">
+          <div class="preview-section-title">ℹ️ Metadata</div>
+          <div class="preview-metadata">
+            ${Object.entries(finding.metadata).map(([key, value]) => `
+              <div class="metadata-item">
+                <span class="meta-key">${escapeHtml(key)}:</span>
+                <span class="meta-value">${escapeHtml(String(value))}</span>
+              </div>
+            `).join('')}
+          </div>
+        </div>
+      ` : ''}
+    </div>
+  `;
+}
+
+// ==========================================
+// Selection Management
+// ==========================================
+
+function toggleReviewFindingSelection(findingId, event) {
+  if (event) {
+    event.stopPropagation();
+  }
+
+  if (reviewTabState.selectedFindings.has(findingId)) {
+    reviewTabState.selectedFindings.delete(findingId);
+  } else {
+    reviewTabState.selectedFindings.add(findingId);
+  }
+
+  updateReviewSelectionUI();
+
+  // Update preview panel button if this finding is being previewed
+  if (reviewTabState.previewFinding && reviewTabState.previewFinding.id === findingId) {
+    previewReviewFinding(findingId);
+  }
+}
+
+function selectAllReviewFindings() {
+  reviewTabState.allFindings.forEach(f => reviewTabState.selectedFindings.add(f.id));
+  updateReviewSelectionUI();
+}
+
+function selectVisibleReviewFindings() {
+  reviewTabState.filteredFindings.forEach(f => reviewTabState.selectedFindings.add(f.id));
+  updateReviewSelectionUI();
+}
+
+function selectReviewBySeverity(severity) {
+  reviewTabState.allFindings
+    .filter(f => f.severity === severity)
+    .forEach(f => reviewTabState.selectedFindings.add(f.id));
+  updateReviewSelectionUI();
+}
+
+function clearReviewSelection() {
+  reviewTabState.selectedFindings.clear();
+  updateReviewSelectionUI();
+}
+
+function updateReviewSelectionUI() {
+  // Update counter
+  const counter = document.getElementById('reviewSelectionCounter');
+  if (counter) {
+    counter.textContent = `${reviewTabState.selectedFindings.size} selected`;
+  }
+
+  // Update export button
+  const exportBtn = document.getElementById('exportFixBtn');
+  if (exportBtn) {
+    exportBtn.disabled = reviewTabState.selectedFindings.size === 0;
+  }
+
+  // Update checkbox states in list
+  document.querySelectorAll('.review-finding-item').forEach(item => {
+    const findingId = item.dataset.findingId;
+    const isSelected = reviewTabState.selectedFindings.has(findingId);
+    item.classList.toggle('selected', isSelected);
+    const checkbox = item.querySelector('.finding-checkbox');
+    if (checkbox) {
+      checkbox.checked = isSelected;
+    }
+  });
+}
+
+// ==========================================
+// Filtering & Sorting
+// ==========================================
+
+function filterReviewByDimension(dimension) {
+  reviewTabState.currentFilters.dimension = dimension;
+
+  // Update tab active state
+  document.querySelectorAll('.dim-tab').forEach(tab => {
+    tab.classList.toggle('active', tab.dataset.dimension === dimension);
+  });
+
+  applyReviewFilters();
+}
+
+function filterReviewBySeverity(severity) {
+  // Toggle the severity filter
+  if (reviewTabState.currentFilters.severities.has(severity)) {
+    reviewTabState.currentFilters.severities.delete(severity);
+  } else {
+    reviewTabState.currentFilters.severities.add(severity);
+  }
+
+  // Update filter chip UI
+  const filterChip = document.getElementById(`filter-${severity}`);
+  if (filterChip) {
+    filterChip.classList.toggle('active', reviewTabState.currentFilters.severities.has(severity));
+    const checkbox = filterChip.querySelector('input[type="checkbox"]');
+    if (checkbox) {
+      checkbox.checked = reviewTabState.currentFilters.severities.has(severity);
+    }
+  }
+
+  applyReviewFilters();
+}
+
+function toggleReviewSeverityFilter(severity) {
+  filterReviewBySeverity(severity);
+}
+
+function onReviewSearch(searchText) {
+  reviewTabState.currentFilters.search = searchText.toLowerCase();
+  applyReviewFilters();
+}
+
+function applyReviewFilters() {
+  reviewTabState.filteredFindings = reviewTabState.allFindings.filter(finding => {
+    // Dimension filter
+    if (reviewTabState.currentFilters.dimension !== 'all') {
+      if (finding.dimension !== reviewTabState.currentFilters.dimension) {
+        return false;
+      }
+    }
+
+    // Severity filter (multi-select)
+    if (reviewTabState.currentFilters.severities.size > 0) {
+      if (!reviewTabState.currentFilters.severities.has(finding.severity)) {
+        return false;
+      }
+    }
+
+    // Search filter
+    if (reviewTabState.currentFilters.search) {
+      const searchText = `${finding.title} ${finding.description} ${finding.file} ${finding.category}`.toLowerCase();
+      if (!searchText.includes(reviewTabState.currentFilters.search)) {
+        return false;
+      }
+    }
+
+    return true;
+  });
+
+  sortReviewFindings();
+}
+
+function sortReviewFindings() {
+  const sortBy = document.getElementById('reviewSortSelect')?.value || 'severity';
+  reviewTabState.sortConfig.field = sortBy;
+
+  const severityOrder = { critical: 0, high: 1, medium: 2, low: 3 };
+
+  reviewTabState.filteredFindings.sort((a, b) => {
+    let comparison = 0;
+
+    if (sortBy === 'severity') {
+      comparison = severityOrder[a.severity] - severityOrder[b.severity];
+    } else if (sortBy === 'dimension') {
+      comparison = a.dimension.localeCompare(b.dimension);
+    } else if (sortBy === 'file') {
+      comparison = (a.file || '').localeCompare(b.file || '');
+    }
+
+    return reviewTabState.sortConfig.order === 'asc' ? comparison : -comparison;
+  });
+
+  renderFilteredReviewFindings();
+}
+
+function toggleReviewSortOrder() {
+  reviewTabState.sortConfig.order = reviewTabState.sortConfig.order === 'asc' ? 'desc' : 'asc';
+
+  const icon = document.getElementById('reviewSortOrderIcon');
+  if (icon) {
+    icon.textContent = reviewTabState.sortConfig.order === 'asc' ? '↑' : '↓';
+  }
+
+  sortReviewFindings();
+}
+
+function resetReviewFilters() {
+  // Reset state
+  reviewTabState.currentFilters.dimension = 'all';
+  reviewTabState.currentFilters.severities.clear();
+  reviewTabState.currentFilters.search = '';
+  reviewTabState.sortConfig.field = 'severity';
+  reviewTabState.sortConfig.order = 'desc';
+
+  // Reset UI
+  document.querySelectorAll('.dim-tab').forEach(tab => {
+    tab.classList.toggle('active', tab.dataset.dimension === 'all');
+  });
+
+  document.querySelectorAll('.filter-chip').forEach(chip => {
+    chip.classList.remove('active');
+    const checkbox = chip.querySelector('input[type="checkbox"]');
+    if (checkbox) checkbox.checked = false;
+  });
+
+  const searchInput = document.getElementById('reviewSearchInput');
+  if (searchInput) searchInput.value = '';
+
+  const sortSelect = document.getElementById('reviewSortSelect');
+  if (sortSelect) sortSelect.value = 'severity';
+
+  const sortIcon = document.getElementById('reviewSortOrderIcon');
+  if (sortIcon) sortIcon.textContent = '↓';
+
+  // Re-apply filters
+  reviewTabState.filteredFindings = [...reviewTabState.allFindings];
+  sortReviewFindings();
+}
+
+function renderFilteredReviewFindings() {
+  const listContainer = document.getElementById('reviewFindingsList');
+  const countEl = document.getElementById('reviewFindingsCount');
+
+  if (listContainer) {
+    listContainer.innerHTML = renderReviewFindingsList(reviewTabState.filteredFindings);
+  }
+
+  if (countEl) {
+    countEl.textContent = `${reviewTabState.filteredFindings.length} findings`;
+  }
+}
+
+// ==========================================
+// Export Fix JSON
+// ==========================================
+
+function exportReviewFixJson() {
+  if (reviewTabState.selectedFindings.size === 0) {
+    showToast('Please select at least one finding to export', 'error');
+    return;
+  }
+
+  const selectedFindingsData = reviewTabState.allFindings.filter(f =>
+    reviewTabState.selectedFindings.has(f.id)
+  );
+
+  const session = sessionDataStore[currentSessionDetailKey];
+  const sessionId = session?.session_id || 'unknown';
+  const exportId = `fix-${Date.now()}`;
+
+  const exportData = {
+    export_id: exportId,
+    export_timestamp: new Date().toISOString(),
+    review_id: `review-${sessionId}`,
+    session_id: sessionId,
+    findings_count: selectedFindingsData.length,
+    findings: selectedFindingsData.map(f => ({
+      id: f.id,
+      title: f.title,
+      description: f.description,
+      severity: f.severity,
+      dimension: f.dimension,
+      category: f.category || 'uncategorized',
+      file: f.file,
+      line: f.line,
+      code_context: f.code_context || null,
+      recommendations: f.recommendations || [],
+      root_cause: f.root_cause || null
+    }))
+  };
+
+  // Convert to JSON and download
+  const jsonStr = JSON.stringify(exportData, null, 2);
+  const blob = new Blob([jsonStr], { type: 'application/json' });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement('a');
+  const filename = `fix-export-${exportId}.json`;
+  a.href = url;
+  a.download = filename;
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+
+  // Show success notification
+  const severityCounts = {
+    critical: selectedFindingsData.filter(f => f.severity === 'critical').length,
+    high: selectedFindingsData.filter(f => f.severity === 'high').length,
+    medium: selectedFindingsData.filter(f => f.severity === 'medium').length,
+    low: selectedFindingsData.filter(f => f.severity === 'low').length
+  };
+
+  showToast(`Exported ${selectedFindingsData.length} findings for fixing (Critical: ${severityCounts.critical}, High: ${severityCounts.high}, Medium: ${severityCounts.medium}, Low: ${severityCounts.low})`, 'success');
+}

ccw/src/templates/dashboard-js/components/carousel.js

@@ -118,6 +118,14 @@ function renderCarouselSlide(direction = 'none') {
   }
 
   const session = carouselSessions[carouselIndex];
+  const sessionType = session.type || 'workflow';
+
+  // Use simplified view for review sessions
+  if (sessionType === 'review') {
+    renderReviewCarouselSlide(container, session, direction);
+    return;
+  }
+
   const tasks = session.tasks || [];
   const completed = tasks.filter(t => t.status === 'completed').length;
   const inProgress = tasks.filter(t => t.status === 'in_progress').length;
@@ -126,7 +134,6 @@ function renderCarouselSlide(direction = 'none') {
   const progress = taskCount > 0 ? Math.round((completed / taskCount) * 100) : 0;
 
   // Get session type badge
-  const sessionType = session.type || 'workflow';
   const typeBadgeClass = getSessionTypeBadgeClass(sessionType);
 
   const sessionKey = `session-${session.session_id}`.replace(/[^a-zA-Z0-9-]/g, '-');
@@ -217,6 +224,48 @@ function renderCarouselSlide(direction = 'none') {
   }
 }
 
+// Simplified carousel slide for review sessions
+function renderReviewCarouselSlide(container, session, direction) {
+  const typeBadgeClass = getSessionTypeBadgeClass('review');
+  const sessionKey = `session-${session.session_id}`.replace(/[^a-zA-Z0-9-]/g, '-');
+  const animClass = direction === 'left' ? 'carousel-slide-left' :
+                    direction === 'right' ? 'carousel-slide-right' : 'carousel-fade-in';
+  const createdTime = session.created_at ? formatRelativeTime(session.created_at) : '';
+
+  container.innerHTML = `
+    <div class="carousel-slide ${animClass} h-full">
+      <div class="session-card h-full p-3 cursor-pointer hover:bg-hover/30 transition-colors"
+           onclick="showSessionDetailPage('${sessionKey}')">
+        <div class="flex flex-col h-full">
+          <!-- Header -->
+          <div class="flex items-center gap-2 mb-2">
+            <span class="px-2 py-0.5 text-xs font-medium rounded ${typeBadgeClass}">review</span>
+          </div>
+          <h4 class="font-semibold text-foreground text-sm line-clamp-2 mb-3" title="${escapeHtml(session.session_id)}">${escapeHtml(session.session_id)}</h4>
+
+          <!-- Simple info -->
+          <div class="flex-1 flex items-center justify-center">
+            <div class="text-center">
+              <div class="text-3xl mb-1">🔍</div>
+              <div class="text-xs text-muted-foreground">Click to view findings</div>
+            </div>
+          </div>
+
+          <!-- Footer -->
+          <div class="mt-auto text-xs text-muted-foreground">
+            📅 ${createdTime}
+          </div>
+        </div>
+      </div>
+    </div>
+  `;
+
+  // Store session data for navigation
+  if (!sessionDataStore[sessionKey]) {
+    sessionDataStore[sessionKey] = session;
+  }
+}
+
 function getSessionTypeBadgeClass(type) {
   const classes = {
     'tdd': 'bg-purple-100 text-purple-700 dark:bg-purple-900/30 dark:text-purple-400',

ccw/src/templates/dashboard-js/components/mcp-manager.js

@@ -5,6 +5,7 @@
 let mcpConfig = null;
 let mcpAllProjects = {};
 let mcpCurrentProjectServers = {};
+let mcpCreateMode = 'form'; // 'form' or 'json'
 
 // ========== Initialization ==========
 function initMcpManager() {
@@ -189,13 +190,21 @@ function openMcpCreateModal() {
   const modal = document.getElementById('mcpCreateModal');
   if (modal) {
     modal.classList.remove('hidden');
+    // Reset to form mode
+    mcpCreateMode = 'form';
+    switchMcpCreateTab('form');
     // Clear form
     document.getElementById('mcpServerName').value = '';
     document.getElementById('mcpServerCommand').value = '';
     document.getElementById('mcpServerArgs').value = '';
     document.getElementById('mcpServerEnv').value = '';
+    // Clear JSON input
+    document.getElementById('mcpServerJson').value = '';
+    document.getElementById('mcpJsonPreview').classList.add('hidden');
     // Focus on name input
     document.getElementById('mcpServerName').focus();
+    // Setup JSON input listener
+    setupMcpJsonListener();
   }
 }
 
@@ -206,7 +215,139 @@ function closeMcpCreateModal() {
   }
 }
 
+function switchMcpCreateTab(tab) {
+  mcpCreateMode = tab;
+  const formMode = document.getElementById('mcpFormMode');
+  const jsonMode = document.getElementById('mcpJsonMode');
+  const tabForm = document.getElementById('mcpTabForm');
+  const tabJson = document.getElementById('mcpTabJson');
+
+  if (tab === 'form') {
+    formMode.classList.remove('hidden');
+    jsonMode.classList.add('hidden');
+    tabForm.classList.add('active');
+    tabJson.classList.remove('active');
+  } else {
+    formMode.classList.add('hidden');
+    jsonMode.classList.remove('hidden');
+    tabForm.classList.remove('active');
+    tabJson.classList.add('active');
+  }
+}
+
+function setupMcpJsonListener() {
+  const jsonInput = document.getElementById('mcpServerJson');
+  if (jsonInput && !jsonInput.hasAttribute('data-listener-attached')) {
+    jsonInput.setAttribute('data-listener-attached', 'true');
+    jsonInput.addEventListener('input', () => {
+      updateMcpJsonPreview();
+    });
+  }
+}
+
+function parseMcpJsonConfig(jsonText) {
+  if (!jsonText.trim()) {
+    return { servers: {}, error: null };
+  }
+
+  try {
+    const parsed = JSON.parse(jsonText);
+    let servers = {};
+
+    // Support multiple formats:
+    // 1. {"servers": {...}} format (claude desktop style)
+    // 2. {"mcpServers": {...}} format (claude.json style)
+    // 3. {"serverName": {command, args}} format (direct server config)
+    // 4. {command, args} format (single server without name)
+
+    if (parsed.servers && typeof parsed.servers === 'object') {
+      servers = parsed.servers;
+    } else if (parsed.mcpServers && typeof parsed.mcpServers === 'object') {
+      servers = parsed.mcpServers;
+    } else if (parsed.command && typeof parsed.command === 'string') {
+      // Single server without name - will prompt for name
+      servers = { '__unnamed__': parsed };
+    } else {
+      // Check if all values are server configs (have 'command' property)
+      const isDirectServerConfig = Object.values(parsed).every(
+        v => v && typeof v === 'object' && v.command
+      );
+      if (isDirectServerConfig && Object.keys(parsed).length > 0) {
+        servers = parsed;
+      } else {
+        return { servers: {}, error: 'Invalid MCP server JSON format' };
+      }
+    }
+
+    // Validate each server config
+    for (const [name, config] of Object.entries(servers)) {
+      if (!config.command || typeof config.command !== 'string') {
+        return { servers: {}, error: `Server "${name}" missing required "command" field` };
+      }
+      if (config.args && !Array.isArray(config.args)) {
+        return { servers: {}, error: `Server "${name}" has invalid "args" (must be array)` };
+      }
+      if (config.env && typeof config.env !== 'object') {
+        return { servers: {}, error: `Server "${name}" has invalid "env" (must be object)` };
+      }
+    }
+
+    return { servers, error: null };
+  } catch (e) {
+    return { servers: {}, error: 'Invalid JSON: ' + e.message };
+  }
+}
+
+function updateMcpJsonPreview() {
+  const jsonInput = document.getElementById('mcpServerJson');
+  const previewContainer = document.getElementById('mcpJsonPreview');
+  const previewContent = document.getElementById('mcpJsonPreviewContent');
+
+  const jsonText = jsonInput.value;
+  const { servers, error } = parseMcpJsonConfig(jsonText);
+
+  if (!jsonText.trim()) {
+    previewContainer.classList.add('hidden');
+    return;
+  }
+
+  previewContainer.classList.remove('hidden');
+
+  if (error) {
+    previewContent.innerHTML = `<div class="text-destructive">${escapeHtml(error)}</div>`;
+    return;
+  }
+
+  const serverCount = Object.keys(servers).length;
+  if (serverCount === 0) {
+    previewContent.innerHTML = `<div class="text-muted-foreground">No servers found</div>`;
+    return;
+  }
+
+  const previewHtml = Object.entries(servers).map(([name, config]) => {
+    const displayName = name === '__unnamed__' ? '(will prompt for name)' : name;
+    const argsPreview = config.args ? config.args.slice(0, 2).join(' ') + (config.args.length > 2 ? '...' : '') : '';
+    return `
+      <div class="flex items-center gap-2 p-2 bg-background rounded">
+        <span class="text-success">+</span>
+        <span class="font-medium">${escapeHtml(displayName)}</span>
+        <span class="text-muted-foreground text-xs">${escapeHtml(config.command)} ${escapeHtml(argsPreview)}</span>
+      </div>
+    `;
+  }).join('');
+
+  previewContent.innerHTML = previewHtml;
+}
+
 async function submitMcpCreate() {
+  if (mcpCreateMode === 'json') {
+    await submitMcpCreateFromJson();
+  } else {
+    await submitMcpCreateFromForm();
+  }
+}
+
+async function submitMcpCreateFromForm() {
   const name = document.getElementById('mcpServerName').value.trim();
   const command = document.getElementById('mcpServerCommand').value.trim();
   const argsText = document.getElementById('mcpServerArgs').value.trim();
@@ -255,6 +396,86 @@ async function submitMcpCreate() {
     serverConfig.env = env;
   }
 
+  await createMcpServerWithConfig(name, serverConfig);
+}
+
+async function submitMcpCreateFromJson() {
+  const jsonText = document.getElementById('mcpServerJson').value.trim();
+
+  if (!jsonText) {
+    showRefreshToast('Please enter JSON configuration', 'error');
+    document.getElementById('mcpServerJson').focus();
+    return;
+  }
+
+  const { servers, error } = parseMcpJsonConfig(jsonText);
+
+  if (error) {
+    showRefreshToast(error, 'error');
+    return;
+  }
+
+  if (Object.keys(servers).length === 0) {
+    showRefreshToast('No valid servers found in JSON', 'error');
+    return;
+  }
+
+  // Handle unnamed server case
+  if (servers['__unnamed__']) {
+    const serverName = prompt('Enter a name for this MCP server:');
+    if (!serverName || !serverName.trim()) {
+      showRefreshToast('Server name is required', 'error');
+      return;
+    }
+    servers[serverName.trim()] = servers['__unnamed__'];
+    delete servers['__unnamed__'];
+  }
+
+  // Add all servers
+  let successCount = 0;
+  let failCount = 0;
+  const serverNames = Object.keys(servers);
+
+  for (const [name, config] of Object.entries(servers)) {
+    try {
+      const response = await fetch('/api/mcp-copy-server', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          projectPath: projectPath,
+          serverName: name,
+          serverConfig: config
+        })
+      });
+
+      if (!response.ok) throw new Error('Failed to create MCP server');
+
+      const result = await response.json();
+      if (result.success) {
+        successCount++;
+      } else {
+        failCount++;
+      }
+    } catch (err) {
+      console.error(`Failed to create MCP server "${name}":`, err);
+      failCount++;
+    }
+  }
+
+  closeMcpCreateModal();
+  await loadMcpConfig();
+  renderMcpManager();
+
+  if (failCount === 0) {
+    showRefreshToast(`${successCount} MCP server${successCount > 1 ? 's' : ''} created successfully`, 'success');
+  } else if (successCount > 0) {
+    showRefreshToast(`${successCount} created, ${failCount} failed`, 'warning');
+  } else {
+    showRefreshToast('Failed to create MCP servers', 'error');
+  }
+}
+
+async function createMcpServerWithConfig(name, serverConfig) {
   // Submit to API
   try {
     const response = await fetch('/api/mcp-copy-server', {

ccw/src/templates/dashboard-js/components/navigation.js

@@ -62,6 +62,7 @@ function initNavigation() {
       currentView = 'sessions';
       currentSessionDetailKey = null;
       updateContentTitle();
+      showStatsAndSearch();
       renderSessions();
     });
   });
@@ -75,6 +76,7 @@ function initNavigation() {
       currentView = 'liteTasks';
       currentSessionDetailKey = null;
       updateContentTitle();
+      showStatsAndSearch();
       renderLiteTasks();
     });
   });

ccw/src/templates/dashboard-js/components/tabs-context.js

@@ -970,10 +970,6 @@ function renderConflictDetectionSection(conflictDetection) {
 function renderSessionContextContent(context, explorations, conflictResolution) {
   let sections = [];
 
-  // Render conflict resolution decisions if available
-  if (conflictResolution) {
-    sections.push(renderConflictResolutionContext(conflictResolution));
-  }
 
   // Render explorations if available (from exploration-*.json files)
   if (explorations && explorations.manifest) {
@@ -1002,7 +998,7 @@ function renderSessionContextContent(context, explorations, conflictResolution)
     <div class="tab-empty-state">
       <div class="empty-icon">📦</div>
       <div class="empty-title">No Context Data</div>
-      <div class="empty-text">No context-package.json, exploration files, or conflict resolution data found for this session.</div>
+      <div class="empty-text">No context-package.json or exploration files found for this session.</div>
     </div>
   `;
 }

ccw/src/templates/dashboard-js/components/tabs-other.js

@@ -89,69 +89,8 @@ function renderImplPlanContent(implPlan) {
 // ==========================================
 // Review Tab Rendering
 // ==========================================
-
-function renderReviewContent(review) {
-  if (!review || !review.dimensions) {
-    return `
-      <div class="tab-empty-state">
-        <div class="empty-icon">🔍</div>
-        <div class="empty-title">No Review Data</div>
-        <div class="empty-text">No review findings in .review/</div>
-      </div>
-    `;
-  }
-
-  const dimensions = Object.entries(review.dimensions);
-  if (dimensions.length === 0) {
-    return `
-      <div class="tab-empty-state">
-        <div class="empty-icon">🔍</div>
-        <div class="empty-title">No Findings</div>
-        <div class="empty-text">No review findings found.</div>
-      </div>
-    `;
-  }
-
-  return `
-    <div class="review-tab-content">
-      ${dimensions.map(([dim, rawFindings]) => {
-        // Normalize findings to always be an array
-        let findings = [];
-        if (Array.isArray(rawFindings)) {
-          findings = rawFindings;
-        } else if (rawFindings && typeof rawFindings === 'object') {
-          // If it's an object with a findings array, use that
-          if (Array.isArray(rawFindings.findings)) {
-            findings = rawFindings.findings;
-          } else {
-            // Wrap single object in array or show raw JSON
-            findings = [{ title: dim, description: JSON.stringify(rawFindings, null, 2), severity: 'info' }];
-          }
-        }
-
-        return `
-        <div class="review-dimension-section">
-          <div class="dimension-header">
-            <span class="dimension-name">${escapeHtml(dim)}</span>
-            <span class="dimension-count">${findings.length} finding${findings.length !== 1 ? 's' : ''}</span>
-          </div>
-          <div class="dimension-findings">
-            ${findings.map(f => `
-              <div class="finding-item ${f.severity || 'medium'}">
-                <div class="finding-header">
-                  <span class="finding-severity ${f.severity || 'medium'}">${f.severity || 'medium'}</span>
-                  <span class="finding-title">${escapeHtml(f.title || 'Finding')}</span>
-                </div>
-                <p class="finding-description">${escapeHtml(f.description || '')}</p>
-                ${f.file ? `<div class="finding-file">📄 ${escapeHtml(f.file)}${f.line ? ':' + f.line : ''}</div>` : ''}
-              </div>
-            `).join('')}
-          </div>
-        </div>
-      `}).join('')}
-    </div>
-  `;
-}
+// NOTE: Enhanced review tab with multi-select, filtering, and preview panel
+// is now in _review_tab.js - renderReviewContent() function defined there
 
 // ==========================================
 // Lite Context Tab Rendering