Node Operator Dashboard with Real-Time Validator Performance Metrics

[JamesEjembi]

Problem Statement

Node operators need a real-time dashboard showing their validator's performance (attestation effectiveness, block proposals, balance history, network participation). A comprehensive operator dashboard must be built with live WebSocket metrics, historical performance charts, alert configuration, and node health scoring.

Technical Bounds

• Real-time metrics: current epoch, slot, finalized block, validator balance, effectiveness %, queue position.
• Performance charts: balance history (area), attestation effectiveness (bar), proposal timeline (scatter).
• Node health score: composite of attestation effectiveness (40%), proposal timeliness (30%), uptime (20%), peer count (10%).
• Alert thresholds: user-configurable for missed attestations, balance drop, effectiveness decline.
• Data export: CSV export of performance metrics for compliance reporting.

Steps

1. Build OperatorOverview component: balance card, epoch/slot info, health score gauge, effectiveness badge.
2. Build PerformanceCharts with Lightweight Charts: balance history area, attestation effectiveness bar, proposal scatter.
3. Build AlertConfigPanel: threshold sliders for each metric, notification channel (push/email) selector.
4. Build ExportButton: trigger CSV generation from current time range.
5. Implement useOperatorMetrics hook: WebSocket for live, REST for historical, SWR caching.
6. Add time range selector: 24h, 7d, 30d, custom date range.