feat: every page follows the one-currency mode

Totals, info boxes, section headers, group subtotals, shares and the
per-currency charts on the dashboard, transactions, search, accounts,
merchants, statement, budgets, categories, tags, groups, piggy banks,
reports and the category, tag, budget and merchant pages sum into one
converted amount when the mode is on; charts split by currency merge
into one lane. Inputs, reconciliation and the Foreign column stay exact.

Money moved to or from a debt, loan or mortgage no longer counts as
income or spending in the transaction list boxes; it shows as From
debts and To debts. The running balance of an incoming foreign-currency
transfer shows in the account's currency.

src/lib/components/reports/AccountBalances.svelte

@@ -1,7 +1,9 @@
 <script lang="ts">
   import { createQuery } from "@tanstack/svelte-query";
+  import { displayCode, inDisplay } from "#lib/reports/display.js";
   import { reportQueries } from "#lib/reports/queries.js";
   import {
+    displayMoney,
     drillQuery,
     money,
     navigate,
@@ -34,12 +36,15 @@
       .sort((a, b) => a.name.localeCompare(b.name));
   });
   const sums = $derived.by(() => {
+    const into = displayCode(new Set(rows.map((row) => row.code)));
     const map = new Map<string, { start: number; end: number }>();
     for (const row of rows) {
-      const sum = map.get(row.code) ?? { end: 0, start: 0 };
-      sum.start += row.start;
-      sum.end += row.end;
-      map.set(row.code, sum);
+      const start = inDisplay(row.start, row.code, into);
+      const end = inDisplay(row.end, row.code, into);
+      const sum = map.get(start.code) ?? { end: 0, start: 0 };
+      sum.start += start.amount;
+      sum.end += end.amount;
+      map.set(start.code, sum);
     }
     const order = report.codes;
     return [...map.entries()].sort(
@@ -106,10 +111,14 @@
                 {row.name}
               </button>
             </td>
-            <td class="num px-3 text-right">{money(row.code, row.start)}</td>
-            <td class="num px-3 text-right">{money(row.code, row.end)}</td>
+            <td class="num px-3 text-right">
+              {displayMoney(row.code, row.start)}
+            </td>
+            <td class="num px-3 text-right">
+              {displayMoney(row.code, row.end)}
+            </td>
             <td class="num px-3 text-right {tone(row.end - row.start)}">
-              {money(row.code, row.end - row.start, true)}
+              {displayMoney(row.code, row.end - row.start, true)}
             </td>
           </tr>
         {/each}

src/lib/components/reports/BalanceLines.svelte

@@ -4,6 +4,7 @@
   import LineChart from "#lib/components/charts/LineChart.svelte";
   import { contains, today } from "#lib/dates.js";
   import { formatDate } from "#lib/format.js";
+  import { displayCode, inDisplay, shownCode } from "#lib/reports/display.js";
   import { reportQueries } from "#lib/reports/queries.js";
   import { money, useReport } from "#lib/reports/report.svelte.js";
   import { modeAxis } from "#lib/reports/view.js";
@@ -31,11 +32,16 @@
 
   const charts = $derived.by(() => {
     const byCode = new Map<string, LineSeries[]>();
-    for (const set of chart.data ?? []) {
-      const code = set.currency_code ?? "";
+    const sets = chart.data ?? [];
+    const into = displayCode(
+      new Set(sets.map((set) => set.currency_code ?? ""))
+    );
+    for (const set of sets) {
+      const from = set.currency_code ?? "";
+      const code = shownCode(from, into);
       const points = Object.entries(set.entries ?? {}).map(([x, y]) => ({
         x: x.slice(0, 10),
-        y: Number(y),
+        y: inDisplay(Number(y), from, into).amount,
       }));
       const list = byCode.get(code) ?? [];
       if (net && list.length > 0) {

src/lib/components/reports/Board.svelte

@@ -18,6 +18,7 @@
     shiftMonth,
     spendingLanes,
   } from "#lib/reports/board.js";
+  import { displayCode, displayFlows } from "#lib/reports/display.js";
   import { exchanges } from "#lib/reports/flows.js";
   import { ledgerQuery, ledgerWindow, ownFlows } from "#lib/reports/ledger.js";
   import { ALL_ASSETS, type ReportParams, ymd } from "#lib/reports/params.js";
@@ -77,15 +78,20 @@
     start: range.start,
     type: "default",
   });
+  const mine = $derived(
+    ledger.data && own ? ownFlows(ledger.data, own) : undefined
+  );
+  const into = $derived(
+    mine ? displayCode(new Set(mine.map((flow) => flow.currency))) : null
+  );
   const report = createReport(
     () => params,
-    () => ledger.data
+    () => ledger.data,
+    () => into
   );
   provideReport(report);
 
-  const flows = $derived(
-    ledger.data && own ? ownFlows(ledger.data, own) : undefined
-  );
+  const flows = $derived(mine && displayFlows(mine, into));
   const board = $derived(
     flows ? buildBoard(flows, span.months, year, report.codes, now) : undefined
   );

src/lib/components/reports/BudgetLimits.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { createQuery } from "@tanstack/svelte-query";
   import { formatRange, percent } from "#lib/format.js";
+  import { inDisplay } from "#lib/reports/display.js";
   import { NONE } from "#lib/reports/flows.js";
   import { reportQueries } from "#lib/reports/queries.js";
   import {
@@ -36,32 +37,43 @@
     const withdrawals = flows.filter(
       (f) => f.dir === -1 && f.type === "withdrawal"
     );
-    const result: Line[] = limits.data.map((item) => {
+    const merged = new Map<string, Line>();
+    for (const item of limits.data) {
       const a = item.attributes;
       const start = (a.start ?? p.start).slice(0, 10);
       const end = (a.end ?? p.end).slice(0, 10);
-      const code = a.currency_code ?? "";
-      const spent = withdrawals
-        .filter(
-          (f) =>
-            f.budget?.id === String(a.budget_id) &&
-            f.currency === code &&
-            f.date >= start &&
-            f.date <= end
-        )
-        .reduce((sum, f) => sum + f.amount, 0);
-      return {
-        budgeted: Number(a.amount ?? 0),
+      const { amount, code } = inDisplay(
+        Number(a.amount ?? 0),
+        a.currency_code ?? "",
+        report.into
+      );
+      const key = [a.budget_id, start, end, code].join("|");
+      const found = merged.get(key);
+      if (found) {
+        found.budgeted = (found.budgeted ?? 0) + amount;
+        continue;
+      }
+      merged.set(key, {
+        budgeted: amount,
         budgetId: String(a.budget_id),
         code,
         end,
         key: item.id,
         name:
           report.itemName("budget", String(a.budget_id)) ?? `#${a.budget_id}`,
-        spent,
+        spent: withdrawals
+          .filter(
+            (f) =>
+              f.budget?.id === String(a.budget_id) &&
+              f.currency === code &&
+              f.date >= start &&
+              f.date <= end
+          )
+          .reduce((sum, f) => sum + f.amount, 0),
         start,
-      };
-    });
+      });
+    }
+    const result = [...merged.values()];
     result.sort(
       (a, b) => a.name.localeCompare(b.name) || a.start.localeCompare(b.start)
     );

src/lib/components/reports/IncomeVsExpenses.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import { createQuery } from "@tanstack/svelte-query";
   import { formatRange } from "#lib/format.js";
+  import { displayFlows } from "#lib/reports/display.js";
   import {
     currencies,
     measureOf,
@@ -28,10 +29,13 @@
   const before = $derived(
     earlier.data && report.accountsReady
       ? total(
-          toFlows(
-            earlier.data,
-            new Set(report.selected),
-            (id) => report.byId().get(id)?.currency_code
+          displayFlows(
+            toFlows(
+              earlier.data,
+              new Set(report.selected),
+              (id) => report.byId().get(id)?.currency_code
+            ),
+            report.into
           )
         )
       : undefined

src/lib/components/reports/NetWorthLanes.svelte

@@ -4,7 +4,9 @@
   import type { Lane } from "#lib/components/charts/chart.js";
   import Lanes from "#lib/components/charts/Lanes.svelte";
   import { addDays, periodOf, today } from "#lib/dates.js";
+  import { mergeLanes } from "#lib/money/lanes.js";
   import { longMonth, monthOf, shortMonth } from "#lib/reports/board.js";
+  import { plainCode } from "#lib/reports/display.js";
   import { buckets } from "#lib/reports/flows.js";
   import { reportQueries } from "#lib/reports/queries.js";
   import { impliedRates } from "#lib/reports/rates.js";
@@ -71,7 +73,7 @@
   }
 
   const rate = $derived(impliedRates(groups));
-  const primary = $derived(report.codes[0] ?? "");
+  const primary = $derived(plainCode(report.codes[0] ?? ""));
 
   const measured = $derived(
     [...totals.entries()]
@@ -92,33 +94,34 @@
   const share = (weight: number | null) =>
     weight === null || total === 0 ? null : weight / total;
 
-  const lanes = $derived<Lane[]>(
-    measured
-      .filter((m) => (share(m.weight) ?? 1) >= MIN_SHARE)
-      .map((m) => ({
-        axisFormat: modeAxis(m.code),
-        format: (value: number) => money(m.code, value, false, 0),
-        height: Math.max(
-          MIN_HEIGHT,
-          Math.round((share(m.weight) ?? 1 / measured.length) * HEIGHT_BUDGET)
+  const all = $derived<Lane[]>(
+    measured.map((m) => ({
+      axisFormat: modeAxis(m.code),
+      format: (value: number) => money(m.code, value, false, 0),
+      height: Math.max(
+        MIN_HEIGHT,
+        Math.round((share(m.weight) ?? 1 / measured.length) * HEIGHT_BUDGET)
+      ),
+      key: m.code,
+      keys: [{ color: "var(--ff-series-1)", key: "value", label: "Net worth" }],
+      label: m.code,
+      rows: months.map((month, i) => ({
+        key: month,
+        label: shortMonth(month),
+        values: Object.fromEntries(
+          m.values[i] === undefined ? [] : [["value", m.values[i]]]
         ),
-        key: m.code,
-        keys: [
-          { color: "var(--ff-series-1)", key: "value", label: "Net worth" },
-        ],
-        label: m.code,
-        rows: months.map((month, i) => ({
-          key: month,
-          label: shortMonth(month),
-          values: Object.fromEntries(
-            m.values[i] === undefined ? [] : [["value", m.values[i]]]
-          ),
-        })),
-      }))
+      })),
+    }))
   );
-  const small = $derived(
-    measured.filter((m) => (share(m.weight) ?? 1) < MIN_SHARE)
+  const merged = $derived(mergeLanes(all));
+  const joined = $derived(merged !== all);
+  const big = (m: (typeof measured)[number]) =>
+    (share(m.weight) ?? 1) >= MIN_SHARE;
+  const lanes = $derived(
+    joined ? merged : all.filter((_, i) => big(measured[i]))
   );
+  const small = $derived(joined ? [] : measured.filter((m) => !big(m)));
 </script>
 
 <ReportBox

src/lib/components/reports/Subscriptions.svelte

@@ -4,7 +4,7 @@
   import { formatDate } from "#lib/format.js";
   import { expectedDates } from "#lib/reports/bills.js";
   import { reportQueries } from "#lib/reports/queries.js";
-  import { money, useReport } from "#lib/reports/report.svelte.js";
+  import { displayMoney, useReport } from "#lib/reports/report.svelte.js";
   import ReportBox from "./ReportBox.svelte";
 
   const report = useReport();
@@ -59,10 +59,10 @@
               >
             </td>
             <td class="num px-3 py-1 text-right">
-              {money(code, Number(row.a.amount_min ?? 0))}
+              {displayMoney(code, Number(row.a.amount_min ?? 0))}
             </td>
             <td class="num px-3 py-1 text-right">
-              {money(code, Number(row.a.amount_max ?? 0))}
+              {displayMoney(code, Number(row.a.amount_max ?? 0))}
             </td>
             <td class="num px-3 py-1 text-cladd-fg-soft">
               {row.expected.map((d) => formatDate(d, "short")).join(", ")}
@@ -76,7 +76,7 @@
                     >{formatDate(paid.date, "short")}</a
                   >
                   <span class="num text-expense"
-                    >{money(
+                    >{displayMoney(
                       paid.currency_code ?? code,
                       -Number(paid.amount ?? 0)
                     )}</span