mirror of
https://github.com/catlog22/Claude-Code-Workflow.git
synced 2026-02-09 02:24:11 +08:00
feat: add issue discovery view for managing discovery sessions and findings
- Implemented main render function for the issue discovery view. - Added data loading functions to fetch discoveries, details, findings, and progress. - Created rendering functions for discovery list and detail sections. - Introduced filtering and searching capabilities for findings. - Implemented actions for exporting and dismissing findings. - Added polling mechanism to track discovery progress. - Included utility functions for HTML escaping and cleanup.
This commit is contained in:
catlog22
@@ -47,7 +47,8 @@ const MODULE_CSS_FILES = [
|
||||
'28-mcp-manager.css',
|
||||
'29-help.css',
|
||||
'30-core-memory.css',
|
||||
'31-api-settings.css'
|
||||
'31-api-settings.css',
|
||||
'34-discovery.css'
|
||||
];
|
||||
|
||||
const MODULE_FILES = [
|
||||
@@ -97,6 +98,8 @@ const MODULE_FILES = [
|
||||
'views/rules-manager.js',
|
||||
'views/claude-manager.js',
|
||||
'views/api-settings.js',
|
||||
'views/issue-manager.js',
|
||||
'views/issue-discovery.js',
|
||||
'views/help.js',
|
||||
'main.js'
|
||||
];
|
||||
|
||||
454
ccw/src/core/routes/discovery-routes.ts
Normal file
454
ccw/src/core/routes/discovery-routes.ts
Normal file
@@ -0,0 +1,454 @@
|
||||
// @ts-nocheck
|
||||
/**
|
||||
* Discovery Routes Module
|
||||
*
|
||||
* Storage Structure:
|
||||
* .workflow/issues/discoveries/
|
||||
* ├── index.json # Discovery session index
|
||||
* └── {discovery-id}/
|
||||
* ├── discovery-state.json # State machine
|
||||
* ├── discovery-progress.json # Real-time progress
|
||||
* ├── perspectives/ # Per-perspective results
|
||||
* │ ├── bug.json
|
||||
* │ └── ...
|
||||
* ├── external-research.json # Exa research results
|
||||
* ├── discovery-issues.jsonl # Generated candidate issues
|
||||
* └── reports/
|
||||
*
|
||||
* API Endpoints:
|
||||
* - GET /api/discoveries - List all discovery sessions
|
||||
* - GET /api/discoveries/:id - Get discovery session detail
|
||||
* - GET /api/discoveries/:id/findings - Get all findings
|
||||
* - GET /api/discoveries/:id/progress - Get real-time progress
|
||||
* - POST /api/discoveries/:id/export - Export findings as issues
|
||||
* - PATCH /api/discoveries/:id/findings/:fid - Update finding status
|
||||
* - DELETE /api/discoveries/:id - Delete discovery session
|
||||
*/
|
||||
import type { IncomingMessage, ServerResponse } from 'http';
|
||||
import { readFileSync, existsSync, writeFileSync, mkdirSync, readdirSync, rmSync } from 'fs';
|
||||
import { join } from 'path';
|
||||
|
||||
export interface RouteContext {
|
||||
pathname: string;
|
||||
url: URL;
|
||||
req: IncomingMessage;
|
||||
res: ServerResponse;
|
||||
initialPath: string;
|
||||
handlePostRequest: (req: IncomingMessage, res: ServerResponse, handler: (body: unknown) => Promise<any>) => void;
|
||||
broadcastToClients: (data: unknown) => void;
|
||||
}
|
||||
|
||||
// ========== Helper Functions ==========
|
||||
|
||||
function getDiscoveriesDir(projectPath: string): string {
|
||||
return join(projectPath, '.workflow', 'issues', 'discoveries');
|
||||
}
|
||||
|
||||
function readDiscoveryIndex(discoveriesDir: string): { discoveries: any[]; total: number } {
|
||||
const indexPath = join(discoveriesDir, 'index.json');
|
||||
if (!existsSync(indexPath)) {
|
||||
return { discoveries: [], total: 0 };
|
||||
}
|
||||
try {
|
||||
return JSON.parse(readFileSync(indexPath, 'utf8'));
|
||||
} catch {
|
||||
return { discoveries: [], total: 0 };
|
||||
}
|
||||
}
|
||||
|
||||
function writeDiscoveryIndex(discoveriesDir: string, index: any) {
|
||||
if (!existsSync(discoveriesDir)) {
|
||||
mkdirSync(discoveriesDir, { recursive: true });
|
||||
}
|
||||
writeFileSync(join(discoveriesDir, 'index.json'), JSON.stringify(index, null, 2));
|
||||
}
|
||||
|
||||
function readDiscoveryState(discoveriesDir: string, discoveryId: string): any | null {
|
||||
const statePath = join(discoveriesDir, discoveryId, 'discovery-state.json');
|
||||
if (!existsSync(statePath)) return null;
|
||||
try {
|
||||
return JSON.parse(readFileSync(statePath, 'utf8'));
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function readDiscoveryProgress(discoveriesDir: string, discoveryId: string): any | null {
|
||||
const progressPath = join(discoveriesDir, discoveryId, 'discovery-progress.json');
|
||||
if (!existsSync(progressPath)) return null;
|
||||
try {
|
||||
return JSON.parse(readFileSync(progressPath, 'utf8'));
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function readPerspectiveFindings(discoveriesDir: string, discoveryId: string): any[] {
|
||||
const perspectivesDir = join(discoveriesDir, discoveryId, 'perspectives');
|
||||
if (!existsSync(perspectivesDir)) return [];
|
||||
|
||||
const allFindings: any[] = [];
|
||||
const files = readdirSync(perspectivesDir).filter(f => f.endsWith('.json'));
|
||||
|
||||
for (const file of files) {
|
||||
try {
|
||||
const content = JSON.parse(readFileSync(join(perspectivesDir, file), 'utf8'));
|
||||
const perspective = file.replace('.json', '');
|
||||
|
||||
if (content.findings && Array.isArray(content.findings)) {
|
||||
allFindings.push({
|
||||
perspective,
|
||||
summary: content.summary || {},
|
||||
findings: content.findings.map((f: any) => ({
|
||||
...f,
|
||||
perspective: f.perspective || perspective
|
||||
}))
|
||||
});
|
||||
}
|
||||
} catch {
|
||||
// Skip invalid files
|
||||
}
|
||||
}
|
||||
|
||||
return allFindings;
|
||||
}
|
||||
|
||||
function readDiscoveryIssues(discoveriesDir: string, discoveryId: string): any[] {
|
||||
const issuesPath = join(discoveriesDir, discoveryId, 'discovery-issues.jsonl');
|
||||
if (!existsSync(issuesPath)) return [];
|
||||
try {
|
||||
const content = readFileSync(issuesPath, 'utf8');
|
||||
return content.split('\n').filter(line => line.trim()).map(line => JSON.parse(line));
|
||||
} catch {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
function writeDiscoveryIssues(discoveriesDir: string, discoveryId: string, issues: any[]) {
|
||||
const issuesPath = join(discoveriesDir, discoveryId, 'discovery-issues.jsonl');
|
||||
writeFileSync(issuesPath, issues.map(i => JSON.stringify(i)).join('\n'));
|
||||
}
|
||||
|
||||
function flattenFindings(perspectiveResults: any[]): any[] {
|
||||
const allFindings: any[] = [];
|
||||
for (const result of perspectiveResults) {
|
||||
if (result.findings) {
|
||||
allFindings.push(...result.findings);
|
||||
}
|
||||
}
|
||||
return allFindings;
|
||||
}
|
||||
|
||||
function appendToIssuesJsonl(projectPath: string, issues: any[]) {
|
||||
const issuesDir = join(projectPath, '.workflow', 'issues');
|
||||
const issuesPath = join(issuesDir, 'issues.jsonl');
|
||||
|
||||
if (!existsSync(issuesDir)) {
|
||||
mkdirSync(issuesDir, { recursive: true });
|
||||
}
|
||||
|
||||
// Read existing issues
|
||||
let existingIssues: any[] = [];
|
||||
if (existsSync(issuesPath)) {
|
||||
try {
|
||||
const content = readFileSync(issuesPath, 'utf8');
|
||||
existingIssues = content.split('\n').filter(line => line.trim()).map(line => JSON.parse(line));
|
||||
} catch {
|
||||
// Start fresh
|
||||
}
|
||||
}
|
||||
|
||||
// Convert discovery issues to standard format and append
|
||||
const newIssues = issues.map(di => ({
|
||||
id: di.id,
|
||||
title: di.title,
|
||||
status: 'registered',
|
||||
priority: di.priority || 3,
|
||||
context: di.context || di.description || '',
|
||||
source: 'discovery',
|
||||
source_discovery_id: di.source_discovery_id,
|
||||
labels: di.labels || [],
|
||||
created_at: new Date().toISOString(),
|
||||
updated_at: new Date().toISOString()
|
||||
}));
|
||||
|
||||
const allIssues = [...existingIssues, ...newIssues];
|
||||
writeFileSync(issuesPath, allIssues.map(i => JSON.stringify(i)).join('\n'));
|
||||
|
||||
return newIssues.length;
|
||||
}
|
||||
|
||||
// ========== Route Handler ==========
|
||||
|
||||
export async function handleDiscoveryRoutes(ctx: RouteContext): Promise<boolean> {
|
||||
const { pathname, url, req, res, initialPath, handlePostRequest } = ctx;
|
||||
const projectPath = url.searchParams.get('path') || initialPath;
|
||||
const discoveriesDir = getDiscoveriesDir(projectPath);
|
||||
|
||||
// GET /api/discoveries - List all discovery sessions
|
||||
if (pathname === '/api/discoveries' && req.method === 'GET') {
|
||||
const index = readDiscoveryIndex(discoveriesDir);
|
||||
|
||||
// Enrich with state info
|
||||
const enrichedDiscoveries = index.discoveries.map((d: any) => {
|
||||
const state = readDiscoveryState(discoveriesDir, d.discovery_id);
|
||||
const progress = readDiscoveryProgress(discoveriesDir, d.discovery_id);
|
||||
return {
|
||||
...d,
|
||||
phase: state?.phase || 'unknown',
|
||||
total_findings: state?.total_findings || 0,
|
||||
issues_generated: state?.issues_generated || 0,
|
||||
priority_distribution: state?.priority_distribution || {},
|
||||
progress: progress?.progress || null
|
||||
};
|
||||
});
|
||||
|
||||
res.writeHead(200, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({
|
||||
discoveries: enrichedDiscoveries,
|
||||
total: enrichedDiscoveries.length,
|
||||
_metadata: { updated_at: new Date().toISOString() }
|
||||
}));
|
||||
return true;
|
||||
}
|
||||
|
||||
// GET /api/discoveries/:id - Get discovery detail
|
||||
const detailMatch = pathname.match(/^\/api\/discoveries\/([^/]+)$/);
|
||||
if (detailMatch && req.method === 'GET') {
|
||||
const discoveryId = detailMatch[1];
|
||||
const state = readDiscoveryState(discoveriesDir, discoveryId);
|
||||
|
||||
if (!state) {
|
||||
res.writeHead(404, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: `Discovery ${discoveryId} not found` }));
|
||||
return true;
|
||||
}
|
||||
|
||||
const progress = readDiscoveryProgress(discoveriesDir, discoveryId);
|
||||
const perspectiveResults = readPerspectiveFindings(discoveriesDir, discoveryId);
|
||||
const discoveryIssues = readDiscoveryIssues(discoveriesDir, discoveryId);
|
||||
|
||||
// Read external research if exists
|
||||
let externalResearch = null;
|
||||
const externalPath = join(discoveriesDir, discoveryId, 'external-research.json');
|
||||
if (existsSync(externalPath)) {
|
||||
try {
|
||||
externalResearch = JSON.parse(readFileSync(externalPath, 'utf8'));
|
||||
} catch {
|
||||
// Ignore
|
||||
}
|
||||
}
|
||||
|
||||
res.writeHead(200, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({
|
||||
...state,
|
||||
progress: progress?.progress || null,
|
||||
perspectives: perspectiveResults,
|
||||
external_research: externalResearch,
|
||||
discovery_issues: discoveryIssues
|
||||
}));
|
||||
return true;
|
||||
}
|
||||
|
||||
// GET /api/discoveries/:id/findings - Get all findings
|
||||
const findingsMatch = pathname.match(/^\/api\/discoveries\/([^/]+)\/findings$/);
|
||||
if (findingsMatch && req.method === 'GET') {
|
||||
const discoveryId = findingsMatch[1];
|
||||
|
||||
if (!existsSync(join(discoveriesDir, discoveryId))) {
|
||||
res.writeHead(404, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: `Discovery ${discoveryId} not found` }));
|
||||
return true;
|
||||
}
|
||||
|
||||
const perspectiveResults = readPerspectiveFindings(discoveriesDir, discoveryId);
|
||||
const allFindings = flattenFindings(perspectiveResults);
|
||||
|
||||
// Support filtering
|
||||
const perspectiveFilter = url.searchParams.get('perspective');
|
||||
const priorityFilter = url.searchParams.get('priority');
|
||||
|
||||
let filtered = allFindings;
|
||||
if (perspectiveFilter) {
|
||||
filtered = filtered.filter(f => f.perspective === perspectiveFilter);
|
||||
}
|
||||
if (priorityFilter) {
|
||||
filtered = filtered.filter(f => f.priority === priorityFilter);
|
||||
}
|
||||
|
||||
res.writeHead(200, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({
|
||||
findings: filtered,
|
||||
total: filtered.length,
|
||||
perspectives: [...new Set(allFindings.map(f => f.perspective))],
|
||||
_metadata: { discovery_id: discoveryId }
|
||||
}));
|
||||
return true;
|
||||
}
|
||||
|
||||
// GET /api/discoveries/:id/progress - Get real-time progress
|
||||
const progressMatch = pathname.match(/^\/api\/discoveries\/([^/]+)\/progress$/);
|
||||
if (progressMatch && req.method === 'GET') {
|
||||
const discoveryId = progressMatch[1];
|
||||
const progress = readDiscoveryProgress(discoveriesDir, discoveryId);
|
||||
|
||||
if (!progress) {
|
||||
res.writeHead(404, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: `Progress for ${discoveryId} not found` }));
|
||||
return true;
|
||||
}
|
||||
|
||||
res.writeHead(200, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify(progress));
|
||||
return true;
|
||||
}
|
||||
|
||||
// POST /api/discoveries/:id/export - Export findings as issues
|
||||
const exportMatch = pathname.match(/^\/api\/discoveries\/([^/]+)\/export$/);
|
||||
if (exportMatch && req.method === 'POST') {
|
||||
handlePostRequest(req, res, async (body: any) => {
|
||||
const discoveryId = exportMatch[1];
|
||||
const { finding_ids, export_all } = body as { finding_ids?: string[]; export_all?: boolean };
|
||||
|
||||
if (!existsSync(join(discoveriesDir, discoveryId))) {
|
||||
return { error: `Discovery ${discoveryId} not found` };
|
||||
}
|
||||
|
||||
const perspectiveResults = readPerspectiveFindings(discoveriesDir, discoveryId);
|
||||
const allFindings = flattenFindings(perspectiveResults);
|
||||
|
||||
let toExport: any[];
|
||||
if (export_all) {
|
||||
toExport = allFindings;
|
||||
} else if (finding_ids && finding_ids.length > 0) {
|
||||
toExport = allFindings.filter(f => finding_ids.includes(f.id));
|
||||
} else {
|
||||
return { error: 'Either finding_ids or export_all required' };
|
||||
}
|
||||
|
||||
if (toExport.length === 0) {
|
||||
return { error: 'No findings to export' };
|
||||
}
|
||||
|
||||
// Convert findings to issue format
|
||||
const issuesToExport = toExport.map((f, idx) => {
|
||||
const suggestedIssue = f.suggested_issue || {};
|
||||
return {
|
||||
id: `ISS-${Date.now()}-${idx}`,
|
||||
title: suggestedIssue.title || f.title,
|
||||
priority: suggestedIssue.priority || 3,
|
||||
context: f.description || '',
|
||||
source: 'discovery',
|
||||
source_discovery_id: discoveryId,
|
||||
perspective: f.perspective,
|
||||
file: f.file,
|
||||
line: f.line,
|
||||
labels: suggestedIssue.labels || [f.perspective]
|
||||
};
|
||||
});
|
||||
|
||||
// Append to main issues.jsonl
|
||||
const exportedCount = appendToIssuesJsonl(projectPath, issuesToExport);
|
||||
|
||||
// Update discovery state
|
||||
const state = readDiscoveryState(discoveriesDir, discoveryId);
|
||||
if (state) {
|
||||
state.issues_generated = (state.issues_generated || 0) + exportedCount;
|
||||
writeFileSync(
|
||||
join(discoveriesDir, discoveryId, 'discovery-state.json'),
|
||||
JSON.stringify(state, null, 2)
|
||||
);
|
||||
}
|
||||
|
||||
return {
|
||||
success: true,
|
||||
exported_count: exportedCount,
|
||||
issue_ids: issuesToExport.map(i => i.id)
|
||||
};
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
// PATCH /api/discoveries/:id/findings/:fid - Update finding status
|
||||
const updateFindingMatch = pathname.match(/^\/api\/discoveries\/([^/]+)\/findings\/([^/]+)$/);
|
||||
if (updateFindingMatch && req.method === 'PATCH') {
|
||||
handlePostRequest(req, res, async (body: any) => {
|
||||
const [, discoveryId, findingId] = updateFindingMatch;
|
||||
const { status, dismissed } = body as { status?: string; dismissed?: boolean };
|
||||
|
||||
const perspectivesDir = join(discoveriesDir, discoveryId, 'perspectives');
|
||||
if (!existsSync(perspectivesDir)) {
|
||||
return { error: `Discovery ${discoveryId} not found` };
|
||||
}
|
||||
|
||||
// Find and update the finding
|
||||
const files = readdirSync(perspectivesDir).filter(f => f.endsWith('.json'));
|
||||
let updated = false;
|
||||
|
||||
for (const file of files) {
|
||||
const filePath = join(perspectivesDir, file);
|
||||
try {
|
||||
const content = JSON.parse(readFileSync(filePath, 'utf8'));
|
||||
if (content.findings) {
|
||||
const findingIndex = content.findings.findIndex((f: any) => f.id === findingId);
|
||||
if (findingIndex !== -1) {
|
||||
if (status !== undefined) {
|
||||
content.findings[findingIndex].status = status;
|
||||
}
|
||||
if (dismissed !== undefined) {
|
||||
content.findings[findingIndex].dismissed = dismissed;
|
||||
}
|
||||
content.findings[findingIndex].updated_at = new Date().toISOString();
|
||||
writeFileSync(filePath, JSON.stringify(content, null, 2));
|
||||
updated = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} catch {
|
||||
// Skip invalid files
|
||||
}
|
||||
}
|
||||
|
||||
if (!updated) {
|
||||
return { error: `Finding ${findingId} not found` };
|
||||
}
|
||||
|
||||
return { success: true, finding_id: findingId };
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
// DELETE /api/discoveries/:id - Delete discovery session
|
||||
const deleteMatch = pathname.match(/^\/api\/discoveries\/([^/]+)$/);
|
||||
if (deleteMatch && req.method === 'DELETE') {
|
||||
const discoveryId = deleteMatch[1];
|
||||
const discoveryPath = join(discoveriesDir, discoveryId);
|
||||
|
||||
if (!existsSync(discoveryPath)) {
|
||||
res.writeHead(404, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: `Discovery ${discoveryId} not found` }));
|
||||
return true;
|
||||
}
|
||||
|
||||
try {
|
||||
// Remove directory
|
||||
rmSync(discoveryPath, { recursive: true, force: true });
|
||||
|
||||
// Update index
|
||||
const index = readDiscoveryIndex(discoveriesDir);
|
||||
index.discoveries = index.discoveries.filter((d: any) => d.discovery_id !== discoveryId);
|
||||
index.total = index.discoveries.length;
|
||||
writeDiscoveryIndex(discoveriesDir, index);
|
||||
|
||||
res.writeHead(200, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ success: true, deleted: discoveryId }));
|
||||
} catch (err) {
|
||||
res.writeHead(500, { 'Content-Type': 'application/json' });
|
||||
res.end(JSON.stringify({ error: 'Failed to delete discovery' }));
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
// Not handled
|
||||
return false;
|
||||
}
|
||||
@@ -18,6 +18,7 @@ import { handleSystemRoutes } from './routes/system-routes.js';
|
||||
import { handleFilesRoutes } from './routes/files-routes.js';
|
||||
import { handleSkillsRoutes } from './routes/skills-routes.js';
|
||||
import { handleIssueRoutes } from './routes/issue-routes.js';
|
||||
import { handleDiscoveryRoutes } from './routes/discovery-routes.js';
|
||||
import { handleRulesRoutes } from './routes/rules-routes.js';
|
||||
import { handleSessionRoutes } from './routes/session-routes.js';
|
||||
import { handleCcwRoutes } from './routes/ccw-routes.js';
|
||||
@@ -89,7 +90,8 @@ const MODULE_CSS_FILES = [
|
||||
'30-core-memory.css',
|
||||
'31-api-settings.css',
|
||||
'32-issue-manager.css',
|
||||
'33-cli-stream-viewer.css'
|
||||
'33-cli-stream-viewer.css',
|
||||
'34-discovery.css'
|
||||
];
|
||||
|
||||
// Modular JS files in dependency order
|
||||
@@ -147,6 +149,7 @@ const MODULE_FILES = [
|
||||
'views/api-settings.js',
|
||||
'views/help.js',
|
||||
'views/issue-manager.js',
|
||||
'views/issue-discovery.js',
|
||||
'main.js'
|
||||
];
|
||||
|
||||
@@ -355,6 +358,11 @@ export async function startServer(options: ServerOptions = {}): Promise<http.Ser
|
||||
if (await handleIssueRoutes(routeContext)) return;
|
||||
}
|
||||
|
||||
// Discovery routes (/api/discoveries*)
|
||||
if (pathname.startsWith('/api/discoveries')) {
|
||||
if (await handleDiscoveryRoutes(routeContext)) return;
|
||||
}
|
||||
|
||||
// Rules routes (/api/rules*)
|
||||
if (pathname.startsWith('/api/rules')) {
|
||||
if (await handleRulesRoutes(routeContext)) return;
|
||||
|
||||
719
ccw/src/templates/dashboard-css/34-discovery.css
Normal file
719
ccw/src/templates/dashboard-css/34-discovery.css
Normal file
@@ -0,0 +1,719 @@
|
||||
/* ==========================================
|
||||
ISSUE DISCOVERY STYLES
|
||||
========================================== */
|
||||
|
||||
/* Discovery Manager Container */
|
||||
.discovery-manager {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.discovery-manager.loading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 300px;
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
/* Discovery Header */
|
||||
.discovery-header {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.discovery-back-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: hsl(var(--muted-foreground));
|
||||
background: hsl(var(--muted));
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.discovery-back-btn:hover {
|
||||
color: hsl(var(--foreground));
|
||||
background: hsl(var(--hover));
|
||||
}
|
||||
|
||||
/* Discovery List */
|
||||
.discovery-list-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
/* Discovery Card */
|
||||
.discovery-card {
|
||||
background: hsl(var(--card));
|
||||
border: 1px solid hsl(var(--border));
|
||||
border-radius: 0.75rem;
|
||||
padding: 1rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.discovery-card:hover {
|
||||
border-color: hsl(var(--primary) / 0.5);
|
||||
box-shadow: 0 4px 12px hsl(var(--foreground) / 0.05);
|
||||
}
|
||||
|
||||
.discovery-card.running {
|
||||
border-color: hsl(var(--warning) / 0.5);
|
||||
}
|
||||
|
||||
.discovery-card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.discovery-id {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: hsl(var(--foreground));
|
||||
}
|
||||
|
||||
.discovery-phase {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.discovery-phase.complete {
|
||||
background: hsl(var(--success) / 0.1);
|
||||
color: hsl(var(--success));
|
||||
}
|
||||
|
||||
.discovery-phase.parallel,
|
||||
.discovery-phase.external,
|
||||
.discovery-phase.aggregation {
|
||||
background: hsl(var(--warning) / 0.1);
|
||||
color: hsl(var(--warning));
|
||||
}
|
||||
|
||||
.discovery-phase.initialization {
|
||||
background: hsl(var(--primary) / 0.1);
|
||||
color: hsl(var(--primary));
|
||||
}
|
||||
|
||||
.discovery-card-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
}
|
||||
|
||||
.discovery-target {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* Perspective Badges */
|
||||
.discovery-perspectives {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.375rem;
|
||||
}
|
||||
|
||||
.perspective-badge {
|
||||
padding: 0.125rem 0.5rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.025em;
|
||||
}
|
||||
|
||||
.perspective-badge.bug {
|
||||
background: hsl(0 84% 60% / 0.1);
|
||||
color: hsl(0 84% 60%);
|
||||
}
|
||||
|
||||
.perspective-badge.ux {
|
||||
background: hsl(262 84% 60% / 0.1);
|
||||
color: hsl(262 84% 60%);
|
||||
}
|
||||
|
||||
.perspective-badge.test {
|
||||
background: hsl(200 84% 50% / 0.1);
|
||||
color: hsl(200 84% 50%);
|
||||
}
|
||||
|
||||
.perspective-badge.quality {
|
||||
background: hsl(142 76% 36% / 0.1);
|
||||
color: hsl(142 76% 36%);
|
||||
}
|
||||
|
||||
.perspective-badge.security {
|
||||
background: hsl(0 84% 50% / 0.1);
|
||||
color: hsl(0 84% 50%);
|
||||
}
|
||||
|
||||
.perspective-badge.performance {
|
||||
background: hsl(38 92% 50% / 0.1);
|
||||
color: hsl(38 92% 50%);
|
||||
}
|
||||
|
||||
.perspective-badge.maintainability {
|
||||
background: hsl(280 60% 50% / 0.1);
|
||||
color: hsl(280 60% 50%);
|
||||
}
|
||||
|
||||
.perspective-badge.best-practices {
|
||||
background: hsl(170 60% 45% / 0.1);
|
||||
color: hsl(170 60% 45%);
|
||||
}
|
||||
|
||||
.perspective-badge.more {
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
/* Progress Bar */
|
||||
.discovery-progress-bar {
|
||||
height: 4px;
|
||||
background: hsl(var(--muted));
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.discovery-progress-bar .progress-fill {
|
||||
height: 100%;
|
||||
background: hsl(var(--primary));
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
/* Stats */
|
||||
.discovery-stats {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
|
||||
.discovery-stats .stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.discovery-stats .stat-value {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 700;
|
||||
color: hsl(var(--foreground));
|
||||
}
|
||||
|
||||
.discovery-stats .stat-label {
|
||||
font-size: 0.75rem;
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
/* Priority Distribution Bar */
|
||||
.discovery-priority-bar {
|
||||
display: flex;
|
||||
height: 4px;
|
||||
border-radius: 2px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.discovery-priority-bar .priority-segment {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.discovery-priority-bar .priority-segment.critical {
|
||||
background: hsl(0 84% 60%);
|
||||
}
|
||||
|
||||
.discovery-priority-bar .priority-segment.high {
|
||||
background: hsl(38 92% 50%);
|
||||
}
|
||||
|
||||
.discovery-priority-bar .priority-segment.medium {
|
||||
background: hsl(48 96% 53%);
|
||||
}
|
||||
|
||||
.discovery-priority-bar .priority-segment.low {
|
||||
background: hsl(142 76% 36%);
|
||||
}
|
||||
|
||||
.discovery-card-footer {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 0.75rem;
|
||||
padding-top: 0.75rem;
|
||||
border-top: 1px solid hsl(var(--border));
|
||||
}
|
||||
|
||||
.discovery-action-btn {
|
||||
padding: 0.375rem;
|
||||
border-radius: 0.375rem;
|
||||
color: hsl(var(--muted-foreground));
|
||||
background: transparent;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.discovery-action-btn:hover {
|
||||
color: hsl(var(--destructive));
|
||||
background: hsl(var(--destructive) / 0.1);
|
||||
}
|
||||
|
||||
/* Empty State */
|
||||
.discovery-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 300px;
|
||||
text-align: center;
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
.discovery-empty .empty-icon {
|
||||
margin-bottom: 1rem;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/* Discovery Detail Container */
|
||||
.discovery-detail-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 400px;
|
||||
gap: 1.5rem;
|
||||
height: calc(100vh - 200px);
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.discovery-detail-container {
|
||||
grid-template-columns: 1fr;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* Findings Panel */
|
||||
.discovery-findings-panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: hsl(var(--card));
|
||||
border: 1px solid hsl(var(--border));
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.discovery-toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
padding: 0.75rem 1rem;
|
||||
border-bottom: 1px solid hsl(var(--border));
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.toolbar-filters {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.filter-select {
|
||||
padding: 0.375rem 0.75rem;
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
color: hsl(var(--foreground));
|
||||
background: hsl(var(--muted));
|
||||
border: 1px solid hsl(var(--border));
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.toolbar-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.375rem 0.75rem;
|
||||
border-radius: 0.375rem;
|
||||
background: hsl(var(--muted));
|
||||
border: 1px solid hsl(var(--border));
|
||||
flex: 1;
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
.toolbar-search input {
|
||||
flex: 1;
|
||||
background: transparent;
|
||||
border: none;
|
||||
font-size: 0.75rem;
|
||||
color: hsl(var(--foreground));
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.findings-count {
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 0.75rem;
|
||||
color: hsl(var(--muted-foreground));
|
||||
border-bottom: 1px solid hsl(var(--border));
|
||||
}
|
||||
|
||||
.findings-count .selected-count {
|
||||
color: hsl(var(--primary));
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Findings List */
|
||||
.findings-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.findings-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 200px;
|
||||
color: hsl(var(--muted-foreground));
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Finding Item */
|
||||
.finding-item {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.finding-item:hover {
|
||||
background: hsl(var(--muted) / 0.5);
|
||||
}
|
||||
|
||||
.finding-item.active {
|
||||
background: hsl(var(--primary) / 0.1);
|
||||
border: 1px solid hsl(var(--primary) / 0.3);
|
||||
}
|
||||
|
||||
.finding-item.selected {
|
||||
background: hsl(var(--primary) / 0.05);
|
||||
}
|
||||
|
||||
.finding-item.dismissed {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.finding-checkbox {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding-top: 0.125rem;
|
||||
}
|
||||
|
||||
.finding-checkbox input {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.finding-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.finding-header {
|
||||
display: flex;
|
||||
gap: 0.375rem;
|
||||
margin-bottom: 0.375rem;
|
||||
}
|
||||
|
||||
.finding-title {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: hsl(var(--foreground));
|
||||
line-height: 1.3;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.finding-location {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
/* Priority Badge */
|
||||
.priority-badge {
|
||||
padding: 0.125rem 0.375rem;
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.priority-badge.critical {
|
||||
background: hsl(0 84% 60% / 0.1);
|
||||
color: hsl(0 84% 60%);
|
||||
}
|
||||
|
||||
.priority-badge.high {
|
||||
background: hsl(38 92% 50% / 0.1);
|
||||
color: hsl(38 92% 50%);
|
||||
}
|
||||
|
||||
.priority-badge.medium {
|
||||
background: hsl(48 96% 53% / 0.1);
|
||||
color: hsl(48 70% 40%);
|
||||
}
|
||||
|
||||
.priority-badge.low {
|
||||
background: hsl(142 76% 36% / 0.1);
|
||||
color: hsl(142 76% 36%);
|
||||
}
|
||||
|
||||
/* Bulk Actions */
|
||||
.bulk-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
padding: 0.75rem 1rem;
|
||||
border-top: 1px solid hsl(var(--border));
|
||||
background: hsl(var(--muted) / 0.3);
|
||||
}
|
||||
|
||||
.bulk-count {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
color: hsl(var(--foreground));
|
||||
}
|
||||
|
||||
.bulk-action-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.375rem;
|
||||
padding: 0.375rem 0.75rem;
|
||||
border-radius: 0.375rem;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.bulk-action-btn.export {
|
||||
background: hsl(var(--primary));
|
||||
color: hsl(var(--primary-foreground));
|
||||
}
|
||||
|
||||
.bulk-action-btn.export:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.bulk-action-btn.dismiss {
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
.bulk-action-btn.dismiss:hover {
|
||||
background: hsl(var(--destructive) / 0.1);
|
||||
color: hsl(var(--destructive));
|
||||
}
|
||||
|
||||
/* Preview Panel */
|
||||
.discovery-preview-panel {
|
||||
background: hsl(var(--card));
|
||||
border: 1px solid hsl(var(--border));
|
||||
border-radius: 0.75rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.preview-empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
min-height: 300px;
|
||||
color: hsl(var(--muted-foreground));
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Finding Preview */
|
||||
.finding-preview {
|
||||
padding: 1.25rem;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.preview-header {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
.preview-badges {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.confidence-badge {
|
||||
padding: 0.125rem 0.5rem;
|
||||
border-radius: 9999px;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 500;
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
.preview-title {
|
||||
font-size: 1.125rem;
|
||||
font-weight: 600;
|
||||
color: hsl(var(--foreground));
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.preview-section {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.preview-section h4 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: hsl(var(--muted-foreground));
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.preview-location code {
|
||||
padding: 0.25rem 0.5rem;
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.75rem;
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--primary));
|
||||
}
|
||||
|
||||
.preview-snippet {
|
||||
padding: 0.75rem;
|
||||
border-radius: 0.5rem;
|
||||
background: hsl(var(--muted));
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.preview-snippet code {
|
||||
font-size: 0.75rem;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.preview-description,
|
||||
.preview-impact,
|
||||
.preview-recommendation {
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.5;
|
||||
color: hsl(var(--foreground));
|
||||
}
|
||||
|
||||
/* Suggested Issue */
|
||||
.preview-section.suggested-issue {
|
||||
padding: 0.75rem;
|
||||
background: hsl(var(--primary) / 0.05);
|
||||
border: 1px solid hsl(var(--primary) / 0.2);
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.suggested-issue-content {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
.suggested-issue-content .issue-title {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
color: hsl(var(--foreground));
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.suggested-issue-content .issue-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.375rem;
|
||||
}
|
||||
|
||||
.issue-type,
|
||||
.issue-priority,
|
||||
.issue-label {
|
||||
padding: 0.125rem 0.5rem;
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.625rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.issue-type {
|
||||
background: hsl(var(--primary) / 0.1);
|
||||
color: hsl(var(--primary));
|
||||
}
|
||||
|
||||
.issue-priority {
|
||||
background: hsl(var(--warning) / 0.1);
|
||||
color: hsl(var(--warning));
|
||||
}
|
||||
|
||||
.issue-label {
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
/* Preview Actions */
|
||||
.preview-actions {
|
||||
display: flex;
|
||||
gap: 0.75rem;
|
||||
margin-top: 1.5rem;
|
||||
padding-top: 1rem;
|
||||
border-top: 1px solid hsl(var(--border));
|
||||
}
|
||||
|
||||
.preview-action-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.preview-action-btn.primary {
|
||||
background: hsl(var(--primary));
|
||||
color: hsl(var(--primary-foreground));
|
||||
}
|
||||
|
||||
.preview-action-btn.primary:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.preview-action-btn.secondary {
|
||||
background: hsl(var(--muted));
|
||||
color: hsl(var(--muted-foreground));
|
||||
}
|
||||
|
||||
.preview-action-btn.secondary:hover {
|
||||
color: hsl(var(--destructive));
|
||||
background: hsl(var(--destructive) / 0.1);
|
||||
}
|
||||
@@ -161,6 +161,12 @@ function initNavigation() {
|
||||
} else {
|
||||
console.error('renderIssueManager not defined - please refresh the page');
|
||||
}
|
||||
} else if (currentView === 'issue-discovery') {
|
||||
if (typeof renderIssueDiscovery === 'function') {
|
||||
renderIssueDiscovery();
|
||||
} else {
|
||||
console.error('renderIssueDiscovery not defined - please refresh the page');
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
@@ -207,6 +213,8 @@ function updateContentTitle() {
|
||||
titleEl.textContent = t('title.apiSettings');
|
||||
} else if (currentView === 'issue-manager') {
|
||||
titleEl.textContent = t('title.issueManager');
|
||||
} else if (currentView === 'issue-discovery') {
|
||||
titleEl.textContent = t('title.issueDiscovery');
|
||||
} else if (currentView === 'liteTasks') {
|
||||
const names = { 'lite-plan': t('title.litePlanSessions'), 'lite-fix': t('title.liteFixSessions') };
|
||||
titleEl.textContent = names[currentLiteType] || t('title.liteTasks');
|
||||
|
||||
@@ -1726,7 +1726,62 @@ const i18n = {
|
||||
// Issue Manager
|
||||
'nav.issues': 'Issues',
|
||||
'nav.issueManager': 'Manager',
|
||||
'nav.issueDiscovery': 'Discovery',
|
||||
'title.issueManager': 'Issue Manager',
|
||||
'title.issueDiscovery': 'Issue Discovery',
|
||||
|
||||
// Issue Discovery
|
||||
'discovery.title': 'Issue Discovery',
|
||||
'discovery.description': 'Discover potential issues from multiple perspectives',
|
||||
'discovery.noSessions': 'No discovery sessions',
|
||||
'discovery.runHint': 'Run /issue:discover to start discovering issues',
|
||||
'discovery.sessions': 'Sessions',
|
||||
'discovery.findings': 'Findings',
|
||||
'discovery.phase': 'Phase',
|
||||
'discovery.perspectives': 'Perspectives',
|
||||
'discovery.progress': 'Progress',
|
||||
'discovery.total': 'Total',
|
||||
'discovery.exported': 'Exported',
|
||||
'discovery.dismissed': 'Dismissed',
|
||||
'discovery.pending': 'Pending',
|
||||
'discovery.external': 'External Research',
|
||||
'discovery.selectAll': 'Select All',
|
||||
'discovery.deselectAll': 'Deselect All',
|
||||
'discovery.exportSelected': 'Export Selected',
|
||||
'discovery.dismissSelected': 'Dismiss Selected',
|
||||
'discovery.exportAsIssue': 'Export as Issue',
|
||||
'discovery.dismiss': 'Dismiss',
|
||||
'discovery.keep': 'Keep',
|
||||
'discovery.priority.critical': 'Critical',
|
||||
'discovery.priority.high': 'High',
|
||||
'discovery.priority.medium': 'Medium',
|
||||
'discovery.priority.low': 'Low',
|
||||
'discovery.perspective.bug': 'Bug',
|
||||
'discovery.perspective.ux': 'UX',
|
||||
'discovery.perspective.test': 'Test',
|
||||
'discovery.perspective.quality': 'Quality',
|
||||
'discovery.perspective.security': 'Security',
|
||||
'discovery.perspective.performance': 'Performance',
|
||||
'discovery.perspective.maintainability': 'Maintainability',
|
||||
'discovery.perspective.best-practices': 'Best Practices',
|
||||
'discovery.file': 'File',
|
||||
'discovery.line': 'Line',
|
||||
'discovery.confidence': 'Confidence',
|
||||
'discovery.suggestedIssue': 'Suggested Issue',
|
||||
'discovery.externalRef': 'External Reference',
|
||||
'discovery.noFindings': 'No findings in this session',
|
||||
'discovery.filterPerspective': 'Filter by Perspective',
|
||||
'discovery.filterPriority': 'Filter by Priority',
|
||||
'discovery.filterAll': 'All',
|
||||
'discovery.deleteSession': 'Delete Session',
|
||||
'discovery.confirmDelete': 'Are you sure you want to delete this discovery session?',
|
||||
'discovery.deleted': 'Discovery session deleted',
|
||||
'discovery.exportSuccess': 'Findings exported as issues',
|
||||
'discovery.dismissSuccess': 'Findings dismissed',
|
||||
'discovery.backToList': 'Back to Sessions',
|
||||
'discovery.viewDetails': 'View Details',
|
||||
'discovery.inProgress': 'In Progress',
|
||||
'discovery.completed': 'Completed',
|
||||
// issues.* keys (used by issue-manager.js)
|
||||
'issues.title': 'Issue Manager',
|
||||
'issues.description': 'Manage issues, solutions, and execution queue',
|
||||
@@ -3586,7 +3641,62 @@ const i18n = {
|
||||
// Issue Manager
|
||||
'nav.issues': '议题',
|
||||
'nav.issueManager': '管理器',
|
||||
'nav.issueDiscovery': '发现',
|
||||
'title.issueManager': '议题管理器',
|
||||
'title.issueDiscovery': '议题发现',
|
||||
|
||||
// Issue Discovery
|
||||
'discovery.title': '议题发现',
|
||||
'discovery.description': '从多个视角发现潜在问题',
|
||||
'discovery.noSessions': '暂无发现会话',
|
||||
'discovery.runHint': '运行 /issue:discover 开始发现问题',
|
||||
'discovery.sessions': '会话',
|
||||
'discovery.findings': '发现',
|
||||
'discovery.phase': '阶段',
|
||||
'discovery.perspectives': '视角',
|
||||
'discovery.progress': '进度',
|
||||
'discovery.total': '总计',
|
||||
'discovery.exported': '已导出',
|
||||
'discovery.dismissed': '已忽略',
|
||||
'discovery.pending': '待处理',
|
||||
'discovery.external': '外部研究',
|
||||
'discovery.selectAll': '全选',
|
||||
'discovery.deselectAll': '取消全选',
|
||||
'discovery.exportSelected': '导出选中',
|
||||
'discovery.dismissSelected': '忽略选中',
|
||||
'discovery.exportAsIssue': '导出为议题',
|
||||
'discovery.dismiss': '忽略',
|
||||
'discovery.keep': '保留',
|
||||
'discovery.priority.critical': '紧急',
|
||||
'discovery.priority.high': '高',
|
||||
'discovery.priority.medium': '中',
|
||||
'discovery.priority.low': '低',
|
||||
'discovery.perspective.bug': 'Bug',
|
||||
'discovery.perspective.ux': '用户体验',
|
||||
'discovery.perspective.test': '测试',
|
||||
'discovery.perspective.quality': '代码质量',
|
||||
'discovery.perspective.security': '安全',
|
||||
'discovery.perspective.performance': '性能',
|
||||
'discovery.perspective.maintainability': '可维护性',
|
||||
'discovery.perspective.best-practices': '最佳实践',
|
||||
'discovery.file': '文件',
|
||||
'discovery.line': '行号',
|
||||
'discovery.confidence': '置信度',
|
||||
'discovery.suggestedIssue': '建议议题',
|
||||
'discovery.externalRef': '外部参考',
|
||||
'discovery.noFindings': '此会话暂无发现',
|
||||
'discovery.filterPerspective': '按视角筛选',
|
||||
'discovery.filterPriority': '按优先级筛选',
|
||||
'discovery.filterAll': '全部',
|
||||
'discovery.deleteSession': '删除会话',
|
||||
'discovery.confirmDelete': '确定要删除此发现会话吗？',
|
||||
'discovery.deleted': '发现会话已删除',
|
||||
'discovery.exportSuccess': '发现已导出为议题',
|
||||
'discovery.dismissSuccess': '发现已忽略',
|
||||
'discovery.backToList': '返回列表',
|
||||
'discovery.viewDetails': '查看详情',
|
||||
'discovery.inProgress': '进行中',
|
||||
'discovery.completed': '已完成',
|
||||
// issues.* keys (used by issue-manager.js)
|
||||
'issues.title': '议题管理器',
|
||||
'issues.description': '管理议题、解决方案和执行队列',
|
||||
|
||||
685
ccw/src/templates/dashboard-js/views/issue-discovery.js
Normal file
685
ccw/src/templates/dashboard-js/views/issue-discovery.js
Normal file
@@ -0,0 +1,685 @@
|
||||
// ==========================================
|
||||
// ISSUE DISCOVERY VIEW
|
||||
// Manages discovery sessions and findings
|
||||
// ==========================================
|
||||
|
||||
// ========== Discovery State ==========
|
||||
var discoveryData = {
|
||||
discoveries: [],
|
||||
selectedDiscovery: null,
|
||||
selectedFinding: null,
|
||||
findings: [],
|
||||
perspectiveFilter: 'all',
|
||||
priorityFilter: 'all',
|
||||
searchQuery: '',
|
||||
selectedFindings: new Set(),
|
||||
viewMode: 'list' // 'list' | 'detail'
|
||||
};
|
||||
var discoveryLoading = false;
|
||||
var discoveryPollingInterval = null;
|
||||
|
||||
// ========== Main Render Function ==========
|
||||
async function renderIssueDiscovery() {
|
||||
const container = document.getElementById('mainContent');
|
||||
if (!container) return;
|
||||
|
||||
// Hide stats grid and carousel
|
||||
hideStatsAndCarousel();
|
||||
|
||||
// Show loading state
|
||||
container.innerHTML = '<div class="discovery-manager loading">' +
|
||||
'<div class="loading-spinner"><i data-lucide="loader-2" class="w-8 h-8 animate-spin"></i></div>' +
|
||||
'<p>' + t('common.loading') + '</p>' +
|
||||
'</div>';
|
||||
lucide.createIcons();
|
||||
|
||||
// Load data
|
||||
await loadDiscoveryData();
|
||||
|
||||
// Render the main view
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
// ========== Data Loading ==========
|
||||
async function loadDiscoveryData() {
|
||||
discoveryLoading = true;
|
||||
try {
|
||||
const response = await fetch('/api/discoveries?path=' + encodeURIComponent(projectPath));
|
||||
if (!response.ok) throw new Error('Failed to load discoveries');
|
||||
const data = await response.json();
|
||||
discoveryData.discoveries = data.discoveries || [];
|
||||
updateDiscoveryBadge();
|
||||
} catch (err) {
|
||||
console.error('Failed to load discoveries:', err);
|
||||
discoveryData.discoveries = [];
|
||||
} finally {
|
||||
discoveryLoading = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function loadDiscoveryDetail(discoveryId) {
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '?path=' + encodeURIComponent(projectPath));
|
||||
if (!response.ok) throw new Error('Failed to load discovery detail');
|
||||
return await response.json();
|
||||
} catch (err) {
|
||||
console.error('Failed to load discovery detail:', err);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
async function loadDiscoveryFindings(discoveryId) {
|
||||
try {
|
||||
let url = '/api/discoveries/' + encodeURIComponent(discoveryId) + '/findings?path=' + encodeURIComponent(projectPath);
|
||||
if (discoveryData.perspectiveFilter !== 'all') {
|
||||
url += '&perspective=' + encodeURIComponent(discoveryData.perspectiveFilter);
|
||||
}
|
||||
if (discoveryData.priorityFilter !== 'all') {
|
||||
url += '&priority=' + encodeURIComponent(discoveryData.priorityFilter);
|
||||
}
|
||||
const response = await fetch(url);
|
||||
if (!response.ok) throw new Error('Failed to load findings');
|
||||
const data = await response.json();
|
||||
return data.findings || [];
|
||||
} catch (err) {
|
||||
console.error('Failed to load findings:', err);
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
async function loadDiscoveryProgress(discoveryId) {
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '/progress?path=' + encodeURIComponent(projectPath));
|
||||
if (!response.ok) return null;
|
||||
return await response.json();
|
||||
} catch (err) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function updateDiscoveryBadge() {
|
||||
const badge = document.getElementById('badgeDiscovery');
|
||||
if (badge) {
|
||||
badge.textContent = discoveryData.discoveries.length;
|
||||
}
|
||||
}
|
||||
|
||||
// ========== Main View Render ==========
|
||||
function renderDiscoveryView() {
|
||||
const container = document.getElementById('mainContent');
|
||||
if (!container) return;
|
||||
|
||||
container.innerHTML = `
|
||||
<div class="discovery-manager">
|
||||
<!-- Header -->
|
||||
<div class="discovery-header mb-6">
|
||||
<div class="flex items-center justify-between flex-wrap gap-4">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center">
|
||||
<i data-lucide="search-code" class="w-5 h-5 text-primary"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-semibold text-foreground">${t('discovery.title') || 'Issue Discovery'}</h2>
|
||||
<p class="text-sm text-muted-foreground">${t('discovery.description') || 'Discover potential issues from multiple perspectives'}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
${discoveryData.viewMode === 'detail' ? `
|
||||
<button class="discovery-back-btn" onclick="backToDiscoveryList()">
|
||||
<i data-lucide="arrow-left" class="w-4 h-4"></i>
|
||||
<span>${t('common.back') || 'Back'}</span>
|
||||
</button>
|
||||
` : ''}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
${discoveryData.viewMode === 'list' ? renderDiscoveryListSection() : renderDiscoveryDetailSection()}
|
||||
</div>
|
||||
`;
|
||||
|
||||
lucide.createIcons();
|
||||
}
|
||||
|
||||
// ========== Discovery List Section ==========
|
||||
function renderDiscoveryListSection() {
|
||||
const discoveries = discoveryData.discoveries || [];
|
||||
|
||||
if (discoveries.length === 0) {
|
||||
return `
|
||||
<div class="discovery-empty">
|
||||
<div class="empty-icon">
|
||||
<i data-lucide="search-x" class="w-12 h-12 text-muted-foreground"></i>
|
||||
</div>
|
||||
<h3 class="text-lg font-medium text-foreground mt-4">${t('discovery.noDiscoveries') || 'No discoveries yet'}</h3>
|
||||
<p class="text-sm text-muted-foreground mt-2">${t('discovery.runCommand') || 'Run /issue:discover to start discovering issues'}</p>
|
||||
<div class="mt-4 p-3 bg-muted/50 rounded-lg">
|
||||
<code class="text-sm text-primary">/issue:discover src/auth/**</code>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
return `
|
||||
<div class="discovery-list-container">
|
||||
${discoveries.map(d => renderDiscoveryCard(d)).join('')}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function renderDiscoveryCard(discovery) {
|
||||
const { discovery_id, target_pattern, perspectives, phase, total_findings, issues_generated, priority_distribution, progress } = discovery;
|
||||
|
||||
const isComplete = phase === 'complete';
|
||||
const isRunning = phase && phase !== 'complete' && phase !== 'failed';
|
||||
|
||||
// Calculate progress percentage
|
||||
let progressPercent = 0;
|
||||
if (progress && progress.perspective_analysis) {
|
||||
progressPercent = progress.perspective_analysis.percent_complete || 0;
|
||||
} else if (isComplete) {
|
||||
progressPercent = 100;
|
||||
}
|
||||
|
||||
// Priority distribution bar
|
||||
const critical = priority_distribution?.critical || 0;
|
||||
const high = priority_distribution?.high || 0;
|
||||
const medium = priority_distribution?.medium || 0;
|
||||
const low = priority_distribution?.low || 0;
|
||||
const total = critical + high + medium + low || 1;
|
||||
|
||||
return `
|
||||
<div class="discovery-card ${isComplete ? 'complete' : ''} ${isRunning ? 'running' : ''}" onclick="viewDiscoveryDetail('${discovery_id}')">
|
||||
<div class="discovery-card-header">
|
||||
<div class="discovery-id">
|
||||
<i data-lucide="search" class="w-4 h-4"></i>
|
||||
<span>${discovery_id}</span>
|
||||
</div>
|
||||
<span class="discovery-phase ${phase}">${phase || 'unknown'}</span>
|
||||
</div>
|
||||
|
||||
<div class="discovery-card-body">
|
||||
<div class="discovery-target">
|
||||
<i data-lucide="folder" class="w-4 h-4 text-muted-foreground"></i>
|
||||
<span class="text-sm text-foreground">${target_pattern || 'N/A'}</span>
|
||||
</div>
|
||||
|
||||
${perspectives && perspectives.length > 0 ? `
|
||||
<div class="discovery-perspectives">
|
||||
${perspectives.slice(0, 5).map(p => `<span class="perspective-badge ${p}">${p}</span>`).join('')}
|
||||
${perspectives.length > 5 ? `<span class="perspective-badge more">+${perspectives.length - 5}</span>` : ''}
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
${isRunning ? `
|
||||
<div class="discovery-progress-bar">
|
||||
<div class="progress-fill" style="width: ${progressPercent}%"></div>
|
||||
</div>
|
||||
<div class="text-xs text-muted-foreground mt-1">${progressPercent}% complete</div>
|
||||
` : ''}
|
||||
|
||||
<div class="discovery-stats">
|
||||
<div class="stat">
|
||||
<span class="stat-value">${total_findings || 0}</span>
|
||||
<span class="stat-label">${t('discovery.findings') || 'Findings'}</span>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<span class="stat-value">${issues_generated || 0}</span>
|
||||
<span class="stat-label">${t('discovery.exported') || 'Exported'}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
${total_findings > 0 ? `
|
||||
<div class="discovery-priority-bar">
|
||||
<div class="priority-segment critical" style="width: ${(critical / total) * 100}%" title="Critical: ${critical}"></div>
|
||||
<div class="priority-segment high" style="width: ${(high / total) * 100}%" title="High: ${high}"></div>
|
||||
<div class="priority-segment medium" style="width: ${(medium / total) * 100}%" title="Medium: ${medium}"></div>
|
||||
<div class="priority-segment low" style="width: ${(low / total) * 100}%" title="Low: ${low}"></div>
|
||||
</div>
|
||||
` : ''}
|
||||
</div>
|
||||
|
||||
<div class="discovery-card-footer">
|
||||
<button class="discovery-action-btn" onclick="event.stopPropagation(); deleteDiscovery('${discovery_id}')">
|
||||
<i data-lucide="trash-2" class="w-4 h-4"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
// ========== Discovery Detail Section ==========
|
||||
function renderDiscoveryDetailSection() {
|
||||
const discovery = discoveryData.selectedDiscovery;
|
||||
if (!discovery) {
|
||||
return '<div class="loading-spinner"><i data-lucide="loader-2" class="w-8 h-8 animate-spin"></i></div>';
|
||||
}
|
||||
|
||||
const findings = discoveryData.findings || [];
|
||||
const perspectives = [...new Set(findings.map(f => f.perspective))];
|
||||
|
||||
// Filter findings
|
||||
let filteredFindings = findings;
|
||||
if (discoveryData.perspectiveFilter !== 'all') {
|
||||
filteredFindings = filteredFindings.filter(f => f.perspective === discoveryData.perspectiveFilter);
|
||||
}
|
||||
if (discoveryData.priorityFilter !== 'all') {
|
||||
filteredFindings = filteredFindings.filter(f => f.priority === discoveryData.priorityFilter);
|
||||
}
|
||||
if (discoveryData.searchQuery) {
|
||||
const q = discoveryData.searchQuery.toLowerCase();
|
||||
filteredFindings = filteredFindings.filter(f =>
|
||||
(f.title && f.title.toLowerCase().includes(q)) ||
|
||||
(f.file && f.file.toLowerCase().includes(q)) ||
|
||||
(f.description && f.description.toLowerCase().includes(q))
|
||||
);
|
||||
}
|
||||
|
||||
return `
|
||||
<div class="discovery-detail-container">
|
||||
<!-- Left Panel: Findings List -->
|
||||
<div class="discovery-findings-panel">
|
||||
<!-- Toolbar -->
|
||||
<div class="discovery-toolbar">
|
||||
<div class="toolbar-filters">
|
||||
<select class="filter-select" onchange="filterDiscoveryByPerspective(this.value)">
|
||||
<option value="all" ${discoveryData.perspectiveFilter === 'all' ? 'selected' : ''}>${t('discovery.allPerspectives') || 'All Perspectives'}</option>
|
||||
${perspectives.map(p => `<option value="${p}" ${discoveryData.perspectiveFilter === p ? 'selected' : ''}>${p}</option>`).join('')}
|
||||
</select>
|
||||
<select class="filter-select" onchange="filterDiscoveryByPriority(this.value)">
|
||||
<option value="all" ${discoveryData.priorityFilter === 'all' ? 'selected' : ''}>${t('discovery.allPriorities') || 'All Priorities'}</option>
|
||||
<option value="critical" ${discoveryData.priorityFilter === 'critical' ? 'selected' : ''}>Critical</option>
|
||||
<option value="high" ${discoveryData.priorityFilter === 'high' ? 'selected' : ''}>High</option>
|
||||
<option value="medium" ${discoveryData.priorityFilter === 'medium' ? 'selected' : ''}>Medium</option>
|
||||
<option value="low" ${discoveryData.priorityFilter === 'low' ? 'selected' : ''}>Low</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="toolbar-search">
|
||||
<i data-lucide="search" class="w-4 h-4"></i>
|
||||
<input type="text" placeholder="${t('common.search') || 'Search...'}"
|
||||
value="${discoveryData.searchQuery}"
|
||||
oninput="searchDiscoveryFindings(this.value)">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Findings Count -->
|
||||
<div class="findings-count">
|
||||
<span>${filteredFindings.length} ${t('discovery.findings') || 'findings'}</span>
|
||||
${discoveryData.selectedFindings.size > 0 ? `
|
||||
<span class="selected-count">(${discoveryData.selectedFindings.size} selected)</span>
|
||||
` : ''}
|
||||
</div>
|
||||
|
||||
<!-- Findings List -->
|
||||
<div class="findings-list">
|
||||
${filteredFindings.length === 0 ? `
|
||||
<div class="findings-empty">
|
||||
<i data-lucide="inbox" class="w-8 h-8 text-muted-foreground"></i>
|
||||
<p>${t('discovery.noFindings') || 'No findings match your filters'}</p>
|
||||
</div>
|
||||
` : filteredFindings.map(f => renderFindingItem(f)).join('')}
|
||||
</div>
|
||||
|
||||
<!-- Bulk Actions -->
|
||||
${discoveryData.selectedFindings.size > 0 ? `
|
||||
<div class="bulk-actions">
|
||||
<span class="bulk-count">${discoveryData.selectedFindings.size} selected</span>
|
||||
<button class="bulk-action-btn export" onclick="exportSelectedFindings()">
|
||||
<i data-lucide="upload" class="w-4 h-4"></i>
|
||||
<span>${t('discovery.exportAsIssues') || 'Export as Issues'}</span>
|
||||
</button>
|
||||
<button class="bulk-action-btn dismiss" onclick="dismissSelectedFindings()">
|
||||
<i data-lucide="x" class="w-4 h-4"></i>
|
||||
<span>${t('discovery.dismiss') || 'Dismiss'}</span>
|
||||
</button>
|
||||
</div>
|
||||
` : ''}
|
||||
</div>
|
||||
|
||||
<!-- Right Panel: Finding Preview -->
|
||||
<div class="discovery-preview-panel">
|
||||
${discoveryData.selectedFinding ? renderFindingPreview(discoveryData.selectedFinding) : `
|
||||
<div class="preview-empty">
|
||||
<i data-lucide="mouse-pointer-click" class="w-12 h-12 text-muted-foreground"></i>
|
||||
<p>${t('discovery.selectFinding') || 'Select a finding to preview'}</p>
|
||||
</div>
|
||||
`}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function renderFindingItem(finding) {
|
||||
const isSelected = discoveryData.selectedFindings.has(finding.id);
|
||||
const isActive = discoveryData.selectedFinding?.id === finding.id;
|
||||
|
||||
return `
|
||||
<div class="finding-item ${isActive ? 'active' : ''} ${isSelected ? 'selected' : ''} ${finding.dismissed ? 'dismissed' : ''}"
|
||||
onclick="selectFinding('${finding.id}')">
|
||||
<div class="finding-checkbox" onclick="event.stopPropagation(); toggleFindingSelection('${finding.id}')">
|
||||
<input type="checkbox" ${isSelected ? 'checked' : ''}>
|
||||
</div>
|
||||
<div class="finding-content">
|
||||
<div class="finding-header">
|
||||
<span class="perspective-badge ${finding.perspective}">${finding.perspective}</span>
|
||||
<span class="priority-badge ${finding.priority}">${finding.priority}</span>
|
||||
</div>
|
||||
<div class="finding-title">${finding.title || 'Untitled'}</div>
|
||||
<div class="finding-location">
|
||||
<i data-lucide="file" class="w-3 h-3"></i>
|
||||
<span>${finding.file || 'Unknown'}${finding.line ? ':' + finding.line : ''}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
function renderFindingPreview(finding) {
|
||||
return `
|
||||
<div class="finding-preview">
|
||||
<div class="preview-header">
|
||||
<div class="preview-badges">
|
||||
<span class="perspective-badge ${finding.perspective}">${finding.perspective}</span>
|
||||
<span class="priority-badge ${finding.priority}">${finding.priority}</span>
|
||||
${finding.confidence ? `<span class="confidence-badge">${Math.round(finding.confidence * 100)}% confidence</span>` : ''}
|
||||
</div>
|
||||
<h3 class="preview-title">${finding.title || 'Untitled'}</h3>
|
||||
</div>
|
||||
|
||||
<div class="preview-section">
|
||||
<h4><i data-lucide="file-code" class="w-4 h-4"></i> ${t('discovery.location') || 'Location'}</h4>
|
||||
<div class="preview-location">
|
||||
<code>${finding.file || 'Unknown'}${finding.line ? ':' + finding.line : ''}</code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
${finding.snippet ? `
|
||||
<div class="preview-section">
|
||||
<h4><i data-lucide="code" class="w-4 h-4"></i> ${t('discovery.code') || 'Code'}</h4>
|
||||
<pre class="preview-snippet"><code>${escapeHtml(finding.snippet)}</code></pre>
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
<div class="preview-section">
|
||||
<h4><i data-lucide="info" class="w-4 h-4"></i> ${t('discovery.description') || 'Description'}</h4>
|
||||
<p class="preview-description">${finding.description || 'No description'}</p>
|
||||
</div>
|
||||
|
||||
${finding.impact ? `
|
||||
<div class="preview-section">
|
||||
<h4><i data-lucide="alert-triangle" class="w-4 h-4"></i> ${t('discovery.impact') || 'Impact'}</h4>
|
||||
<p class="preview-impact">${finding.impact}</p>
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
${finding.recommendation ? `
|
||||
<div class="preview-section">
|
||||
<h4><i data-lucide="lightbulb" class="w-4 h-4"></i> ${t('discovery.recommendation') || 'Recommendation'}</h4>
|
||||
<p class="preview-recommendation">${finding.recommendation}</p>
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
${finding.suggested_issue ? `
|
||||
<div class="preview-section suggested-issue">
|
||||
<h4><i data-lucide="clipboard-list" class="w-4 h-4"></i> ${t('discovery.suggestedIssue') || 'Suggested Issue'}</h4>
|
||||
<div class="suggested-issue-content">
|
||||
<div class="issue-title">${finding.suggested_issue.title || finding.title}</div>
|
||||
<div class="issue-meta">
|
||||
<span class="issue-type">${finding.suggested_issue.type || 'bug'}</span>
|
||||
<span class="issue-priority">P${finding.suggested_issue.priority || 3}</span>
|
||||
${finding.suggested_issue.labels ? finding.suggested_issue.labels.map(l => `<span class="issue-label">${l}</span>`).join('') : ''}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
` : ''}
|
||||
|
||||
<div class="preview-actions">
|
||||
<button class="preview-action-btn primary" onclick="exportSingleFinding('${finding.id}')">
|
||||
<i data-lucide="upload" class="w-4 h-4"></i>
|
||||
<span>${t('discovery.exportAsIssue') || 'Export as Issue'}</span>
|
||||
</button>
|
||||
<button class="preview-action-btn secondary" onclick="dismissFinding('${finding.id}')">
|
||||
<i data-lucide="x" class="w-4 h-4"></i>
|
||||
<span>${t('discovery.dismiss') || 'Dismiss'}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
// ========== Actions ==========
|
||||
async function viewDiscoveryDetail(discoveryId) {
|
||||
discoveryData.viewMode = 'detail';
|
||||
discoveryData.selectedFinding = null;
|
||||
discoveryData.selectedFindings.clear();
|
||||
discoveryData.perspectiveFilter = 'all';
|
||||
discoveryData.priorityFilter = 'all';
|
||||
discoveryData.searchQuery = '';
|
||||
|
||||
// Show loading
|
||||
renderDiscoveryView();
|
||||
|
||||
// Load detail
|
||||
const detail = await loadDiscoveryDetail(discoveryId);
|
||||
if (detail) {
|
||||
discoveryData.selectedDiscovery = detail;
|
||||
// Flatten findings from perspectives
|
||||
const allFindings = [];
|
||||
if (detail.perspectives) {
|
||||
for (const p of detail.perspectives) {
|
||||
if (p.findings) {
|
||||
allFindings.push(...p.findings);
|
||||
}
|
||||
}
|
||||
}
|
||||
discoveryData.findings = allFindings;
|
||||
}
|
||||
|
||||
// Start polling if running
|
||||
if (detail && detail.phase && detail.phase !== 'complete' && detail.phase !== 'failed') {
|
||||
startDiscoveryPolling(discoveryId);
|
||||
}
|
||||
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function backToDiscoveryList() {
|
||||
stopDiscoveryPolling();
|
||||
discoveryData.viewMode = 'list';
|
||||
discoveryData.selectedDiscovery = null;
|
||||
discoveryData.selectedFinding = null;
|
||||
discoveryData.findings = [];
|
||||
discoveryData.selectedFindings.clear();
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function selectFinding(findingId) {
|
||||
const finding = discoveryData.findings.find(f => f.id === findingId);
|
||||
discoveryData.selectedFinding = finding || null;
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function toggleFindingSelection(findingId) {
|
||||
if (discoveryData.selectedFindings.has(findingId)) {
|
||||
discoveryData.selectedFindings.delete(findingId);
|
||||
} else {
|
||||
discoveryData.selectedFindings.add(findingId);
|
||||
}
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function filterDiscoveryByPerspective(perspective) {
|
||||
discoveryData.perspectiveFilter = perspective;
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function filterDiscoveryByPriority(priority) {
|
||||
discoveryData.priorityFilter = priority;
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
function searchDiscoveryFindings(query) {
|
||||
discoveryData.searchQuery = query;
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
async function exportSelectedFindings() {
|
||||
if (discoveryData.selectedFindings.size === 0) return;
|
||||
|
||||
const discoveryId = discoveryData.selectedDiscovery?.discovery_id;
|
||||
if (!discoveryId) return;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '/export?path=' + encodeURIComponent(projectPath), {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ finding_ids: Array.from(discoveryData.selectedFindings) })
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
showNotification('success', `Exported ${result.exported_count} issues`);
|
||||
discoveryData.selectedFindings.clear();
|
||||
// Reload discovery data
|
||||
await loadDiscoveryData();
|
||||
renderDiscoveryView();
|
||||
} else {
|
||||
showNotification('error', result.error || 'Export failed');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Export failed:', err);
|
||||
showNotification('error', 'Export failed');
|
||||
}
|
||||
}
|
||||
|
||||
async function exportSingleFinding(findingId) {
|
||||
const discoveryId = discoveryData.selectedDiscovery?.discovery_id;
|
||||
if (!discoveryId) return;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '/export?path=' + encodeURIComponent(projectPath), {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ finding_ids: [findingId] })
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
showNotification('success', 'Exported 1 issue');
|
||||
// Reload discovery data
|
||||
await loadDiscoveryData();
|
||||
renderDiscoveryView();
|
||||
} else {
|
||||
showNotification('error', result.error || 'Export failed');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Export failed:', err);
|
||||
showNotification('error', 'Export failed');
|
||||
}
|
||||
}
|
||||
|
||||
async function dismissFinding(findingId) {
|
||||
const discoveryId = discoveryData.selectedDiscovery?.discovery_id;
|
||||
if (!discoveryId) return;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '/findings/' + encodeURIComponent(findingId) + '?path=' + encodeURIComponent(projectPath), {
|
||||
method: 'PATCH',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ dismissed: true })
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
// Update local state
|
||||
const finding = discoveryData.findings.find(f => f.id === findingId);
|
||||
if (finding) {
|
||||
finding.dismissed = true;
|
||||
}
|
||||
if (discoveryData.selectedFinding?.id === findingId) {
|
||||
discoveryData.selectedFinding = null;
|
||||
}
|
||||
renderDiscoveryView();
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Dismiss failed:', err);
|
||||
}
|
||||
}
|
||||
|
||||
async function dismissSelectedFindings() {
|
||||
for (const findingId of discoveryData.selectedFindings) {
|
||||
await dismissFinding(findingId);
|
||||
}
|
||||
discoveryData.selectedFindings.clear();
|
||||
renderDiscoveryView();
|
||||
}
|
||||
|
||||
async function deleteDiscovery(discoveryId) {
|
||||
if (!confirm(`Delete discovery ${discoveryId}? This cannot be undone.`)) return;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/discoveries/' + encodeURIComponent(discoveryId) + '?path=' + encodeURIComponent(projectPath), {
|
||||
method: 'DELETE'
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
showNotification('success', 'Discovery deleted');
|
||||
await loadDiscoveryData();
|
||||
renderDiscoveryView();
|
||||
} else {
|
||||
showNotification('error', result.error || 'Delete failed');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Delete failed:', err);
|
||||
showNotification('error', 'Delete failed');
|
||||
}
|
||||
}
|
||||
|
||||
// ========== Progress Polling ==========
|
||||
function startDiscoveryPolling(discoveryId) {
|
||||
stopDiscoveryPolling();
|
||||
|
||||
discoveryPollingInterval = setInterval(async () => {
|
||||
const progress = await loadDiscoveryProgress(discoveryId);
|
||||
if (progress) {
|
||||
// Update progress in UI
|
||||
if (discoveryData.selectedDiscovery) {
|
||||
discoveryData.selectedDiscovery.progress = progress.progress;
|
||||
discoveryData.selectedDiscovery.phase = progress.phase;
|
||||
}
|
||||
|
||||
// Stop polling if complete
|
||||
if (progress.phase === 'complete' || progress.phase === 'failed') {
|
||||
stopDiscoveryPolling();
|
||||
// Reload full detail
|
||||
viewDiscoveryDetail(discoveryId);
|
||||
}
|
||||
}
|
||||
}, 3000); // Poll every 3 seconds
|
||||
}
|
||||
|
||||
function stopDiscoveryPolling() {
|
||||
if (discoveryPollingInterval) {
|
||||
clearInterval(discoveryPollingInterval);
|
||||
discoveryPollingInterval = null;
|
||||
}
|
||||
}
|
||||
|
||||
// ========== Utilities ==========
|
||||
function escapeHtml(text) {
|
||||
const div = document.createElement('div');
|
||||
div.textContent = text;
|
||||
return div.innerHTML;
|
||||
}
|
||||
|
||||
// ========== Cleanup ==========
|
||||
function cleanupDiscoveryView() {
|
||||
stopDiscoveryPolling();
|
||||
discoveryData.selectedDiscovery = null;
|
||||
discoveryData.selectedFinding = null;
|
||||
discoveryData.findings = [];
|
||||
discoveryData.selectedFindings.clear();
|
||||
discoveryData.viewMode = 'list';
|
||||
}
|
||||
@@ -418,6 +418,11 @@
|
||||
<span class="nav-text flex-1" data-i18n="nav.issueManager">Manager</span>
|
||||
<span class="badge px-2 py-0.5 text-xs font-semibold rounded-full bg-hover text-muted-foreground" id="badgeIssues">0</span>
|
||||
</li>
|
||||
<li class="nav-item flex items-center gap-2 px-3 py-2.5 text-sm text-muted-foreground hover:bg-hover hover:text-foreground rounded cursor-pointer transition-colors" data-view="issue-discovery" data-tooltip="Issue Discovery">
|
||||
<i data-lucide="search-code" class="nav-icon"></i>
|
||||
<span class="nav-text flex-1" data-i18n="nav.issueDiscovery">Discovery</span>
|
||||
<span class="badge px-2 py-0.5 text-xs font-semibold rounded-full bg-hover text-muted-foreground" id="badgeDiscovery">0</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user