refactor: update currency formatting to respect currency precision

[pbennett1-godaddy]

Summary

Update Currency Formatting to Respect Currency Precision

Summary

Replaces hardcoded currency conversions (/ 100, * 100) and Intl.NumberFormat usages with a centralized formatCurrency utility function that respects each currency's precision configuration. This
enables proper support for currencies with different decimal places (e.g., USD with 2 decimals, VND with 0 decimals, etc.).

Key Improvements

1. Centralized Currency Logic
   - Created new formatCurrency utility function with support for 31+ currencies
   - Each currency has its own precision configuration (USD: 2, VND: 0, CLP: 0, etc.)
   - Eliminates hardcoded assumptions about decimal places
2. Eliminated Hardcoded Conversions
   - Removed all / 100 and * 100 hardcoded conversions throughout the codebase
   - Currency conversions now respect currency-specific precision via formatCurrency
3. Consistent Currency Handling
   - All monetary values from the API remain in cents (minor units)
   - Conversions happen at display/formatting time using formatCurrency
   - Ensures consistency between express checkout, payment forms, and totals display
4. Fixed Currency Display Issues
   - Fixed Apple Pay/Google Pay amounts showing incorrect values
   - Fixed express checkout totals calculation errors
   - Properly handles currency formatting in all payment provider integrations

Files Changed

New Files:

• src/components/checkout/utils/format-currency.ts - New centralized currency utility

Updated Files:

• src/components/checkout/payment/checkout-buttons/express/godaddy.tsx - Updated express checkout currency handling
• src/components/checkout/payment/utils/use-build-payment-request.ts - Fixed payment request builder conversions
• src/components/checkout/utils/checkout-transformers.ts - Keep prices in cents, convert at display time
• src/components/checkout/totals/totals.tsx - Use formatCurrency for display
• src/components/checkout/form/checkout-form.tsx - Updated currency handling
• src/components/checkout/line-items/line-items.tsx - Updated line item display
• src/components/checkout/shipping/shipping-method.tsx - Updated shipping cost display
• src/components/checkout/tips/tips-form.tsx - Updated tip amount formatting
• src/components/checkout/payment/payment-form.tsx - Updated payment display

How to Test

1. Test Standard Checkout Flow

Start the dev server

npm run dev

• Navigate to checkout page
• Add items to cart
• Verify all amounts display correctly:
  • Subtotal
  • Shipping costs
  • Taxes
  • Discounts
  • Total
• Complete checkout and verify amounts match throughout

2. Test Express Checkout (Apple Pay/Google Pay)

• Open checkout in Safari (for Apple Pay) or Chrome (for Google Pay)
• Click express checkout button
• Verify amounts shown in wallet match checkout page
• Change shipping address/method and verify totals update correctly
• Apply discount code and verify discount amount is correct
• Complete payment and verify final amount is correct

3. Test Different Currencies (if multi-currency enabled)

• Switch to different currencies (USD, VND, CLP, EUR, etc.)
• Verify amounts format correctly with proper decimal places:
  • USD: $28.28 (2 decimals)
  • VND: ₫28 (0 decimals)
  • CLP: $28 (0 decimals)

4. Test Shipping Methods

• Enable shipping on checkout session
• Add shipping address
• Verify shipping methods display with correct prices
• Select different shipping methods and verify totals update

5. Test Discount Codes

• Apply discount code
• Verify discount amount displays correctly
• In express checkout, verify discount applies correctly to wallet total
• Remove discount and verify amounts revert correctly

Expected Behavior

• All currency amounts should display with correct precision for the currency
• Totals should always calculate correctly (no $2,503.28 instead of $28.28 issues)
• Express checkout wallet amounts should match checkout page amounts
• Currency conversions should be handled automatically based on currency code

---

Changeset

• Changeset added (docs)

Test Plan

[changeset-bot]

🦋 Changeset detected

Latest commit: b320afd

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@godaddy/react	Patch
nextjs	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR