mirror of
https://github.com/christianvidalwolf-prog/CrazeAnalytix.git
synced 2026-08-03 12:35:24 +02:00
Fix: ensure Amazon stock badges are visible in Profitability and Top Movers tabs
This commit is contained in:
@@ -130,7 +130,7 @@ const MoversTable: React.FC<{
|
|||||||
|
|
||||||
{/* Stock Badge */}
|
{/* Stock Badge */}
|
||||||
<td className="px-6 py-3 text-center">
|
<td className="px-6 py-3 text-center">
|
||||||
<StockBadge stock={stockMap?.get(item.sku)} />
|
<StockBadge stock={stockMap?.get(item.sku?.replace(/(DE|EN)$/i, ''))} />
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
{/* Vendor Stock Badge */}
|
{/* Vendor Stock Badge */}
|
||||||
|
|||||||
@@ -2,17 +2,34 @@ import React, { useState, useMemo } from 'react';
|
|||||||
import { Product } from './types';
|
import { Product } from './types';
|
||||||
import { formatCurrency, formatPercent, calculateProductMetrics, cn } from './utils';
|
import { formatCurrency, formatPercent, calculateProductMetrics, cn } from './utils';
|
||||||
import { ArrowUpDown, AlertCircle, ChevronUp, ChevronDown } from 'lucide-react';
|
import { ArrowUpDown, AlertCircle, ChevronUp, ChevronDown } from 'lucide-react';
|
||||||
|
import { StockBadge } from '../StockBadge';
|
||||||
|
import { VendorStockBadge } from '../VendorStockBadge';
|
||||||
|
import { BuyBoxWarningBadge } from '../BuyBoxWarningBadge';
|
||||||
|
|
||||||
interface MasterTableProps {
|
interface MasterTableProps {
|
||||||
products: Product[];
|
products: Product[];
|
||||||
includeCOGS: boolean;
|
includeCOGS: boolean;
|
||||||
onProductClick: (product: Product) => void;
|
onProductClick: (product: Product) => void;
|
||||||
|
stockMap?: Map<string, number>;
|
||||||
|
vendorStockMap?: Map<string, { eu: number; uk: number }>;
|
||||||
|
top50Mode?: 'eu' | 'uk';
|
||||||
|
velocityMap?: Map<string, number>;
|
||||||
|
buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
|
||||||
}
|
}
|
||||||
|
|
||||||
type SortKey = 'name' | 'grossSales' | 'ppcSpend' | 'deals' | 'promos' | 'chargebacks' | 'netMargin' | 'marginPercent';
|
type SortKey = 'name' | 'grossSales' | 'ppcSpend' | 'deals' | 'promos' | 'chargebacks' | 'netMargin' | 'marginPercent';
|
||||||
type SortOrder = 'asc' | 'desc';
|
type SortOrder = 'asc' | 'desc';
|
||||||
|
|
||||||
export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS, onProductClick }) => {
|
export const MasterTable: React.FC<MasterTableProps> = ({
|
||||||
|
products,
|
||||||
|
includeCOGS,
|
||||||
|
onProductClick,
|
||||||
|
stockMap,
|
||||||
|
vendorStockMap,
|
||||||
|
top50Mode = 'eu',
|
||||||
|
velocityMap,
|
||||||
|
buyBoxLostMap
|
||||||
|
}) => {
|
||||||
const [sortKey, setSortKey] = useState<SortKey>('marginPercent');
|
const [sortKey, setSortKey] = useState<SortKey>('marginPercent');
|
||||||
const [sortOrder, setSortOrder] = useState<SortOrder>('asc');
|
const [sortOrder, setSortOrder] = useState<SortOrder>('asc');
|
||||||
|
|
||||||
@@ -172,9 +189,21 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
|
|||||||
className="hover:bg-[#1A1E2A] transition-colors cursor-pointer group"
|
className="hover:bg-[#1A1E2A] transition-colors cursor-pointer group"
|
||||||
onClick={() => onProductClick(product)}
|
onClick={() => onProductClick(product)}
|
||||||
>
|
>
|
||||||
<td className="px-6 py-4 whitespace-normal min-w-[250px] max-w-[300px]">
|
<td className="px-6 py-4 whitespace-normal min-w-[300px] max-w-[400px]">
|
||||||
<div className="font-medium text-slate-200 group-hover:text-indigo-400 transition-colors line-clamp-2" title={product.name}>{product.name}</div>
|
<div className="font-medium text-slate-200 group-hover:text-indigo-400 transition-colors line-clamp-2" title={product.name}>{product.name}</div>
|
||||||
<div className="text-xs text-slate-500 font-mono mt-0.5">{product.sku} | {product.asin}</div>
|
<div className="text-xs text-slate-500 font-mono mt-0.5 mb-2">{product.sku} | {product.asin}</div>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
{stockMap && (
|
||||||
|
<StockBadge stock={stockMap.get(product.sku?.replace(/(DE|EN)$/i, ''))} />
|
||||||
|
)}
|
||||||
|
<VendorStockBadge
|
||||||
|
asin={product.asin}
|
||||||
|
vendorStockMap={vendorStockMap}
|
||||||
|
mode={top50Mode}
|
||||||
|
avgWeeklySales={velocityMap?.get(product.asin.trim().toUpperCase())}
|
||||||
|
/>
|
||||||
|
<BuyBoxWarningBadge asin={product.asin} buyBoxLostMap={buyBoxLostMap} />
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 text-right">
|
<td className="px-6 py-4 text-right">
|
||||||
<div className="flex flex-col items-end">
|
<div className="flex flex-col items-end">
|
||||||
|
|||||||
Reference in New Issue
Block a user