I18N-006 recommended Best Practices

Date/time/currency formatting localized

Dates, numbers, and currencies format differently across locales. Use Intl API or locale-aware libraries for formatting.

Question to ask

"What does $1,234.56 look like to a German user?"

Verification guide

Severity: Recommended

Dates, numbers, and currencies format differently across locales:

  • Dates: US (MM/DD/YYYY), Europe (DD/MM/YYYY), Japan (YYYY/MM/DD)
  • Numbers: US (1,000.00), Germany (1.000,00)
  • Currency: Position and symbol vary ($100 vs 100€ vs ¥100)

Check automatically:

# Check for Intl API usage (good sign)
grep -riE "Intl\.(DateTimeFormat|NumberFormat|RelativeTimeFormat)" src/ --include="*.ts" --include="*.tsx" --include="*.js" --include="*.jsx" 2>/dev/null | head -10

# Check for date libraries with locale support
grep -E "date-fns|dayjs|moment|luxon" package.json 2>/dev/null

# Look for locale-aware formatting in date libs
grep -riE "formatDistanceToNow|formatRelative|\.locale\(|\.tz\(" src/ --include="*.ts" --include="*.tsx" --include="*.js" 2>/dev/null | head -10

# Check for i18n library formatting (react-intl, etc.)
grep -riE "FormattedDate|FormattedNumber|FormattedTime|formatDate|formatNumber|formatCurrency" src/ --include="*.ts" --include="*.tsx" 2>/dev/null | head -10

# RED FLAG: Manual date formatting (likely not localized)
grep -riE "toLocaleDateString\(\)|\.toISOString\(\)|MM/DD/YYYY|DD/MM/YYYY" src/ --include="*.ts" --include="*.tsx" 2>/dev/null | head -5

Pass criteria:

  • Date/time formatting uses Intl API or locale-aware library
  • Currency displays use locale-appropriate formatting
  • Timezone handling is explicit (not assumed)

Fail criteria:

  • Hardcoded date formats ("MM/DD/YYYY")
  • Manual currency symbol placement
  • toLocaleDateString() without locale argument (uses system default, inconsistent)

Evidence to capture:

  • Date formatting approach
  • Number/currency formatting approach
  • Libraries in use

Section

42. Internationalization (i18n)

Team & Development