diff --git a/components/DataGrid.tsx b/components/DataGrid.tsx index 0bbc01b..a58e786 100644 --- a/components/DataGrid.tsx +++ b/components/DataGrid.tsx @@ -637,7 +637,7 @@ const DataGrid: React.FC = ({ data }) => { Filtered Totals: - {years.map((year) => { + {years.map((year, index) => { const yearTotals = processedRows.reduce( (acc, row) => { const data = row.totalsByYear[year]; @@ -649,21 +649,64 @@ const DataGrid: React.FC = ({ data }) => { }, { sellOut: 0, units: 0 } ); + + // Calculate YoY growth if previous year exists + const prevYear = years[index + 1]; + let sellOutGrowth = null; + let unitsGrowth = null; + + if (prevYear) { + const prevYearTotals = processedRows.reduce( + (acc, row) => { + const data = row.totalsByYear[prevYear]; + if (data) { + acc.sellOut += data.sellOut; + acc.units += data.units; + } + return acc; + }, + { sellOut: 0, units: 0 } + ); + + if (prevYearTotals.sellOut > 0) { + sellOutGrowth = ((yearTotals.sellOut - prevYearTotals.sellOut) / prevYearTotals.sellOut) * 100; + } else if (yearTotals.sellOut > 0) { + sellOutGrowth = 100; + } + + if (prevYearTotals.units > 0) { + unitsGrowth = ((yearTotals.units - prevYearTotals.units) / prevYearTotals.units) * 100; + } else if (yearTotals.units > 0) { + unitsGrowth = 100; + } + } + return ( -
+
{year} -
- S.O: - - €{yearTotals.sellOut.toLocaleString(undefined, { maximumFractionDigits: 0 })} - -
-
-
- Units: - - {yearTotals.units.toLocaleString()} - +
+
+ S.O: + + €{yearTotals.sellOut.toLocaleString(undefined, { maximumFractionDigits: 0 })} + + {sellOutGrowth !== null && ( + = 0 ? 'text-emerald-400' : 'text-red-400'}`}> + {sellOutGrowth >= 0 ? '↑' : '↓'} {Math.abs(sellOutGrowth).toFixed(1)}% + + )} +
+
+ Units: + + {yearTotals.units.toLocaleString()} + + {unitsGrowth !== null && ( + = 0 ? 'text-emerald-400' : 'text-red-400'}`}> + {unitsGrowth >= 0 ? '↑' : '↓'} {Math.abs(unitsGrowth).toFixed(1)}% + + )} +
);