Added fees/expenses subtotals

X-Lovable-Edit-ID: edt-fd16a07a-2833-45c6-bb85-f891ba4edbb6
Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
This commit is contained in:
gpt-engineer-app[bot]
2026-04-19 20:09:11 +00:00
co-authored by renee-png
+15
View File
@@ -114,6 +114,19 @@ function InvoiceDetail() {
return Array.from(map.values());
}, [items]);
// Billable fees vs billable expenses subtotals (non-billable items have amount 0 and are excluded).
const { feesSubtotal, expensesSubtotal } = useMemo(() => {
let fees = 0;
let exp = 0;
for (const it of items) {
const amt = Number(it.amount) || 0;
if (amt === 0) continue;
if (it.kind === "expense") exp += amt;
else fees += amt;
}
return { feesSubtotal: fees, expensesSubtotal: exp };
}, [items]);
if (loading) return <PageContainer><p className="text-muted-foreground">Loading…</p></PageContainer>;
if (!invoice) {
return (
@@ -497,6 +510,8 @@ function InvoiceDetail() {
<div className="space-y-4">
<Card className="border-border/60">
<CardContent className="p-5 space-y-2 text-sm">
<Row label="Fees subtotal" value={formatCurrency(feesSubtotal)} />
<Row label="Expenses subtotal" value={formatCurrency(expensesSubtotal)} />
<Row label="Subtotal" value={formatCurrency(invoice.subtotal)} />
<div className="flex justify-between items-center">
<span className="text-muted-foreground">Tax</span>