feat: redesign weight summary legend and add currency selector

Redesign WeightSummaryCard stats from a disconnected 4-column grid to a
compact legend-style list with color dots, percentages, and a divider
before the total row. Switch chart and legend colors to a neutral gray
palette.

Add a currency selector to settings (USD, EUR, GBP, JPY, CAD, AUD) that
changes the displayed symbol across the app. This is visual only — no
value conversion is performed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-16 20:33:07 +01:00
parent 4cb356d6b0
commit 9647f5759d
14 changed files with 470 additions and 145 deletions

View File

@@ -4,6 +4,7 @@ import { useSetups } from "../hooks/useSetups";
import { useThreads } from "../hooks/useThreads";
import { useTotals } from "../hooks/useTotals";
import { useWeightUnit } from "../hooks/useWeightUnit";
import { useCurrency } from "../hooks/useCurrency";
import { formatPrice, formatWeight } from "../lib/formatters";
export const Route = createFileRoute("/")({
@@ -15,6 +16,7 @@ function DashboardPage() {
const { data: threads } = useThreads(false);
const { data: setups } = useSetups();
const unit = useWeightUnit();
const currency = useCurrency();
const global = totals?.global;
const activeThreadCount = threads?.length ?? 0;
@@ -33,7 +35,7 @@ function DashboardPage() {
label: "Weight",
value: formatWeight(global?.totalWeight ?? null, unit),
},
{ label: "Cost", value: formatPrice(global?.totalCost ?? null) },
{ label: "Cost", value: formatPrice(global?.totalCost ?? null, currency) },
]}
emptyText="Get started"
/>