feat(plugin-ecommerce): add locale-aware currency formatting and symbol positioning

[teastudiopl]

This PR introduces automatic, locale-aware currency formatting using the native Intl.NumberFormat API.

It also standardizes currency symbol positions and separators across the frontend, ensuring consistent price display for different currencies in Payload e-commerce.

Changes

1. useCurrency hook

• Added locale support in formatCurrency.
• Replaced manual string formatting with Intl.NumberFormat:

return new Intl.NumberFormat(locale, {
  style: 'currency',
  currency: code,
  minimumFractionDigits: decimals,
  maximumFractionDigits: decimals,
}).format(value / Math.pow(10, decimals))

Automatically handles:

• Decimal separators (. vs ,) depending on locale
• Currency placement (before or after the value)
• Correct number of fraction digits
• Optional locale parameter allows overriding per call (default: 'en')

2. Currency display settings

Standardized symbol placement and separator:

<div className="priceCell">
  {currency.symbolPosition === 'before' ? `<span className="currencySymbol">${currency.symbol}</span>` : ''}
  {currency.symbolPosition === 'before' && currency.symbolSeparator}
  <span className="priceValue">{convertFromBaseValue({ baseValue: cellData, currency })}</span>
  {currency.symbolPosition === 'after' && currency.symbolSeparator}
  {currency.symbolPosition === 'after' ? `<span className="currencySymbol">${currency.symbol}</span>` : ''}
</div>

Ensures correct rendering for currencies that place the symbol before (EUR, USD, GBP) or after (PLN).

3. Predefined currencies

Updated standard currency definitions:

export const EUR: Currency = { code: 'EUR', decimals: 2, label: 'Euro', symbol: '€', symbolPosition: 'before', symbolSeparator: '' }
export const USD: Currency = { code: 'USD', decimals: 2, label: 'US Dollar', symbol: '$', symbolPosition: 'before', symbolSeparator: '' }
export const GBP: Currency = { code: 'GBP', decimals: 2, label: 'British Pound', symbol: '£', symbolPosition: 'before', symbolSeparator: '' }

4. Example: currenciesConfig in Payload

import { EUR as BaseEUR, USD } from '@payloadcms/plugin-ecommerce';
import type { Currency } from '@payloadcms/plugin-ecommerce/types';

const PLN = {
  code: 'PLN',
  decimals: 2,
  label: 'Polski złoty',
  symbol: 'zł',
  symbolPosition: 'after',
  symbolSeparator: ' ',
} satisfies Currency;

export const currenciesConfig = {
  supportedCurrencies: [
    PLN,
    USD,
    BaseEUR,
  ],
  defaultCurrency: 'PLN',
};