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

feat: add Ad Spend and TACOS totals to Data Grid header

Browse Source 
- DataGrid.tsx: Enhanced filteredTotalsByYear to aggregate advertising metrics
- DataGrid.tsx: Updated header row to include Ad Spend and TACOS cells per year
- DataGrid.tsx: Integrated YoY growth for Ad Spend
This commit is contained in:
Christian Vidal Wolf
2026-01-22 15:40:56 +01:00
parent aaca2ffe88
commit 473174f7e6
1 changed files with 41 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/DataGrid.tsx
+41 -3
View File
@@ -463,9 +463,14 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData =
acc.sellOut += data.sellOut;
acc.units += data.units;
}
const ads = row.adsByYear?.[year];
if (ads) {
acc.adSpend += ads.adSpend;
acc.attributedSales += ads.attributedSales;
}
return acc;
},
{ sellOut: 0, units: 0 }
{ sellOut: 0, units: 0, adSpend: 0, attributedSales: 0 }
);
result[year] = totals;
@@ -480,9 +485,13 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData =
acc.sellOut += data.sellOut;
acc.units += data.units;
}
const ads = row.adsByYear?.[prevYear];
if (ads) {
acc.adSpend += ads.adSpend;
}
return acc;
},
{ sellOut: 0, units: 0 }
{ sellOut: 0, units: 0, adSpend: 0 }
);
if (prevYearTotals.sellOut > 0) {
@@ -496,6 +505,12 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData =
} else if (totals.units > 0) {
result[year].unitsGrowth = 100;
}
if (prevYearTotals.adSpend > 0) {
(result[year] as any).adSpendGrowth = ((totals.adSpend - prevYearTotals.adSpend) / prevYearTotals.adSpend) * 100;
} else if (totals.adSpend > 0) {
(result[year] as any).adSpendGrowth = 100;
}
}
});
@@ -898,7 +913,30 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData =
</div>
</th>
{prevYear && <th colSpan={2} className="bg-indigo-900/5 border-r border-indigo-500/10"></th>}
{showAdsMetrics && adsSummary && <th colSpan={2} className="bg-fuchsia-900/5 border-r border-fuchsia-500/10"></th>}
{showAdsMetrics && adsSummary && (
<>
<th className="px-3 py-3 text-right bg-fuchsia-950/20 border-r border-fuchsia-500/10">
<div className="flex flex-col items-end">
<span className="text-fuchsia-400 font-bold text-[13px]">
€{totals.adSpend.toLocaleString('de-DE', { maximumFractionDigits: 0 })}
</span>
{(totals as any).adSpendGrowth !== undefined && (
<span className={`text-[9px] font-black ${(totals as any).adSpendGrowth <= 0 ? 'text-emerald-400' : 'text-amber-400'}`}>
{(totals as any).adSpendGrowth >= 0 ? '↑' : '↓'} {Math.abs((totals as any).adSpendGrowth).toFixed(1)}%
</span>
)}
</div>
</th>
<th className="px-3 py-3 text-right bg-fuchsia-950/20 border-r border-fuchsia-500/10">
<div className="flex flex-col items-end">
<span className="text-fuchsia-300 font-bold text-[13px]">
{totals.sellOut > 0 ? ((totals.adSpend / totals.sellOut) * 100).toFixed(2) : '0.00'}%
</span>
<span className="text-[9px] font-black text-slate-500 uppercase">TACOS</span>
</div>
</th>
</>
)}
</React.Fragment>
);
})}