03.01.26

src/App.jsx

@@ -84,12 +84,12 @@ const pay_posted = params.get("pay_posted");
 const pay_val = params.get("pay_val");
 const eurusd = params.getAll("eurusd").map(Number);
 const eurusd_date = params.getAll("eurusd_date");
-
+const data = eurusd
-const data = eurusd.map((value, i) => ({
+  .map((value, i) => ({
-  date: eurusd_date[i],
+    date: eurusd_date[i],
-  value
+    value
-}));
+  }))
-
+  .reverse();
 const purchaseData = [
   { status: "Draft", count: draft_p, color: "bg-teal-500", onClick: () => openInTryton("purchase.purchase", undefined, ['tree', 'form'],[['state', '=', 'draft']])},
   { status: "Validated", count: val_p, color: "bg-gray-400", onClick: () => openInTryton("purchase.purchase", undefined, ['tree', 'form'],[['state', '=', 'quotation']]) },
@@ -176,14 +176,29 @@ const kpis = [
   },
 ];
 
+const latestValue  = data.length ? data[0].value : null;
+const prevValue    = data.length > 1 ? data[1].value : null;
+const latestDate   = data.length ? data[0].date  : null;
+
+let trend = null;
+let trendColor = null;
+
+if (latestValue && prevValue) {
+  const diff = ((latestValue - prevValue) / prevValue) * 100;
+
+  trend = `${diff >= 0 ? "+" : ""}${diff.toFixed(2)}%`;
+  trendColor = diff >= 0 ? "#16A34A" : "#DC2626"; // vert / rouge
+}
+
 const news = [
   {
     type: "Forex",
-    label: "EUR/USD: 1.1400",
+    label: `EUR/USD: ${latestValue?.toFixed(4)}`,
-    trend: "+0.88%",
+    trend,
-    color: "#1E3A8A", // bleu foncé
+    color: "#1E3A8A",
-    date: "30-11-2025",
+    date: latestDate,
-    icon: TrendingUp, // icône tendance boursière
+    icon: TrendingUp,
+    trendColor,
   },
   // {
   //   type: "Logistic",
@@ -536,7 +551,12 @@ export default function App() {
                       <div className="ml-6">
                         <span style={{ color: n.color }}>{n.label}</span>
                         {n.trend && (
-                          <span className="ml-2 text-green-600">{n.trend}</span>
+                          <span
+                            className="ml-2 font-semibold"
+                            style={{ color: n.trendColor }}
+                          >
+                            {n.trend}
+                          </span>
                         )}
                       </div>
                     </div>