Overview
ChainProof currently outputs audit results as Markdown, JSON, or a terminal table. While these formats are useful for CI pipelines and developers comfortable with the terminal, they provide a poor experience for security reviewers, project managers, and stakeholders who need to triage and track findings interactively. A web dashboard would unlock significantly broader adoption.
Proposed Feature
A new package @chainproof/dashboard that:
- Spins up a local HTTP server serving a React SPA
- Reads a
chainproof-results.json file (or accepts piped scan output)
- Presents findings in an interactive, filterable UI
UI Components
Findings Table
- Filterable by severity, file, rule ID
- Sortable by line number, severity, file
- Click-to-expand inline code snippet with syntax highlighting
- "Copy fix recommendation" button
Summary Dashboard
- Severity donut chart (critical / high / medium / low / gas)
- Per-file severity heatmap
- Trend chart if multiple scan results are loaded (historical comparison)
Finding Detail Panel
- Full description and recommendation
- SWC registry deep link
- LLM-enhanced explanation rendered as rich text (if present)
- Exploit scenario section (if present)
- Code diff preview showing vulnerable vs fixed snippet
Technical Design
packages/
dashboard/
src/
server.ts # Express server, serves static build + /api/results
index.tsx # React SPA entry point
components/
FindingsTable.tsx
SeverityChart.tsx
FindingDetail.tsx
FileHeatmap.tsx
package.json
CLI Integration
chainproof scan contracts/ --format json --output results.json
chainproof dashboard results.json
# Opens browser to http://localhost:4242
Acceptance Criteria
Overview
ChainProof currently outputs audit results as Markdown, JSON, or a terminal table. While these formats are useful for CI pipelines and developers comfortable with the terminal, they provide a poor experience for security reviewers, project managers, and stakeholders who need to triage and track findings interactively. A web dashboard would unlock significantly broader adoption.
Proposed Feature
A new package
@chainproof/dashboardthat:chainproof-results.jsonfile (or accepts piped scan output)UI Components
Findings Table
Summary Dashboard
Finding Detail Panel
Technical Design
CLI Integration
chainproof scan contracts/ --format json --output results.json chainproof dashboard results.json # Opens browser to http://localhost:4242Acceptance Criteria
packages/dashboardscaffold with Express + React + Vitechainproof dashboard <results.json>CLI subcommandchainproof dashboard --export report.html)