# Numeric fees in consistent format

- **Pattern:** `ab-001411` (`finserv-disclosure.presentation-quality.fee-format`)
- **Severity:** low
- **Lifecycle:** active
- **Last modified:** 2026-04-18
- **Canonical URL:** https://auditbuffet.com/patterns/ab-001411
- **License:** CC-BY-4.0 — attribute to AuditBuffet Pattern Catalog (https://auditbuffet.com/patterns/ab-001411)

## Why it matters

Mixed fee formats — `$0.50` on pricing, `.5 USD` at checkout, `0.50` on statements — make users second-guess the amount and erode trust at the exact moments they are deciding whether to pay. Inconsistent decimal precision is also a reconciliation hazard: a fee rendered `$10` on the pricing page and `$10.00` on the invoice looks fine to humans but breaks downstream CSV parsers and accounting imports. The content-integrity taxon captures both the user-facing confusion and the data-quality drift across surfaces.

## Severity rationale

Low because the dollar amounts themselves are correct, but the inconsistency costs trust and breaks downstream parsers.

## Remediation

Centralize every fee render through a single `Intl.NumberFormat` helper so currency symbol, decimals, and thousands separators are locked site-wide. Create `src/lib/formatters.ts` and import it anywhere money is displayed:

```ts
export function formatFee(amount: number, currency = 'USD') {
  return new Intl.NumberFormat('en-US', {
    style: 'currency',
    currency,
    minimumFractionDigits: 2,
  }).format(amount);
}
```

Then grep the repo for `$` and `.toFixed(` and replace each with `formatFee()`.

## Detection

- **ID:** `fee-format`
- **Severity:** `low`
- **What to look for:** List all pages where monetary amounts or fees are displayed. For each page, extract and quote the exact format used (e.g., "$9.99", "9.99 USD", "$9.99 USD"). Check for consistency across all pages: currency symbol position, number of decimal places (must always be 2 for currency), and thousands separator usage.
- **Pass criteria:** 100% of fee displays across all pages use the same formatting pattern (same currency symbol position, always 2 decimal places, consistent thousands separator). A shared formatting utility (e.g., `Intl.NumberFormat` or a custom `formatFee` function in `lib/formatters.ts`) is used site-wide, or all hardcoded values follow the same pattern. Report the count: "X fee displays checked across Y pages, all consistent."
- **Fail criteria:** Any 2 pages display the same fee in different formats (e.g., `$0.50` vs `.50` vs `$0.5` vs `fifty cents`), or decimal places are inconsistent (e.g., `$10` vs `$10.00`).
- **Skip (N/A) when:** The project displays no numeric fees or monetary amounts.
- **Detail on fail:** Quote the inconsistent formats and their file paths. Example: `"Pricing page (app/pricing/page.tsx) shows '$0.50' but checkout (app/checkout/page.tsx) shows '.5 USD'. Statements use '0.50' without currency symbol. 3 different formats found."`
- **Remediation:** Create a consistent fee formatting helper in `src/lib/formatters.ts` and use it everywhere:

  ```tsx
  // lib/formatters.ts
  export function formatFee(amount: number, currency = 'USD'): string {
    const formatter = new Intl.NumberFormat('en-US', {
      style: 'currency',
      currency,
      minimumFractionDigits: 2,
    })
    return formatter.format(amount)
  }

  // Usage: formatFee(0.50) => "$0.50"
  // Usage: formatFee(1000) => "$1,000.00"
  ```

Taxons: content-integrity

HTML version: https://auditbuffet.com/patterns/ab-001411