feat: integrate Amazon Vendor Stock data across all views and fix local data loading

2026-08-03 13:45:23 +02:00 · 2026-01-28 09:46:59 +01:00
parent 49decf9b9f
commit 97071c7b62
10 changed files with 226 additions and 13 deletions
@@ -0,0 +1,62 @@
+
+import React from 'react';
+
+interface VendorStockBadgeProps {
+    asin: string;
+    vendorStockMap?: Map<string, { eu: number; uk: number }>;
+    mode: 'eu' | 'uk';
+}
+
+export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendorStockMap, mode }) => {
+    if (!vendorStockMap || !asin) return null;
+
+    const stockData = vendorStockMap.get(asin.toUpperCase());
+    if (!stockData) return null;
+
+    const stock = mode === 'uk' ? stockData.uk : stockData.eu;
+
+    // As per user request: "etiqueta será de color gris claro"
+    // Using a light gray/slate theme that fits the dashboard's premium look
+    const themeClasses = "bg-slate-200 text-slate-800 border-slate-300 shadow-sm";
+
+    return (
+        <div
+            className={`inline-flex items-center gap-1 px-2 py-0.5 rounded border text-[10px] font-bold transition-all hover:scale-105 active:scale-95 cursor-default ${themeClasses}`}
+            title={`Stock en Amazon Warehouse (${mode.toUpperCase()}): ${stock}`}
+        >
+            <svg
+                className="w-3.5 h-3.5"
+                viewBox="0 0 24 24"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+            >
+                <path
+                    d="M17.5 14c.5 0 1 .5 1 1s-.5 1-1 1-1-.5-1-1 .5-1 1-1zm-11 0c.5 0 1 .5 1 1s-.5 1-1 1-1-.5-1-1 .5-1 1-1z"
+                    fill="currentColor"
+                />
+                <path
+                    d="M3 13.5c0 4.7 3.8 8.5 8.5 8.5s8.5-3.8 8.5-8.5"
+                    stroke="currentColor"
+                    strokeWidth="1.5"
+                    strokeLinecap="round"
+                />
+                <path
+                    d="M17 18.5c-1.5 1.5-3.5 2.5-5.5 2.5s-4-1-5.5-2.5"
+                    stroke="currentColor"
+                    strokeWidth="1.5"
+                    strokeLinecap="round"
+                />
+                <path
+                    d="M19 18.5l1.5 1.5M5 18.5L3.5 20"
+                    stroke="currentColor"
+                    strokeWidth="1.5"
+                    strokeLinecap="round"
+                />
+            </svg>
+            <div className="flex flex-col leading-[0.8]">
+                <span className="text-[7px] font-black uppercase opacity-60">Vendor</span>
+                <span>{stock.toLocaleString('de-DE')}</span>
+            </div>
+        </div>
+    );
+};