fix(web-dashboard): wire P&L chart data from API in PerformanceDashboard

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jgrusewski
2026-02-22 07:33:45 +01:00
parent af2a17a827
commit 066d85d766

View File

@@ -3,6 +3,11 @@ import { MetricCard } from '../components/charts/MetricCard';
import { useApiQuery } from '../hooks/useApi';
import type { PerformanceMetrics } from '../lib/types';
interface PnLPoint {
date: string;
pnl: number;
}
export function PerformanceDashboard() {
const metrics = useApiQuery<PerformanceMetrics>(
['performance-metrics'],
@@ -10,6 +15,12 @@ export function PerformanceDashboard() {
{ refetchInterval: 10000 },
);
const pnlData = useApiQuery<PnLPoint[]>(
['performance-pnl'],
'/performance/pnl',
{ refetchInterval: 30000 },
);
const m = metrics.data;
return (
@@ -43,13 +54,13 @@ export function PerformanceDashboard() {
{/* Middle: P&L Chart */}
<div className="h-64 rounded border border-[var(--color-border)] bg-[var(--color-bg-card)]">
<PnLChart title="Cumulative P&L" />
<PnLChart title="Cumulative P&L" data={pnlData.data} />
</div>
{/* Bottom: Daily returns + Heatmap */}
<div className="grid grid-cols-2 gap-4">
<div className="h-48 rounded border border-[var(--color-border)] bg-[var(--color-bg-card)]">
<PnLChart title="Daily Returns" />
<PnLChart title="Daily Returns" data={pnlData.data} />
</div>
<div className="h-48 rounded border border-[var(--color-border)] bg-[var(--color-bg-card)]">
<div className="px-3 py-1.5 border-b border-[var(--color-border)]">