Add System Trends sparkline charts using Recharts + Prometheus
- Add recharts dependency for area chart visualizations - Add /api/metrics route querying Prometheus query_range (CPU, RAM, Network) - Add SystemTrends component with 3 sparkline area charts (6h window, 2min steps) - CPU (emerald), RAM (amber), Network I/O (indigo) with gradient fills - Tooltips show exact values on hover, time axis with formatted labels - Link to Grafana for deep-dive analysis - Fetches every 60s, shimmer loading state Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -13,7 +13,8 @@
|
||||
"@tanstack/react-table": "^8.21.3",
|
||||
"next": "16.1.6",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3"
|
||||
"react-dom": "19.2.3",
|
||||
"recharts": "^3.7.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
|
||||
Reference in New Issue
Block a user