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

This commit is contained in:
Christian Vidal Wolf
2026-01-28 09:46:59 +01:00
parent 49decf9b9f
commit 97071c7b62
10 changed files with 226 additions and 13 deletions
+7 -2
View File
@@ -4,6 +4,7 @@ import { ProductForecastData, FilterState, CombinedKPIs } from '../types';
import { DownloadIcon, FunnelIcon, TrendingIcon, ChartIcon } from './Icons';
import { StockBadge } from './StockBadge';
import { Top50Badge } from './Top50Badge';
import { VendorStockBadge } from './VendorStockBadge';
import { InColumnStockFilter } from './InColumnStockFilter';
import { PAN_EU_COUNTRIES } from '../services/dataProcessor';
import {
@@ -19,6 +20,7 @@ interface ForecastViewProps {
uk: Map<string, number>;
};
stockMap?: Map<string, number>;
vendorStockMap?: Map<string, { eu: number; uk: number }>;
stockFilter: string[];
onStockFilterChange: (newFilters: string[]) => void;
top50Mode: 'eu' | 'uk';
@@ -32,7 +34,8 @@ const ForecastRow: React.FC<{
top50Ranking?: { eu: Map<string, number>; uk: Map<string, number> };
top50Mode: 'eu' | 'uk';
stockMap?: Map<string, number>;
}> = React.memo(({ item, activeMonths, top50Ranking, top50Mode, stockMap }) => {
vendorStockMap?: Map<string, { eu: number; uk: number }>;
}> = React.memo(({ item, activeMonths, top50Ranking, top50Mode, stockMap, vendorStockMap }) => {
const asin = item.asin.trim().toUpperCase();
const ranks: { rank: number; label: string; theme: 'amber' | 'blue' | 'indigo' }[] = [];
@@ -71,6 +74,7 @@ const ForecastRow: React.FC<{
{stockMap && (
<StockBadge stock={stockMap.get(item.sku?.replace(/(DE|EN)$/i, ''))} />
)}
<VendorStockBadge asin={item.asin} vendorStockMap={vendorStockMap} mode={top50Mode} />
</div>
</div>
</td>
@@ -112,7 +116,7 @@ const ForecastRow: React.FC<{
);
});
const ForecastView: React.FC<ForecastViewProps> = ({ data, filters, top50Ranking, stockMap, stockFilter, onStockFilterChange, top50Mode }) => {
const ForecastView: React.FC<ForecastViewProps> = ({ data, filters, top50Ranking, stockMap, vendorStockMap, stockFilter, onStockFilterChange, top50Mode }) => {
const [searchTerm, setSearchTerm] = useState('');
const [showOnlyTop50, setShowOnlyTop50] = useState(false);
const [displayCount, setDisplayCount] = useState(50);
@@ -246,6 +250,7 @@ const ForecastView: React.FC<ForecastViewProps> = ({ data, filters, top50Ranking
top50Ranking={top50Ranking}
top50Mode={top50Mode}
stockMap={stockMap}
vendorStockMap={vendorStockMap}
/>
))}
</tbody>