Locale Configuration

import { useDateFormatter } from '@/hooks/useDateFormatter';
 
function OrderDates({ order }) {
  const { formatDate, formatRelative, formatCalendar } = useDateFormatter();
  
  return (
    <div>
      {/* Short date: locale-specific */}
      <p>Created: {formatDate(order.createdAt, 'date.short')}</p>
      {/* en-US: 12/31/2024, en-GB: 31/12/2024, de-DE: 31.12.2024 */}
      
      {/* Medium date with month name */}
      <p>Due: {formatDate(order.dueDate, 'date.medium')}</p>
      {/* Dec 31, 2024 */}
      
      {/* Long date with full month */}
      <p>Completed: {formatDate(order.completedAt, 'date.long')}</p>
      {/* December 31, 2024 */}
      
      {/* Relative time */}
      <p>Updated: {formatRelative(order.updatedAt)}</p>
      {/* 2 days ago */}
      
      {/* Calendar format */}
      <p>Next action: {formatCalendar(order.nextAction)}</p>
      {/* Tomorrow at 3:30 PM */}
    </div>
  );
}

1,23,456.78       (instead of 123,456.78)
12,34,567.89      (1.2 million = 12.3 lakhs)
1,23,45,678.90    (12.3 million = 1.2 crores)

١٬٢٣٤٫٥٦  (1,234.56 in Arabic numerals)

Street Address
Apartment, suite, etc. (optional)
City                    State       ZIP Code
                                    12345 or 12345-6789

Street Address
Apartment, flat, etc. (optional)
City
County (optional)
Postcode                            SW1A 1AA

〒 Postal Code                      123-4567
Prefecture
City
Street Address, Building

Straße und Hausnummer
Adresszusatz (optional)
PLZ             Stadt               10115 Berlin

import i18n from '@/util/i18n';
 
// US ZIP codes
i18n.validatePostalCode('12345', 'US');      // true
i18n.validatePostalCode('12345-6789', 'US'); // true
i18n.validatePostalCode('1234', 'US');       // false
 
// UK postcodes
i18n.validatePostalCode('SW1A 1AA', 'GB');   // true
i18n.validatePostalCode('M1 1AA', 'GB');     // true
 
// Canadian postal codes
i18n.validatePostalCode('K1A 0B1', 'CA');    // true
 
// German PLZ
i18n.validatePostalCode('10115', 'DE');      // true
 
// Japanese postal codes
i18n.validatePostalCode('100-0001', 'JP');   // true

import i18n from '@/util/i18n';
 
const config = i18n.getPostalCodeConfig('GB');
// {
//   pattern: /^[A-Z]{1,2}\d{1,2}[A-Z]?\s?\d[A-Z]{2}$/i,
//   placeholder: 'SW1A 1AA',
//   label: 'Postcode',
//   maxLength: 8
// }

import i18n from '@/util/i18n';
 
// Format phone numbers
i18n.formatPhoneNumber('5551234567', 'US');
// "(555) 123-4567"
 
i18n.formatPhoneNumber('2071234567', 'GB');
// "+44 20 7123 4567"
 
// Validate phone numbers
i18n.validatePhoneNumber('(555) 123-4567', 'US'); // true
i18n.validatePhoneNumber('020 7123 4567', 'GB');  // true

import i18n from '@/util/i18n';
 
i18n.getTaxLabel('US');  // "Sales Tax"
i18n.getTaxLabel('GB');  // "VAT"
i18n.getTaxLabel('CA');  // "GST/PST"
i18n.getTaxLabel('AU');  // "GST"
i18n.getTaxLabel('DE');  // "VAT" (all EU countries)

import i18n from '@/util/i18n';
 
i18n.getMeasurementUnits('US');
// { system: 'imperial', length: 'inch', weight: 'lb' }
 
i18n.getMeasurementUnits('GB');
// { system: 'mixed', length: 'mm', weight: 'kg' }
 
i18n.getMeasurementUnits('CA');
// { system: 'metric', length: 'cm', weight: 'kg' }

import i18n from '@/util/i18n';
 
i18n.getCompanyRegLabel('US');  // "EIN"
i18n.getCompanyRegLabel('GB');  // "Company Number"
i18n.getCompanyRegLabel('CA');  // "Business Number"
i18n.getCompanyRegLabel('AU');  // "ABN"

import { getLocaleFromCountry } from '@/util/locale-map';
 
getLocaleFromCountry('US');  // 'en-US'
getLocaleFromCountry('GB');  // 'en-GB'
getLocaleFromCountry('DE');  // 'de-DE'
getLocaleFromCountry('FR');  // 'fr-FR'
getLocaleFromCountry('JP');  // 'ja-JP'
getLocaleFromCountry('CN');  // 'zh-CN'
getLocaleFromCountry('NZ');  // 'en-AU' (closest supported)
getLocaleFromCountry('SG');  // 'en-GB' (closest supported)

import { useDateFormatter } from '@/hooks/useDateFormatter';
 
function DateDemo() {
  const {
    formatDate,        // Format date with pattern
    formatDateCustom,  // Format with custom pattern
    formatRelative,    // "2 days ago"
    formatCalendar,    // "Yesterday at 3:30 PM"
    formatDuration,    // Calculate duration between dates
    startOfDay,        // Get start of day
    endOfDay,          // Get end of day
    startOfMonth,      // Get start of month
    endOfMonth,        // Get end of month
    isSameDay,         // Compare dates
    isAfter,           // Date comparison
    isBefore,          // Date comparison
    addDays,           // Add days to date
    subtractDays,      // Subtract days from date
    locale,            // Current moment locale code
    localeLoaded,      // Whether locale is loaded
    getMomentInstance, // Get locale-aware moment factory
  } = useDateFormatter();
  
  // Use these utilities throughout your component
}

// Only the required locale is loaded at runtime
// English is always available (default)
// Other locales are loaded via dynamic import
 
useEffect(() => {
  if (momentLocale !== 'en' && !loadedLocales.has(momentLocale)) {
    import(`moment/locale/${momentLocale}`).then(() => {
      loadedLocales.add(momentLocale);
    });
  }
}, [momentLocale]);

// ✓ Good: Use hooks
const { formatDate } = useDateFormatter();
return <span>{formatDate(date, 'date.short')}</span>;
 
// ✗ Bad: Manual formatting
return <span>{date.toLocaleDateString()}</span>;

// ✓ Good: ISO format in database
createdAt: '2024-12-31T15:30:00Z'
 
// Format for display only
{formatDate(order.createdAt, 'dateTime.short')}

const locale = company?.default_locale || 'en-US';
const currency = company?.currency || 'USD';