Fix: restore Top50 ranking badges (white/gradient) next to inventory badges across all views

components/mkt/MasterTable.tsx

@@ -5,6 +5,7 @@ import { ArrowUpDown, AlertCircle, ChevronUp, ChevronDown } from 'lucide-react';
 import { StockBadge } from '../StockBadge';
 import { VendorStockBadge } from '../VendorStockBadge';
 import { BuyBoxWarningBadge } from '../BuyBoxWarningBadge';
+import { Top50Badge } from '../Top50Badge';
 
 interface MasterTableProps {
   products: Product[];
@@ -15,6 +16,7 @@ interface MasterTableProps {
   top50Mode?: 'eu' | 'uk';
   velocityMap?: Map<string, number>;
   buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
+  top50Ranking?: { eu: Map<string, number>; uk: Map<string, number> };
 }
 
 type SortKey = 'name' | 'grossSales' | 'ppcSpend' | 'deals' | 'promos' | 'chargebacks' | 'netMargin' | 'marginPercent';
@@ -28,7 +30,8 @@ export const MasterTable: React.FC<MasterTableProps> = ({
   vendorStockMap,
   top50Mode = 'eu',
   velocityMap,
-  buyBoxLostMap
+  buyBoxLostMap,
+  top50Ranking
 }) => {
   const [sortKey, setSortKey] = useState<SortKey>('marginPercent');
   const [sortOrder, setSortOrder] = useState<SortOrder>('asc');
@@ -196,6 +199,19 @@ export const MasterTable: React.FC<MasterTableProps> = ({
                         {stockMap && (
                           <StockBadge stock={stockMap.get(product.sku?.replace(/(DE|EN)$/i, ''))} />
                         )}
+                        {(() => {
+                          const asin = product.asin.trim().toUpperCase();
+                          if (asin && top50Ranking) {
+                            if (top50Mode === 'eu') {
+                              const rank = top50Ranking.eu.get(asin);
+                              if (rank) return <Top50Badge rank={rank} label="EU" theme="indigo" />;
+                            } else {
+                              const rank = top50Ranking.uk.get(asin);
+                              if (rank) return <Top50Badge rank={rank} label="UK" theme="blue" />;
+                            }
+                          }
+                          return null;
+                        })()}
                         <VendorStockBadge 
                           asin={product.asin} 
                           vendorStockMap={vendorStockMap} 

components/mkt/MktDataView.tsx

@@ -95,6 +95,7 @@ interface MktDataViewProps {
   top50Mode?: 'eu' | 'uk';
   velocityMap?: Map<string, number>;
   buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
+  top50Ranking?: { eu: Map<string, number>; uk: Map<string, number> };
 }
 
 export default function MktDataView({ 
@@ -104,7 +105,8 @@ export default function MktDataView({
   vendorStockMap,
   top50Mode = 'eu',
   velocityMap,
-  buyBoxLostMap
+  buyBoxLostMap,
+  top50Ranking
 }: MktDataViewProps) {
   const [includeCOGS, setIncludeCOGS] = useState(true);
   const [selectedProduct, setSelectedProduct] = useState<Product | null>(null);
@@ -332,6 +334,7 @@ export default function MktDataView({
           top50Mode={top50Mode}
           velocityMap={velocityMap}
           buyBoxLostMap={buyBoxLostMap}
+          top50Ranking={top50Ranking}
         />
       </div>