Implement Vendor Stock Filtering across Weekly Sales, Ads, and Forecast views

This commit is contained in:
Christian Vidal Wolf
2026-01-28 10:18:08 +01:00
parent 97071c7b62
commit 5915bb4c0e
7 changed files with 182 additions and 33 deletions
+35 -3
View File
@@ -19,6 +19,8 @@ interface AdsPerformanceProps {
onStockFilterChange: (newFilters: string[]) => void;
top50Mode: 'eu' | 'uk';
vendorStockMap?: Map<string, { eu: number; uk: number }>;
vendorStockFilter: string[];
onVendorStockFilterChange: (newFilters: string[]) => void;
}
type SortKey = keyof CombinedKPIs | 'acos' | 'roas' | 'tacos' | 'ctr' | 'cpc' | 'cvrUnits';
@@ -64,7 +66,9 @@ const AdsRow: React.FC<{
))}
<span className="text-white font-bold text-sm tracking-tight">{item.asin}</span>
</div>
<span className="text-[10px] uppercase font-black text-indigo-400 tracking-tighter">SKU: {item.sku}</span>
<div className="flex items-center gap-2">
<span className="text-[10px] uppercase font-black text-indigo-400 tracking-tighter">SKU: {item.sku}</span>
</div>
<div className="flex items-start gap-2">
<span className="text-[10px] text-slate-400 truncate max-w-[200px] leading-tight" title={item.title}>{item.title}</span>
{stockMap && (
@@ -92,7 +96,18 @@ const AdsRow: React.FC<{
);
});
const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters, top50Ranking, stockMap, vendorStockMap, stockFilter, onStockFilterChange, top50Mode }) => {
const AdsPerformance: React.FC<AdsPerformanceProps> = ({
data,
filters,
top50Ranking,
stockMap,
vendorStockMap,
stockFilter,
onStockFilterChange,
vendorStockFilter,
onVendorStockFilterChange,
top50Mode
}) => {
const [searchTerm, setSearchTerm] = useState('');
const [showOnlyTop50, setShowOnlyTop50] = useState(false);
const [sortConfig, setSortConfig] = useState<{ key: SortKey; direction: 'asc' | 'desc' }>({
@@ -376,7 +391,24 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters, top50Ran
<th className="p-4 font-black text-slate-400 uppercase tracking-widest min-w-[250px]">
<div className="flex items-center gap-2">
<span>PRODUCT</span>
<InColumnStockFilter currentFilters={stockFilter} onFilterChange={onStockFilterChange} />
<div className="flex items-center gap-1 scale-75 origin-left">
<InColumnStockFilter
currentFilters={stockFilter}
onFilterChange={onStockFilterChange}
title="Warehouse Stock"
/>
<InColumnStockFilter
currentFilters={vendorStockFilter}
onFilterChange={onVendorStockFilterChange}
title="Vendor Stock"
options={[
'Out of Stock (0)',
'In Stock (>0)',
'In Stock (>20)',
'Low Stock (<10)',
]}
/>
</div>
</div>
</th>
<SortableHeader label="TOTAL SALES" sortKey="salesTotal" activeSort={sortConfig} onSort={handleSort} />