From 00942fd9b198a6f671c15e21974d7b4233252dbf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cau=C3=AA=20Faleiros?= <cauefaleiros@gmail.com>
Date: Wed, 6 May 2026 10:37:45 -0300
Subject: [PATCH] feat: display payload reception timestamp on client details
 page for debugging

---
 backend/index.js            |  3 ++-
 src/pages/ClientDetails.tsx | 10 +++++++++-
 src/types.ts                |  1 +
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/backend/index.js b/backend/index.js
index beba75e..a1046b2 100644
--- a/backend/index.js
+++ b/backend/index.js
@@ -80,7 +80,8 @@ const formatRow = (row) => ({
     ID_Produto: row.produto_id,
     Descricao_Produto: row.produto_descricao,
     Quantidade: row.quantidade,
-    Valor_Unitario: parseFloat(row.valor_unitario)
+    Valor_Unitario: parseFloat(row.valor_unitario),
+    Recebido_Em: row.created_at
 });
 
 // GET data (for the frontend)
diff --git a/src/pages/ClientDetails.tsx b/src/pages/ClientDetails.tsx
index d5c0435..d102d84 100644
--- a/src/pages/ClientDetails.tsx
+++ b/src/pages/ClientDetails.tsx
@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 import { useParams, Link, useOutletContext } from 'react-router-dom';
-import { ArrowLeft, User, Tag, Package, DollarSign } from 'lucide-react';
+import { ArrowLeft, User, Tag, Package, DollarSign, Clock } from 'lucide-react';
 import type { OrderData } from '../types';
 
 const ClientDetails = () => {
@@ -113,6 +113,14 @@ const ClientDetails = () => {
                         <Tag className="w-3 h-3 text-zinc-400 dark:text-dark-muted" />
                         <span className="text-[10px] font-bold text-zinc-400 dark:text-dark-muted">ID: {order.ID_Produto}</span>
                       </div>
+                      {order.Recebido_Em && (
+                        <div className="flex items-center gap-1 ml-2">
+                          <Clock className="w-3 h-3 text-zinc-400 dark:text-dark-muted" />
+                          <span className="text-[10px] font-bold text-zinc-400 dark:text-dark-muted">
+                            Recebido: {new Date(order.Recebido_Em).toLocaleString('pt-BR')}
+                          </span>
+                        </div>
+                      )}
                     </div>
                     <h3 className="text-sm font-bold text-zinc-900 dark:text-dark-text truncate mb-1">{order.Descricao_Produto}</h3>
                     
diff --git a/src/types.ts b/src/types.ts
index 0f9faac..b1eacb0 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -6,6 +6,7 @@ export interface OrderData {
   Descricao_Produto: string;
   Quantidade: number;
   Valor_Unitario: number;
+  Recebido_Em?: string;
 }
 
 export interface DateRange {