fix(analytics): make the displayed numbers mean what they say
ci / lint-test (push) Failing after 44s
ci / lint-test (push) Failing after 44s
Six metric-integrity defects from the UI/IA review, plus two found while verifying the review's own claims against the code. The reconciled-row exclusion existed only in queries.ts. Every analytics route counted the superseded manual rows as spend — 48 rows, $4,474.79 of double count, invisible precisely because the transaction list looked right. It is now one fragment both sides import. The spend-pace chart computed its own totals in the browser: gross amounts, debits only, no personal share, no refunds, fees, interest or itemised loan repayments. On live data it ended July at $4,747.31 under a headline reading $3,597.10 — and its own baseline line was drawn from the split-adjusted monthly totals, so the two series in one chart disagreed with each other. Both now come from /api/analytics/daily, built from the same fragments as the headline. Fees aggregated every statement ever imported with no date filter, under a heading with no period, so a lifetime figure read as a current one and grew forever. Now bounded, labelled, and selectable. Comparisons no longer measure a month in progress against complete ones: the in-progress month is out of every baseline, and a selected current month is compared through the same day. Two the review did not catch: - Every analytics window was a day early. toISOString() on a local-midnight Date converts backwards through UTC. Surfaced only once fees started reporting the range it had used. - /monthly rounded per category, /daily per category-day, so the pace chart ended a few cents off the headline above it. Shared currency needed amending rather than applying. Reading s.currency would have labelled every order row AUD, since an order receipt has no statement and carries its own currency — the opposite convention from a foreign charge on an AUD statement, where amount IS AUD. NATIVE_CURRENCY's COALESCE order keeps the two apart. Balances also now count rows whose AUD value is genuinely unknown instead of netting a foreign figure against AUD ones. Latent today: no foreign transaction is currently split. Tag-filtered balance cards no longer claim "owes you". With a filter on, payments are deliberately not subtracted, so the figure is a split total and settling against it would record a payment for a debt that never was. Split-coverage warnings deliberately omitted (user decision).
This commit is contained in:
@@ -10,6 +10,18 @@ import { CHART, TOOLTIP_STYLE } from "@/lib/category-colors";
|
||||
|
||||
const SPEND_TYPES = new Set(["debit", "fee", "interest"]);
|
||||
|
||||
/**
|
||||
* The API returns an exclusive upper bound (first day of the month after the
|
||||
* window). Showing that date verbatim would claim a month the totals exclude,
|
||||
* so `exclusive` steps back a day for display.
|
||||
*/
|
||||
function formatPeriodBound(iso: string | null, exclusive = false): string {
|
||||
if (!iso) return "—";
|
||||
const d = new Date(`${iso}T00:00:00`);
|
||||
if (exclusive) d.setDate(d.getDate() - 1);
|
||||
return d.toLocaleDateString("default", { month: "short", year: "numeric" });
|
||||
}
|
||||
|
||||
function fmt(n: number) {
|
||||
return new Intl.NumberFormat("en-AU", { style: "currency", currency: "AUD", maximumFractionDigits: 0 }).format(n);
|
||||
}
|
||||
@@ -41,10 +53,13 @@ const FREQ_LABEL: Record<string, string> = {
|
||||
};
|
||||
|
||||
// ─── Section wrapper ────────────────────────────────────────────────
|
||||
function Section({ title, children }: { title: string; children: React.ReactNode }) {
|
||||
function Section({ title, aside, children }: { title: string; aside?: React.ReactNode; children: React.ReactNode }) {
|
||||
return (
|
||||
<div className="mb-8">
|
||||
<h3 className="text-base font-semibold text-zinc-200 mb-3">{title}</h3>
|
||||
<div className="flex flex-wrap items-baseline justify-between gap-x-4 gap-y-1 mb-3">
|
||||
<h3 className="text-base font-semibold text-zinc-200">{title}</h3>
|
||||
{aside}
|
||||
</div>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
@@ -298,7 +313,8 @@ export default function InsightsPage() {
|
||||
const { data: analytics } = useMonthlyAnalytics(12);
|
||||
const { data: analytics6 } = useMonthlyAnalytics(6);
|
||||
const { data: subData } = useSubscriptions();
|
||||
const { data: feesData } = useFees();
|
||||
const [feeMonths, setFeeMonths] = useState(12);
|
||||
const { data: feesData } = useFees(feeMonths);
|
||||
|
||||
// Build regular/occasional chart data
|
||||
const chartData = useMemo(() => {
|
||||
@@ -431,11 +447,38 @@ export default function InsightsPage() {
|
||||
</Section>
|
||||
|
||||
{/* ── 4. Fees & Interest ── */}
|
||||
<Section title="Fees & interest">
|
||||
<Section
|
||||
title="Fees & interest"
|
||||
aside={
|
||||
<div className="flex items-center gap-3">
|
||||
{feesData?.period && (
|
||||
<span className="text-xs text-zinc-500 tabular-nums">
|
||||
{feesData.period.all_time
|
||||
? "All time"
|
||||
: `${formatPeriodBound(feesData.period.from)} – ${formatPeriodBound(feesData.period.to, true)}`}
|
||||
</span>
|
||||
)}
|
||||
<select
|
||||
value={feeMonths}
|
||||
onChange={(e) => setFeeMonths(Number(e.target.value))}
|
||||
className="bg-zinc-900 border border-zinc-800 rounded px-2 py-1 text-xs text-zinc-300 focus:outline-none focus:border-indigo-500 cursor-pointer"
|
||||
aria-label="Fees period"
|
||||
>
|
||||
<option value={3}>Last 3 months</option>
|
||||
<option value={6}>Last 6 months</option>
|
||||
<option value={12}>Last 12 months</option>
|
||||
<option value={24}>Last 24 months</option>
|
||||
<option value={0}>All time</option>
|
||||
</select>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
{!feesData ? (
|
||||
<p className="text-zinc-500 text-sm">Loading...</p>
|
||||
) : feesData.by_bank.length === 0 && feesData.transactions.length === 0 ? (
|
||||
<p className="text-zinc-500 text-sm">No fees or interest recorded across your statements.</p>
|
||||
<p className="text-zinc-500 text-sm">
|
||||
No fees or interest recorded {feesData.period?.all_time ? "on any statement" : "in this period"}.
|
||||
</p>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
{feesData.by_bank.length > 0 && (
|
||||
|
||||
Reference in New Issue
Block a user