Provide multiple locales and currencies

adyen/context/adyen-checkout-context.js

@@ -3,13 +3,15 @@ import PropTypes from 'prop-types'
 import {useAccessToken, useCustomerId} from '@salesforce/commerce-sdk-react'
 import {AdyenSessionsService} from '../services/sessions'
 import {useCurrentBasket} from '@salesforce/retail-react-app/app/hooks/use-current-basket'
+import { resolveLocaleFromUrl } from "@salesforce/retail-react-app/app/utils/site-utils";
 
 const AdyenCheckoutContext = React.createContext()
 
 export const AdyenCheckoutProvider = ({children}) => {
     const {data: basket} = useCurrentBasket()
     const {getTokenWhenReady} = useAccessToken()
     const customerId = useCustomerId()
+    const locale = resolveLocaleFromUrl(`${window.location.pathname}${window.location.search}`)
 
     const [adyenSession, setAdyenSession] = useState()
     const [adyenStateData, setAdyenStateData] = useState()
@@ -19,7 +21,7 @@ export const AdyenCheckoutProvider = ({children}) => {
             const token = await getTokenWhenReady()
             const adyenSessionsService = new AdyenSessionsService(token)
             try {
-                const data = await adyenSessionsService.createSession(customerId)
+                const data = await adyenSessionsService.createSession(customerId, locale)
                 setAdyenSession(data?.length ? data[0] : {error: true})
             } catch (error) {
                 setAdyenSession({error})

adyen/controllers/sessions.js

@@ -48,6 +48,7 @@ async function create(req, res) {
         })
 
         const response = await checkout.sessions({
+            shopperLocale: req.body?.locale?.id,
             countryCode: countryCode,
             amount: {
                 value: getCurrencyValueForApi(orderTotal, currency),

adyen/services/api.js

@@ -10,6 +10,7 @@ export class ApiClient {
     base(method, options) {
         return fetch(this.url, {
             method: method,
+            body: options?.body || null,
             headers: {
                 'Content-Type': 'application/json',
                 authorization: `Bearer ${this.token}`,

adyen/services/sessions.js

@@ -8,8 +8,11 @@ export class AdyenSessionsService {
         this.apiClient = new ApiClient(this.baseUrl, token)
     }
 
-    async createSession(customerId) {
+    async createSession(customerId, locale) {
         const res = await this.apiClient.post({
+            body: JSON.stringify({
+                locale
+            }),
             headers: {
                 customerid: customerId
             }

config/default.js

@@ -15,7 +15,7 @@ module.exports = {
             // Determine where the siteRef is located. Valid values include 'path|query_param|none'. Defaults to: 'none'
             // site: 'none',
             // Determine where the localeRef is located. Valid values include 'path|query_param|none'. Defaults to: 'none'
-            locale: 'none'
+            locale: 'query_param'
             // This boolean value dictates whether or not default site or locale values are shown in the url. Defaults to: false
             // showDefaults: true
         },

config/sites.js

@@ -11,14 +11,25 @@ module.exports = [
     {
         id: 'RefArch',
         l10n: {
-            supportedCurrencies: ['USD'],
+            supportedCurrencies: ['USD', 'EUR', 'BRL', 'JPY'],
             defaultCurrency: 'USD',
             defaultLocale: 'en-US',
             supportedLocales: [
                 {
                     id: 'en-US',
-                    // alias: 'us',
                     preferredCurrency: 'USD'
+                },
+                {
+                    id: 'fr-FR',
+                    preferredCurrency: 'EUR'
+                },
+                {
+                    id: 'pt-BR',
+                    preferredCurrency: 'BRL'
+                },
+                {
+                    id: 'ja-JP',
+                    preferredCurrency: 'JPY'
                 }
             ]
         }