Fix Ads data mismatch, optimize Forecast performance, and add Excel-style in-column stock filtering

This commit is contained in:
Christian Vidal Wolf
2026-01-27 21:12:27 +01:00
parent cb9beecaec
commit db65509bab
5 changed files with 174 additions and 36 deletions
+13 -2
View File
@@ -3,6 +3,7 @@ import * as XLSX from 'xlsx';
import { CombinedKPIs, FilterState } from '../types';
import { DownloadIcon } from './Icons';
import { StockBadge } from './StockBadge';
import { InColumnStockFilter } from './InColumnStockFilter';
interface AdsPerformanceProps {
data: CombinedKPIs[];
@@ -12,6 +13,8 @@ interface AdsPerformanceProps {
uk: Map<string, number>;
};
stockMap?: Map<string, number>;
stockFilter: string[];
onStockFilterChange: (newFilters: string[]) => void;
}
type SortKey = keyof CombinedKPIs | 'acos' | 'roas' | 'tacos' | 'ctr' | 'cpc' | 'cvrUnits';
@@ -36,7 +39,7 @@ const Top50Badge: React.FC<{ rank: number; label?: string; theme?: 'amber' | 'bl
);
};
const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters, top50Ranking, stockMap }) => {
const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters, top50Ranking, stockMap, stockFilter, onStockFilterChange }) => {
const [searchTerm, setSearchTerm] = useState('');
const [showOnlyTop50, setShowOnlyTop50] = useState(false);
const [top50Mode, setTop50Mode] = useState<'eu' | 'uk'>('eu');
@@ -368,7 +371,15 @@ const AdsPerformance: React.FC<AdsPerformanceProps> = ({ data, filters, top50Ran
<table className="w-full text-left border-collapse text-[11px]">
<thead className="sticky top-0 z-20 bg-[#1A1F29] shadow-sm">
<tr className="border-b border-white/5">
<th className="p-4 font-black text-slate-400 uppercase tracking-widest min-w-[250px]">PRODUCT</th>
<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>
</th>
<SortableHeader label="TOTAL SALES" sortKey="salesTotal" activeSort={sortConfig} onSort={handleSort} />
<SortableHeader label="ADS SALES" sortKey="salesAds" activeSort={sortConfig} onSort={handleSort} />
<SortableHeader label="ORGANIC SALES" sortKey="salesOrganic" activeSort={sortConfig} onSort={handleSort} />