mirror of
https://github.com/christianvidalwolf-prog/CrazeAnalytix.git
synced 2026-08-03 12:15:23 +02:00
fix: correct revenue metric mapping in Weekly Sales grid (pivot revenue vs ads cost)
This commit is contained in:
Christian Vidal Wolf
+30
-26
@@ -207,6 +207,8 @@ const WeeklyRow: React.FC<{
|
||||
const prevVal = row.unitsByWeek[weeks[idx + 1]] || 0;
|
||||
const spend = row.spendByWeek[week] || 0;
|
||||
const prevSpend = row.spendByWeek[weeks[idx + 1]] || 0;
|
||||
const revenue = row.revenueByWeek[week] || 0;
|
||||
const prevRevenue = row.revenueByWeek[weeks[idx + 1]] || 0;
|
||||
const gv = row.gvByWeek?.[week] || 0;
|
||||
const prevGv = row.gvByWeek?.[weeks[idx + 1]] || 0;
|
||||
|
||||
@@ -218,6 +220,7 @@ const WeeklyRow: React.FC<{
|
||||
const lastYearWeek = `${parseInt(year) - 1}-${weekNum}`;
|
||||
const yoyUnits = row.unitsByWeek[lastYearWeek] || 0;
|
||||
const yoySpend = row.spendByWeek[lastYearWeek] || 0;
|
||||
const yoyRevenue = row.revenueByWeek[lastYearWeek] || 0;
|
||||
const yoyGv = row.gvByWeek?.[lastYearWeek] || 0;
|
||||
|
||||
|
||||
@@ -244,9 +247,9 @@ const WeeklyRow: React.FC<{
|
||||
</MetricDetailTooltip>
|
||||
) : (
|
||||
<MetricDetailTooltip
|
||||
currentValue={spend}
|
||||
previousValue={prevSpend}
|
||||
yoyValue={yoySpend}
|
||||
currentValue={revenue}
|
||||
previousValue={prevRevenue}
|
||||
yoyValue={yoyRevenue}
|
||||
currentWeekLabel={`Week ${weekNum} (${year})`}
|
||||
previousWeekLabel={`Week ${prevWeekNum} (${year})`}
|
||||
yoyWeekLabel={`Week ${weekNum} (${parseInt(year) - 1})`}
|
||||
@@ -255,10 +258,10 @@ const WeeklyRow: React.FC<{
|
||||
formatValue={(v) => `€${v.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}`}
|
||||
>
|
||||
<div className="flex items-center gap-1">
|
||||
<span className={`text-sm font-bold ${spend > 0 ? (sortConfig?.key === week && sortConfig.metric === 'spend' ? 'text-amber-400' : 'text-white') : 'text-slate-700'}`}>
|
||||
{spend > 0 ? `€${spend.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}` : '-'}
|
||||
<span className={`text-sm font-bold ${revenue > 0 ? (sortConfig?.key === week && sortConfig.metric === 'spend' ? 'text-amber-400' : 'text-white') : 'text-slate-700'}`}>
|
||||
{revenue > 0 ? `€${revenue.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}` : '-'}
|
||||
</span>
|
||||
{spend > 0 && renderGrowth(spend, prevSpend)}
|
||||
{revenue > 0 && renderGrowth(revenue, prevRevenue)}
|
||||
</div>
|
||||
</MetricDetailTooltip>
|
||||
)}
|
||||
@@ -266,23 +269,23 @@ const WeeklyRow: React.FC<{
|
||||
<div className="flex flex-col items-center">
|
||||
{/* Secondary Metric (the one not selected) */}
|
||||
{primaryMetric === 'units' ? (
|
||||
spend > 0 && (
|
||||
revenue > 0 && (
|
||||
<MetricDetailTooltip
|
||||
currentValue={spend}
|
||||
previousValue={prevSpend}
|
||||
yoyValue={yoySpend}
|
||||
currentValue={revenue}
|
||||
previousValue={prevRevenue}
|
||||
yoyValue={yoyRevenue}
|
||||
currentWeekLabel={`Week ${weekNum} (${year})`}
|
||||
previousWeekLabel={`Week ${prevWeekNum} (${year})`}
|
||||
yoyWeekLabel={`Week ${weekNum} (${parseInt(year) - 1})`}
|
||||
metricName="Spend"
|
||||
metricColor="text-indigo-400"
|
||||
metricName="Revenue"
|
||||
metricColor="text-indigo-400/80"
|
||||
formatValue={(v) => `€${v.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}`}
|
||||
>
|
||||
<div className="flex items-center gap-1">
|
||||
<span className={`text-[11px] font-medium ${sortConfig?.key === week && sortConfig.metric === 'spend' ? 'text-amber-300' : 'text-indigo-400/80'}`}>
|
||||
€{spend.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}
|
||||
<div className="flex items-center gap-1 text-[10px]">
|
||||
<span className={`font-medium ${sortConfig?.key === week && sortConfig.metric === 'spend' ? 'text-amber-300' : 'text-indigo-400/80'}`}>
|
||||
€{revenue.toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}
|
||||
</span>
|
||||
{renderGrowth(spend, prevSpend)}
|
||||
{renderGrowth(revenue, prevRevenue)}
|
||||
</div>
|
||||
</MetricDetailTooltip>
|
||||
)
|
||||
@@ -296,11 +299,11 @@ const WeeklyRow: React.FC<{
|
||||
previousWeekLabel={`Week ${prevWeekNum} (${year})`}
|
||||
yoyWeekLabel={`Week ${weekNum} (${parseInt(year) - 1})`}
|
||||
metricName="Units"
|
||||
metricColor="text-indigo-400"
|
||||
metricColor="text-indigo-400/80"
|
||||
>
|
||||
<div className="flex items-center gap-1">
|
||||
<span className={`text-[11px] font-medium ${sortConfig?.key === week && sortConfig.metric === 'units' ? 'text-amber-300' : 'text-indigo-400/80'}`}>
|
||||
{val.toLocaleString('de-DE')} Units
|
||||
<div className="flex items-center gap-1 text-[10px]">
|
||||
<span className={`font-medium ${sortConfig?.key === week && sortConfig.metric === 'units' ? 'text-indigo-300' : 'text-indigo-400/80'}`}>
|
||||
{val.toLocaleString('de-DE')}
|
||||
</span>
|
||||
{renderGrowth(val, prevVal)}
|
||||
</div>
|
||||
@@ -427,12 +430,12 @@ const WeeklyGrid: React.FC<WeeklyGridProps & { top50Mode: 'eu' | 'uk' }> = ({
|
||||
|
||||
// Calculate totals in a SINGLE PASS
|
||||
const weekTotals = useMemo(() => {
|
||||
const totals: { [weekKey: string]: { units: number, spend: number, gv: number } } = {};
|
||||
const totals: { [weekKey: string]: { units: number, spend: number, revenue: number, gv: number } } = {};
|
||||
const visibleWeeks = weeks;
|
||||
|
||||
// Initialize visible weeks
|
||||
for (let i = 0; i < visibleWeeks.length; i++) {
|
||||
totals[visibleWeeks[i]] = { units: 0, spend: 0, gv: 0 };
|
||||
totals[visibleWeeks[i]] = { units: 0, spend: 0, revenue: 0, gv: 0 };
|
||||
}
|
||||
|
||||
// Single pass through rows
|
||||
@@ -442,6 +445,7 @@ const WeeklyGrid: React.FC<WeeklyGridProps & { top50Mode: 'eu' | 'uk' }> = ({
|
||||
const w = visibleWeeks[j];
|
||||
totals[w].units += (row.unitsByWeek[w] || 0);
|
||||
totals[w].spend += (row.spendByWeek[w] || 0);
|
||||
totals[w].revenue += (row.revenueByWeek[w] || 0);
|
||||
totals[w].gv += (row.gvByWeek?.[w] || 0);
|
||||
}
|
||||
}
|
||||
@@ -981,15 +985,15 @@ const WeeklyGrid: React.FC<WeeklyGridProps & { top50Mode: 'eu' | 'uk' }> = ({
|
||||
{renderGrowth(weekTotals[week]?.units || 0, weekTotals[weeks[idx + 1]]?.units || 0)}
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-1 text-[10px] text-indigo-400 font-bold">
|
||||
<span>€{(weekTotals[week]?.spend || 0).toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}</span>
|
||||
{renderGrowth(weekTotals[week]?.spend || 0, weekTotals[weeks[idx + 1]]?.spend || 0)}
|
||||
<span>€{(weekTotals[week]?.revenue || 0).toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}</span>
|
||||
{renderGrowth(weekTotals[week]?.revenue || 0, weekTotals[weeks[idx + 1]]?.revenue || 0)}
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<div className="flex items-center gap-1">
|
||||
<span>€{(weekTotals[week]?.spend || 0).toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}</span>
|
||||
{renderGrowth(weekTotals[week]?.spend || 0, weekTotals[weeks[idx + 1]]?.spend || 0)}
|
||||
<span>€{(weekTotals[week]?.revenue || 0).toLocaleString('de-DE', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}</span>
|
||||
{renderGrowth(weekTotals[week]?.revenue || 0, weekTotals[weeks[idx + 1]]?.revenue || 0)}
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-1 text-[10px] text-indigo-400 font-bold">
|
||||
<span>{(weekTotals[week]?.units || 0).toLocaleString('de-DE')} Units</span>
|
||||
|
||||
Reference in New Issue
Block a user