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

feat: split Incentives into Deals and Promos in MKT tab

Browse Source
This commit is contained in:
Christian Vidal Wolf
2026-03-11 09:31:39 +01:00
parent 455cd8ed08
commit f323e2a96e
1 changed files with 22 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/mkt/MasterTable.tsx
+22 -11
View File
@@ -9,7 +9,7 @@ interface MasterTableProps {
onProductClick: (product: Product) => void; onProductClick: (product: Product) => void;
} }
type SortKey = 'name' | 'grossSales' | 'ppcSpend' | 'incentives' | 'chargebacks' | 'netMargin' | 'marginPercent'; type SortKey = 'name' | 'grossSales' | 'ppcSpend' | 'deals' | 'promos' | 'chargebacks' | 'netMargin' | 'marginPercent';
type SortOrder = 'asc' | 'desc'; type SortOrder = 'asc' | 'desc';
export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS, onProductClick }) => { export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS, onProductClick }) => {
@@ -30,11 +30,12 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
const metrics = calculateProductMetrics(product, includeCOGS); const metrics = calculateProductMetrics(product, includeCOGS);
acc.grossSales += product.grossSales; acc.grossSales += product.grossSales;
acc.ppcSpend += product.ppcSpend; acc.ppcSpend += product.ppcSpend;
acc.incentives += metrics.incentives; acc.deals += product.deals;
acc.promos += product.promos;
acc.chargebacks += product.chargebacks; acc.chargebacks += product.chargebacks;
acc.netMargin += metrics.netMargin; acc.netMargin += metrics.netMargin;
return acc; return acc;
}, { grossSales: 0, ppcSpend: 0, incentives: 0, chargebacks: 0, netMargin: 0 }); }, { grossSales: 0, ppcSpend: 0, deals: 0, promos: 0, chargebacks: 0, netMargin: 0 });
}, [products, includeCOGS]); }, [products, includeCOGS]);
const totalMarginPercent = totals.grossSales > 0 ? totals.netMargin / totals.grossSales : 0; const totalMarginPercent = totals.grossSales > 0 ? totals.netMargin / totals.grossSales : 0;
@@ -61,9 +62,13 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
valA = a.ppcSpend; valA = a.ppcSpend;
valB = b.ppcSpend; valB = b.ppcSpend;
break; break;
case 'incentives': case 'deals':
valA = metricsA.incentives; valA = a.deals;
valB = metricsB.incentives; valB = b.deals;
break;
case 'promos':
valA = a.promos;
valB = b.promos;
break; break;
case 'chargebacks': case 'chargebacks':
valA = a.chargebacks; valA = a.chargebacks;
@@ -110,8 +115,11 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
<th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('ppcSpend')}> <th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('ppcSpend')}>
PPC Spend (ACOS) <SortIcon columnKey="ppcSpend" /> PPC Spend (ACOS) <SortIcon columnKey="ppcSpend" />
</th> </th>
<th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('incentives')}> <th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('deals')}>
Incentives <SortIcon columnKey="incentives" /> Deals <SortIcon columnKey="deals" />
</th>
<th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('promos')}>
Promos <SortIcon columnKey="promos" />
</th> </th>
<th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('chargebacks')}> <th className="px-6 py-4 cursor-pointer hover:bg-[#1A1E2A] transition-colors text-right" onClick={() => handleSort('chargebacks')}>
Op. Chargebacks <SortIcon columnKey="chargebacks" /> Op. Chargebacks <SortIcon columnKey="chargebacks" />
@@ -133,7 +141,8 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
{formatCurrency(totals.ppcSpend)} {formatCurrency(totals.ppcSpend)}
<div className="text-xs text-amber-400 font-normal mt-0.5">ACOS: {formatPercent(totalAcos)}</div> <div className="text-xs text-amber-400 font-normal mt-0.5">ACOS: {formatPercent(totalAcos)}</div>
</td> </td>
<td className="px-6 py-4 text-right text-slate-200">{formatCurrency(totals.incentives)}</td> <td className="px-6 py-4 text-right text-slate-200">{formatCurrency(totals.deals)}</td>
<td className="px-6 py-4 text-right text-slate-200">{formatCurrency(totals.promos)}</td>
<td className="px-6 py-4 text-right text-slate-200">{formatCurrency(totals.chargebacks)}</td> <td className="px-6 py-4 text-right text-slate-200">{formatCurrency(totals.chargebacks)}</td>
<td className="px-6 py-4 text-right text-emerald-400">{formatCurrency(totals.netMargin)}</td> <td className="px-6 py-4 text-right text-emerald-400">{formatCurrency(totals.netMargin)}</td>
<td className="px-6 py-4 text-right text-slate-200"> <td className="px-6 py-4 text-right text-slate-200">
@@ -179,8 +188,10 @@ export const MasterTable: React.FC<MasterTableProps> = ({ products, includeCOGS,
<div className="text-xs text-slate-500 mt-0.5">ACOS: <span className="text-amber-400">{formatPercent(metrics.acos)}</span></div> <div className="text-xs text-slate-500 mt-0.5">ACOS: <span className="text-amber-400">{formatPercent(metrics.acos)}</span></div>
</td> </td>
<td className="px-6 py-4 text-right"> <td className="px-6 py-4 text-right">
<div className="font-medium text-slate-200">{formatCurrency(metrics.incentives)}</div> <div className="font-medium text-slate-200">{formatCurrency(product.deals)}</div>
<div className="text-xs text-slate-500 mt-0.5">D: {formatCurrency(product.deals)} | P: {formatCurrency(product.promos)}</div> </td>
<td className="px-6 py-4 text-right">
<div className="font-medium text-slate-200">{formatCurrency(product.promos)}</div>
</td> </td>
<td className="px-6 py-4 text-right"> <td className="px-6 py-4 text-right">
<div className="flex items-center justify-end gap-2"> <div className="flex items-center justify-end gap-2">