From 82a42bf9c2db45dced8791906809b99b7ddfe265 Mon Sep 17 00:00:00 2001
From: dwindown <dwinx.ramz@gmail.com>
Date: Fri, 21 Nov 2025 00:46:46 +0700
Subject: [PATCH] fix(customers): Fix orders data mapping in detail page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixed 3 data mapping issues:

1. ✅ Orders Array:
- Backend returns: data.rows
- Was using: data.orders ❌
- Fixed to: data.rows ✅

2. ✅ Date Field:
- Backend returns: order.date
- Was using: order.date_created ❌
- Fixed to: order.date ✅
- Added null check for safety

3. ✅ Items Count:
- Backend returns: order.items_count
- Was using: order.line_items?.length ❌
- Fixed to: order.items_count ✅

Backend Response Structure:
{
  rows: [
    {
      id: 123,
      number: '123',
      date: '2025-11-21T...',
      status: 'completed',
      total: 100000,
      items_count: 3,
      items_brief: 'Product A ×1, Product B ×2',
      ...
    }
  ],
  total: 10,
  page: 1,
  per_page: 100
}

Result: Orders now load and display correctly in customer detail page!
---
 admin-spa/src/routes/Customers/Detail.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/admin-spa/src/routes/Customers/Detail.tsx b/admin-spa/src/routes/Customers/Detail.tsx
index c361bec..37d2d3f 100644
--- a/admin-spa/src/routes/Customers/Detail.tsx
+++ b/admin-spa/src/routes/Customers/Detail.tsx
@@ -34,7 +34,7 @@ export default function CustomerDetail() {
   });
 
   const customer = customerQuery.data;
-  const orders = ordersQuery.data?.orders || [];
+  const orders = ordersQuery.data?.rows || [];
   const { setPageHeader, clearPageHeader } = usePageHeader();
 
   // Page header
@@ -222,13 +222,13 @@ export default function CustomerDetail() {
                           </span>
                         </div>
                         <div className="text-sm text-muted-foreground mt-1">
-                          {new Date(order.date_created).toLocaleDateString('id-ID')}
+                          {order.date ? new Date(order.date).toLocaleDateString('id-ID') : '-'}
                         </div>
                       </div>
                       <div className="text-right">
                         <div className="font-bold">{formatMoney(parseFloat(order.total || '0'))}</div>
                         <div className="text-sm text-muted-foreground">
-                          {order.line_items?.length || 0} {__('items')}
+                          {order.items_count || 0} {__('items')}
                         </div>
                       </div>
                     </div>