diff --git a/frontend/src/components/TransactionList.tsx b/frontend/src/components/TransactionList.tsx index 968e110..2976615 100644 --- a/frontend/src/components/TransactionList.tsx +++ b/frontend/src/components/TransactionList.tsx @@ -194,6 +194,22 @@ export default function TransactionList({ : transactions; const empty = visibleTransactions.length === 0 && !loading; + // Net spend of the listed transactions per currency: COMPRA − DEVOLUCION, + // excluding Tasa Cero anchors (their cuotas are what count in the budget). + const totalsByCurrency = useMemo(() => { + const totals = new Map(); + for (const tx of visibleTransactions) { + if (tx.is_installment_anchor) continue; + if (tx.transaction_type !== 'COMPRA' && tx.transaction_type !== 'DEVOLUCION') continue; + const sign = tx.transaction_type === 'DEVOLUCION' ? -1 : 1; + totals.set(tx.currency, (totals.get(tx.currency) ?? 0) + sign * tx.amount); + } + // CRC first, then the rest alphabetically + return [...totals.entries()].sort(([a], [b]) => + a === 'CRC' ? -1 : b === 'CRC' ? 1 : a.localeCompare(b), + ); + }, [visibleTransactions]); + return ( <> {/* Search + Add */} @@ -213,6 +229,25 @@ export default function TransactionList({ + {/* Total of the listed transactions */} + {totalsByCurrency.length > 0 && ( +
+ + {visibleTransactions.length} transaccion{visibleTransactions.length === 1 ? '' : 'es'} · Total: + + {totalsByCurrency.map(([currency, net], i) => ( + + {i > 0 && +} + {net < 0 ? '+' : ''} + {formatAmount(net, currency)} + + ))} +
+ )} + {/* Bulk action bar */} {selected.size > 0 && (