@W-21416242 translations fro 1CC

packages/template-retail-react-app/CHANGELOG.md

@@ -4,6 +4,7 @@
 - [Bugfix] Fix error toast for no applicable shipping methods in one-click checkout [#3673](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3673)
 - [Feature] Subscribe to marketing communications. Email capture component updated in footer section to use Shopper Consents API. [#3674](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3674)
 - [Bugfix] Fix for custom billing address as returning shoppers in 1CC [#3693](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3693)
+- [Feature] Add translations for text in 1CC [#3703](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3703)
 
 ## v9.0.0 (Feb 12, 2026)
 - [Feature] One Click Checkout (in Developer Preview) [#3552](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3552)

packages/template-retail-react-app/app/components/order-summary/index.jsx

@@ -259,7 +259,10 @@ const OrderSummary = ({
                             </Text>
                         ) : (
                             <Text fontSize={fontSize} color="gray.700">
-                                TBD
+                                <FormattedMessage
+                                    defaultMessage="TBD"
+                                    id="order_summary.label.tax_tbd"
+                                />
                             </Text>
                         )}
                     </Flex>

packages/template-retail-react-app/app/pages/account/partials/account-payment-form.jsx

@@ -7,6 +7,7 @@
 
 import React from 'react'
 import PropTypes from 'prop-types'
+import {FormattedMessage} from 'react-intl'
 import {Box, Stack} from '@salesforce/retail-react-app/app/components/shared/ui'
 import CreditCardFields from '@salesforce/retail-react-app/app/components/forms/credit-card-fields'
 import Field from '@salesforce/retail-react-app/app/components/field'
@@ -25,7 +26,12 @@ const AccountPaymentForm = ({form, onSubmit, children}) => {
                         <CreditCardFields form={form} />
                         <Field
                             name="default"
-                            label="Set as default"
+                            label={
+                                <FormattedMessage
+                                    defaultMessage="Set as default"
+                                    id="account.payments.checkbox.make_default"
+                                />
+                            }
                             type="checkbox"
                             defaultValue={false}
                             control={form.control}

packages/template-retail-react-app/app/pages/account/payments.jsx

@@ -443,8 +443,14 @@ const AccountPayments = () => {
                                         </Text>
                                         <Text color="gray.600">{payment.paymentCard?.holder}</Text>
                                         <Text color="gray.600">
-                                            Expires {payment.paymentCard?.expirationMonth}/
-                                            {payment.paymentCard?.expirationYear}
+                                            <FormattedMessage
+                                                defaultMessage="Expires {month}/{year}"
+                                                id="account.payments.label.expires"
+                                                values={{
+                                                    month: payment.paymentCard?.expirationMonth,
+                                                    year: payment.paymentCard?.expirationYear
+                                                }}
+                                            />
                                         </Text>
                                     </Stack>
                                 </Stack>

packages/template-retail-react-app/app/pages/checkout-one-click/partials/one-click-contact-info.jsx

@@ -169,12 +169,22 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG
 
         // Validate email format
         if (!email) {
-            setEmailError('Please enter your email address.')
+            setEmailError(
+                formatMessage({
+                    defaultMessage: 'Please enter your email address.',
+                    id: 'use_login_fields.error.required_email'
+                })
+            )
             return
         }
 
         if (!isValidEmail(email)) {
-            setEmailError('Please enter a valid email address.')
+            setEmailError(
+                formatMessage({
+                    defaultMessage: 'Please enter a valid email address.',
+                    id: 'use_login_fields.error.invalid_email'
+                })
+            )
             return
         }
 
@@ -424,13 +434,23 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG
 
         // Validate email before proceeding
         if (!formData.email) {
-            setError('Please enter your email address.')
+            setError(
+                formatMessage({
+                    defaultMessage: 'Please enter your email address.',
+                    id: 'use_login_fields.error.required_email'
+                })
+            )
             setIsSubmitting(false) // Reset submitting state on validation error
             return
         }
 
         if (!isValidEmail(formData.email)) {
-            setError('Please enter a valid email address.')
+            setError(
+                formatMessage({
+                    defaultMessage: 'Please enter a valid email address.',
+                    id: 'use_login_fields.error.invalid_email'
+                })
+            )
             setIsSubmitting(false) // Reset submitting state on validation error
             return
         }
@@ -502,7 +522,12 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG
 
                     return
                 } catch (error) {
-                    setError('An error occurred. Please try again.')
+                    setError(
+                        formatMessage({
+                            defaultMessage: 'An error occurred. Please try again.',
+                            id: 'contact_info.error.generic_try_again'
+                        })
+                    )
                     // Show continue button again if there's an error
                     setShowContinueButton(true)
                     setIsSubmitting(false)
@@ -511,7 +536,12 @@ const ContactInfo = ({isSocialEnabled = false, idps = [], onRegisteredUserChoseG
             }
             // If user is registered, OTP modal should be open, don't proceed to next step
         } catch (error) {
-            setError('An error occurred. Please try again.')
+            setError(
+                formatMessage({
+                    defaultMessage: 'An error occurred. Please try again.',
+                    id: 'contact_info.error.generic_try_again'
+                })
+            )
         } finally {
             // Only reset submitting state for registered users (when OTP modal is open)
             // Guest users will have already returned above