Fix: consolidate stock badges and update WOC calculation to include internal warehouse stock

This commit is contained in:
Christian Vidal Wolf
2026-04-27 11:40:36 +02:00
parent 6ba07c60f6
commit 1fc494fc3f
8 changed files with 34 additions and 29 deletions
+9 -7
View File
@@ -6,9 +6,10 @@ interface VendorStockBadgeProps {
vendorStockMap?: Map<string, { eu: number; uk: number }>;
mode: 'eu' | 'uk';
avgWeeklySales?: number;
internalStock?: number;
}
export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendorStockMap, mode, avgWeeklySales }) => {
export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendorStockMap, mode, avgWeeklySales, internalStock }) => {
if (!asin) return null;
const normalizedAsin = asin.trim().toUpperCase();
@@ -27,7 +28,8 @@ export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendor
);
}
const stock = mode === 'uk' ? stockData.uk : stockData.eu;
const amazonStock = mode === 'uk' ? stockData.uk : stockData.eu;
const totalStock = amazonStock + (internalStock || 0);
// Calculate Weeks of Coverage (WOC)
// If sales are 0 but store has stock -> Infinite coverage (>52 weeks) -> Green
@@ -37,8 +39,8 @@ export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendor
const velocity = avgWeeklySales || 0;
if (velocity > 0) {
woc = stock / velocity;
} else if (stock > 0) {
woc = totalStock / velocity;
} else if (totalStock > 0) {
woc = 999;
} else {
woc = 0;
@@ -53,17 +55,17 @@ export const VendorStockBadge: React.FC<VendorStockBadgeProps> = ({ asin, vendor
<div className="flex flex-col items-center gap-0.5 justify-center min-w-[70px]">
<div
className={`inline-flex items-center gap-1.5 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}`}
title={`Stock en Amazon Warehouse (${mode.toUpperCase()}): ${amazonStock}${internalStock ? ` | Almacén GMBH: ${internalStock}` : ''} | TOTAL: ${totalStock}`}
>
<AmazonSmileIcon className="w-3.5 h-3.5" />
<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>
<span>{amazonStock.toLocaleString('de-DE')}</span>
</div>
</div>
<div
className={`px-1.5 py-0.5 rounded-sm bg-slate-900/40 border border-white/5 shadow-inner`}
title={`Avg Sales (4wk): ${velocity.toFixed(2)} | Stock: ${stock}`}
title={`Avg Sales (4wk): ${velocity.toFixed(2)} | Total Stock (Amz+Gmbh): ${totalStock}`}
>
<span className={`text-[10px] font-black uppercase tracking-tighter whitespace-nowrap block ${wocColor}`}>
{wocText}