feat(currency): centralise money formatting + curated currency picker
New `src/lib/utils/currency.ts` is the single source of truth for display formatting (`formatCurrency`) and the supported-currency catalog (`SUPPORTED_CURRENCIES`, 10 codes covering the marina market). New shared components: - `<CurrencyInput>` — number input with leading symbol prefix and decimal inputMode, raw number value out via onChange. - `<CurrencySelect>` — Select dropdown over `SUPPORTED_CURRENCIES` with symbol + code + label per row, replaces the free-text 3-letter inputs that let reps type "EURO" or "$$$" into a 3-char ISO column. Threaded through every money input + display: - Forms: berth (price/currency), expense (amount/currency), invoice (currency Select + line-items unit-price + step-3 review totals). - Reads: berth-card / berth-columns / invoice-card / expense-card / dashboard KPIs / dashboard revenue-forecast / portal-invoices page. Each had its own ad-hoc `Intl.NumberFormat` wrapper with slightly different fallbacks; collapsed onto the shared helper. `InvoiceLineItems` gained a `currency` prop so the unit-price input prefix and the subtotal use the parent invoice's currency rather than hard-coded `en-US` formatting. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -22,6 +22,7 @@ import {
|
||||
} from '@/components/ui/dropdown-menu';
|
||||
import { ListCard, ListCardAvatar, ListCardMeta } from '@/components/shared/list-card';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { formatCurrency } from '@/lib/utils/currency';
|
||||
import type { InvoiceRow } from './invoice-columns';
|
||||
|
||||
const STATUS_COLORS: Record<string, string> = {
|
||||
@@ -48,13 +49,7 @@ const STATUS_ACCENT: Record<string, string> = {
|
||||
cancelled: 'bg-slate-200',
|
||||
};
|
||||
|
||||
function formatAmount(total: string, currency: string): string {
|
||||
try {
|
||||
return new Intl.NumberFormat('en', { style: 'currency', currency }).format(Number(total));
|
||||
} catch {
|
||||
return `${currency} ${total}`;
|
||||
}
|
||||
}
|
||||
const formatAmount = (total: string, currency: string) => formatCurrency(total, currency);
|
||||
|
||||
interface InvoiceCardProps {
|
||||
invoice: InvoiceRow;
|
||||
|
||||
Reference in New Issue
Block a user