christianV/CrazeAnalytix
1
0
Fork 0
mirror of https://github.com/christianvidalwolf-prog/CrazeAnalytix.git synced 2026-08-03 12:35:24 +02:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Christian Vidal Wolf
2026-04-27 11:33:07 +02:00
parent 9f8e51e2f3
commit 99e4b2c34b
8 changed files with 113 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/TopMovers.tsx
+30 -2
View File
@@ -4,6 +4,7 @@ import { SalesRecord } from '../types';
import { DownloadIcon } from './Icons';
import { StockBadge } from './StockBadge';
import { VendorStockBadge } from './VendorStockBadge';
import { Top50Badge } from './Top50Badge';
import { BuyBoxWarningBadge } from './BuyBoxWarningBadge';
interface TopMoversProps {
@@ -12,6 +13,8 @@ interface TopMoversProps {
vendorStockMap?: Map<string, { eu: number; uk: number }>;
buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
top50Mode?: 'eu' | 'uk';
velocityMap?: Map<string, number>;
top50Ranking?: { eu: Map<string, number>; uk: Map<string, number> };
}
type Metric = 'sellOut' | 'units';
@@ -39,7 +42,9 @@ const MoversTable: React.FC<{
vendorStockMap?: Map<string, { eu: number; uk: number }>;
buyBoxLostMap?: Map<string, { countries: string[]; reasons: Record<string, string> }>;
top50Mode?: 'eu' | 'uk';
}> = ({ title, data, metric, previousYear, currentYear, type, stockMap, vendorStockMap, buyBoxLostMap, top50Mode = 'eu' }) => {
velocityMap?: Map<string, number>;
top50Ranking?: { eu: Map<string, number>; uk: Map<string, number> };
}> = ({ title, data, metric, previousYear, currentYear, type, stockMap, vendorStockMap, buyBoxLostMap, top50Mode = 'eu', velocityMap, top50Ranking }) => {
const formatValue = (val: number) => {
if (metric === 'sellOut') return `€${val.toLocaleString('de-DE', { maximumFractionDigits: 0 })}`;
@@ -131,6 +136,19 @@ const MoversTable: React.FC<{
{/* Stock Badge */}
<td className="px-6 py-3 text-center">
<StockBadge stock={stockMap?.get(item.sku?.replace(/(DE|EN)$/i, ''))} />
{(() => {
const asin = item.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;
})()}
</td>
{/* Vendor Stock Badge */}
@@ -182,7 +200,15 @@ const MoversTable: React.FC<{
);
};
const TopMovers: React.FC<TopMoversProps> = ({ data, stockMap, vendorStockMap, buyBoxLostMap, top50Mode = 'eu' }) => {
const TopMovers: React.FC<TopMoversProps> = ({
data,
stockMap,
vendorStockMap,
buyBoxLostMap,
top50Mode = 'eu',
velocityMap,
top50Ranking
}) => {
const [metric, setMetric] = useState<Metric>('sellOut');
const [viewMode, setViewMode] = useState<'growth' | 'decline'>('growth');
@@ -336,6 +362,8 @@ const TopMovers: React.FC<TopMoversProps> = ({ data, stockMap, vendorStockMap, b
vendorStockMap={vendorStockMap}
buyBoxLostMap={buyBoxLostMap}
top50Mode={top50Mode}
velocityMap={velocityMap}
top50Ranking={top50Ranking}
/>
</div>