From 5d9e1f7d06b0cbedcda7d28f6fb55a7e40292132 Mon Sep 17 00:00:00 2001
From: hailin <hailin.zhao@gdzx.xyz>
Date: Fri, 6 Mar 2026 11:34:49 -0800
Subject: [PATCH] fix(dashboard): handle nested API response shapes for trades
 and system-health
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Backend wraps data in extra layer:
  system-health   → {code:0, data:{services:[...]}}
  realtime-trades → {code:0, data:{items:[...], total:N}}

HttpClient strips outer data but leaves inner object.
Fix: type as {services/items} and access nested arrays.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../admin-web/src/views/dashboard/DashboardPage.tsx    | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/admin-web/src/views/dashboard/DashboardPage.tsx b/frontend/admin-web/src/views/dashboard/DashboardPage.tsx
index a3c47a0..4d78ba0 100644
--- a/frontend/admin-web/src/views/dashboard/DashboardPage.tsx
+++ b/frontend/admin-web/src/views/dashboard/DashboardPage.tsx
@@ -46,8 +46,10 @@ const loadingBox: React.CSSProperties = {
 
 export const DashboardPage: React.FC = () => {
   const { data: statsData, isLoading: statsLoading, error: statsError } = useApi<DashboardStats>('/api/v1/admin/dashboard/stats');
-  const { data: tradesData, isLoading: tradesLoading } = useApi<RealtimeTrade[]>('/api/v1/admin/dashboard/realtime-trades');
-  const { data: healthData, isLoading: healthLoading } = useApi<ServiceHealth[]>('/api/v1/admin/dashboard/system-health');
+  const { data: tradesResp, isLoading: tradesLoading } = useApi<{ items: RealtimeTrade[]; total: number }>('/api/v1/admin/dashboard/realtime-trades');
+  const { data: healthResp, isLoading: healthLoading } = useApi<{ services: ServiceHealth[] }>('/api/v1/admin/dashboard/system-health');
+  const tradesData = tradesResp?.items ?? [];
+  const healthData = healthResp?.services ?? [];
 
   const formatNumber = (n: number) => n?.toLocaleString() ?? '-';
   const formatCurrency = (n: number) => `$${n?.toLocaleString() ?? '0'}`;
@@ -185,7 +187,7 @@ export const DashboardPage: React.FC = () => {
                 </tr>
               </thead>
               <tbody>
-                {(tradesData ?? []).map((row, i) => (
+                {tradesData.map((row, i) => (
                   <tr key={i} style={{ borderBottom: '1px solid var(--color-border-light)' }}>
                     <td style={{ font: 'var(--text-body-sm)', color: 'var(--color-text-tertiary)', padding: '10px 12px' }}>{row.time}</td>
                     <td style={{ font: 'var(--text-label-sm)', padding: '10px 12px' }}>{row.type}</td>
@@ -219,7 +221,7 @@ export const DashboardPage: React.FC = () => {
           <div style={{ font: 'var(--text-h3)', marginBottom: 16 }}>{t('dashboard_system_health')}</div>
           {healthLoading ? (
             <div style={loadingBox}>Loading...</div>
-          ) : (healthData ?? []).map(service => (
+          ) : healthData.map(service => (
             <div key={service.name} style={{
               display: 'flex',
               alignItems: 'center',