W-21354832 increase bundle size, fix the package.json lock file surgically and other changes (#3704)

amittapalli · web-flow · commit 9a7fc21f48e5 · 2026-03-03T12:25:38.000-05:00
* W-21354832 increase bundle size, fix the package.json lock file surgically for now, add change log

* W-21354832 increase bundle size for vendor,js

* W-21354832 address additional linting errors in handle bars, change log

* W-21354832 add another change log

* fix failing unit tests afte isomorphic bump

* Fix mocks for failing unit tests

* Revert default.js to original state and add only the sfpayments section
diff --git a/packages/commerce-sdk-react/CHANGELOG.md b/packages/commerce-sdk-react/CHANGELOG.md
@@ -1,4 +1,5 @@
 ## v5.1.0-dev
+- Bump commerce-sdk-isomorphic to 5.1.0-unstable-20260226081656
 - Add Node 24 support. Drop Node 16 support. [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)
 
 ## v5.0.0 (Feb 12, 2026)
diff --git a/packages/commerce-sdk-react/package-lock.json b/packages/commerce-sdk-react/package-lock.json
diff --git a/packages/commerce-sdk-react/src/hooks/ShopperBaskets/cache.ts b/packages/commerce-sdk-react/src/hooks/ShopperBaskets/cache.ts
@@ -4,11 +4,7 @@
  * SPDX-License-Identifier: BSD-3-Clause
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
-import {
-    ShopperBasketsTypes,
-    ShopperCustomers,
-    ShopperCustomersTypes
-} from 'commerce-sdk-isomorphic'
+import {ShopperBasketsTypes, ShopperCustomers, ShopperCustomersTypes} from 'commerce-sdk-isomorphic'
 import {
     ApiClients,
     Argument,
diff --git a/packages/commerce-sdk-react/src/hooks/ShopperBasketsV2/cache.ts b/packages/commerce-sdk-react/src/hooks/ShopperBasketsV2/cache.ts
@@ -4,7 +4,11 @@
  * SPDX-License-Identifier: BSD-3-Clause
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
-import {ShopperBasketsV2Types, ShopperCustomers, ShopperCustomersTypes} from 'commerce-sdk-isomorphic'
+import {
+    ShopperBasketsV2Types,
+    ShopperCustomers,
+    ShopperCustomersTypes
+} from 'commerce-sdk-isomorphic'
 import {
     ApiClients,
     Argument,
diff --git a/packages/commerce-sdk-react/src/hooks/ShopperBasketsV2/query.ts b/packages/commerce-sdk-react/src/hooks/ShopperBasketsV2/query.ts
@@ -40,7 +40,10 @@ export const useBasket = (
     // Parameters can be set in `apiOptions` or `client.clientConfig`;
     // we must merge them in order to generate the correct query key.
     const netOptions = omitNullableParameters(mergeOptions(client, apiOptions))
-    const parameters = pickValidParams(netOptions.parameters, ShopperBasketsV2.paramKeys[methodName])
+    const parameters = pickValidParams(
+        netOptions.parameters,
+        ShopperBasketsV2.paramKeys[methodName]
+    )
     const queryKey = queryKeyHelpers[methodName].queryKey(netOptions.parameters)
     // We don't use `netOptions` here because we manipulate the options in `useQuery`.
     const method = async (options: Options) => await client[methodName](options)
@@ -82,7 +85,10 @@ export const usePaymentMethodsForBasket = (
     // Parameters can be set in `apiOptions` or `client.clientConfig`;
     // we must merge them in order to generate the correct query key.
     const netOptions = omitNullableParameters(mergeOptions(client, apiOptions))
-    const parameters = pickValidParams(netOptions.parameters, ShopperBasketsV2.paramKeys[methodName])
+    const parameters = pickValidParams(
+        netOptions.parameters,
+        ShopperBasketsV2.paramKeys[methodName]
+    )
     const queryKey = queryKeyHelpers[methodName].queryKey(netOptions.parameters)
     // We don't use `netOptions` here because we manipulate the options in `useQuery`.
     const method = async (options: Options) => await client[methodName](options)
@@ -124,7 +130,10 @@ export const usePriceBooksForBasket = (
     // Parameters can be set in `apiOptions` or `client.clientConfig`;
     // we must merge them in order to generate the correct query key.
     const netOptions = omitNullableParameters(mergeOptions(client, apiOptions))
-    const parameters = pickValidParams(netOptions.parameters, ShopperBasketsV2.paramKeys[methodName])
+    const parameters = pickValidParams(
+        netOptions.parameters,
+        ShopperBasketsV2.paramKeys[methodName]
+    )
     const queryKey = queryKeyHelpers[methodName].queryKey(netOptions.parameters)
     // We don't use `netOptions` here because we manipulate the options in `useQuery`.
     const method = async (options: Options) => await client[methodName](options)
@@ -166,7 +175,10 @@ export const useShippingMethodsForShipment = (
     // Parameters can be set in `apiOptions` or `client.clientConfig`;
     // we must merge them in order to generate the correct query key.
     const netOptions = omitNullableParameters(mergeOptions(client, apiOptions))
-    const parameters = pickValidParams(netOptions.parameters, ShopperBasketsV2.paramKeys[methodName])
+    const parameters = pickValidParams(
+        netOptions.parameters,
+        ShopperBasketsV2.paramKeys[methodName]
+    )
     const queryKey = queryKeyHelpers[methodName].queryKey(netOptions.parameters)
     // We don't use `netOptions` here because we manipulate the options in `useQuery`.
     const method = async (options: Options) => await client[methodName](options)
@@ -208,7 +220,10 @@ export const useTaxesFromBasket = (
     // Parameters can be set in `apiOptions` or `client.clientConfig`;
     // we must merge them in order to generate the correct query key.
     const netOptions = omitNullableParameters(mergeOptions(client, apiOptions))
-    const parameters = pickValidParams(netOptions.parameters, ShopperBasketsV2.paramKeys[methodName])
+    const parameters = pickValidParams(
+        netOptions.parameters,
+        ShopperBasketsV2.paramKeys[methodName]
+    )
     const queryKey = queryKeyHelpers[methodName].queryKey(netOptions.parameters)
     // We don't use `netOptions` here because we manipulate the options in `useQuery`.
     const method = async (options: Options) => await client[methodName](options)
diff --git a/packages/commerce-sdk-react/src/hooks/ShopperCustomers/index.test.ts b/packages/commerce-sdk-react/src/hooks/ShopperCustomers/index.test.ts
@@ -17,9 +17,10 @@ describe('Shopper Customers hooks', () => {
         // If this test fails: create a new query hook, add the endpoint to the mutations enum,
         // or add it to the `expected` array with a comment explaining "TODO" or "never" (and why).
         expect(unimplemented).toEqual([
+            'deleteCustomerPaymentMethodReference', // TODO: Implement when the endpoint exits closed beta
             'getExternalProfile', // TODO: Implement when the endpoint exits closed beta
             'getPublicProductListItems', // TODO: Implement when the endpoint exits closed beta
-            'registerExternalProfile', // TODO: Implement when the endpoint exits closed beta
+            'registerExternalProfile' // TODO: Implement when the endpoint exits closed beta
         ])
     })
     test('all mutations have cache update logic', () => {
diff --git a/packages/commerce-sdk-react/src/hooks/ShopperLogin/index.test.ts b/packages/commerce-sdk-react/src/hooks/ShopperLogin/index.test.ts
@@ -21,8 +21,11 @@ describe('Shopper Login hooks', () => {
             // don't work well with the current implementation of mutation hooks.
             'authenticateCustomer',
             'authorizeWebauthnRegistration',
+            'deletePasskeyCredential',
+            'deletePasskeyUser',
             'finishWebauthnAuthentication',
             'finishWebauthnUserRegistration',
+            'getPasskeyUserByLoginId',
             'getTrustedAgentAuthorizationToken',
             'startWebauthnAuthentication',
             'startWebauthnUserRegistration'
diff --git a/packages/commerce-sdk-react/src/hooks/index.ts b/packages/commerce-sdk-react/src/hooks/index.ts
@@ -14,10 +14,10 @@ export {
     useTaxesFromBasket as useTaxesFromBasketV2,
     ShopperBasketsMutations as ShopperBasketsV2Mutations,
     useShopperBasketsMutation as useShopperBasketsV2Mutation,
-    useShopperBasketsMutationHelper as useShopperBasketsV2MutationHelper,
+    useShopperBasketsMutationHelper as useShopperBasketsV2MutationHelper
 } from './ShopperBasketsV2'
 // Only needed if consumers want to type-annotate variables with it.
-export type { ShopperBasketsMutation as ShopperBasketsV2Mutation } from './ShopperBasketsV2'
+export type {ShopperBasketsMutation as ShopperBasketsV2Mutation} from './ShopperBasketsV2'
 
 export * from './ShopperContexts'
 export * from './ShopperCustomers'
diff --git a/packages/pwa-kit-create-app/CHANGELOG.md b/packages/pwa-kit-create-app/CHANGELOG.md
@@ -1,4 +1,5 @@
 ## v3.17.0-dev
+- Add Salesforce Payments configuration to generated projects
 - Clear verdaccio npm cache during project generation [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)
 - Add Node 24 support, remove legacy `url` module import. Drop Node 16 support [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)
 
diff --git a/packages/pwa-kit-create-app/assets/bootstrap/js/config/default.js.hbs b/packages/pwa-kit-create-app/assets/bootstrap/js/config/default.js.hbs
@@ -165,7 +165,7 @@ module.exports = {
             enabled: true,
             sdkUrl: '',
             metadataUrl: ''
-        },    
+        },
         // Google Cloud api config
         googleCloudAPI: {
             apiKey: process.env.GOOGLE_CLOUD_API_KEY
diff --git a/packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/ssr.js.hbs b/packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/ssr.js.hbs
@@ -360,7 +360,7 @@ const {handler} = runtime.createHandler(options, (app) => {
                 '*.paypal.com',
                 '*.adyen.com',
                 '*.google.com',
-                '*.demandware.net', // Used to load a valid payment scripts in test environment
+                '*.demandware.net' // Used to load a valid payment scripts in test environment
             ],
             'connect-src': [
                 // Connect to Einstein APIs
@@ -372,7 +372,7 @@ const {handler} = runtime.createHandler(options, (app) => {
                 'places.googleapis.com',
                 // Connect to SCRT2 URLs
                 '*.salesforce-scrt.com',
-                // Payment gateways   
+                // Payment gateways
                 '*.demandware.net', // Used to load a valid payment scripts in test environment
                 '*.adyen.com',
                 '*.google.com'
@@ -501,9 +501,8 @@ const {handler} = runtime.createHandler(options, (app) => {
                 error: 'Failed to fetch metadata',
                 details: error.message
             })
-        }   
+        }
     })
-    
     app.get('*', runtime.render)
 })
 // SSR requires that we export a single handler function called 'get', that
diff --git a/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/app/ssr.js.hbs b/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/app/ssr.js.hbs
@@ -360,7 +360,7 @@ const {handler} = runtime.createHandler(options, (app) => {
                 '*.paypal.com',
                 '*.adyen.com',
                 '*.google.com',
-                '*.demandware.net', // Used to load a valid payment scripts in test environment
+                '*.demandware.net' // Used to load a valid payment scripts in test environment
             ],
             'connect-src': [
                 // Connect to Einstein APIs
@@ -372,7 +372,7 @@ const {handler} = runtime.createHandler(options, (app) => {
                 'places.googleapis.com',
                 // Connect to SCRT2 URLs
                 '*.salesforce-scrt.com',
-                // Payment gateways   
+                // Payment gateways
                 '*.demandware.net', // Used to load a valid payment scripts in test environment
                 '*.adyen.com',
                 '*.google.com'
diff --git a/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/config/default.js.hbs b/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/config/default.js.hbs
@@ -165,7 +165,7 @@ module.exports = {
             enabled: true,
             sdkUrl: '',
             metadataUrl: ''
-        },  
+        },
         // Google Cloud api config
         googleCloudAPI: {
             apiKey: process.env.GOOGLE_CLOUD_API_KEY
diff --git a/packages/template-retail-react-app/CHANGELOG.md b/packages/template-retail-react-app/CHANGELOG.md
@@ -1,4 +1,5 @@
 ## v9.1.0-dev
+- [Feature] Add Salesforce Payments support in checkout
 - Add Node 24 support. Drop Node 16 support [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)
 
 ## v9.0.0 (Feb 12, 2026)
diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json b/packages/template-retail-react-app/app/static/translations/compiled/en-GB.json
@@ -4921,6 +4921,12 @@
       "value": "Please enter your phone number."
     }
   ],
+  "use_address_fields.error.please_enter_postal_code": [
+    {
+      "type": 0,
+      "value": "Please enter your postal code."
+    }
+  ],
   "use_address_fields.error.please_enter_your_postal_or_zip": [
     {
       "type": 0,
diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-US.json b/packages/template-retail-react-app/app/static/translations/compiled/en-US.json
@@ -4921,6 +4921,12 @@
       "value": "Please enter your phone number."
     }
   ],
+  "use_address_fields.error.please_enter_postal_code": [
+    {
+      "type": 0,
+      "value": "Please enter your postal code."
+    }
+  ],
   "use_address_fields.error.please_enter_your_postal_or_zip": [
     {
       "type": 0,
diff --git a/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json b/packages/template-retail-react-app/app/static/translations/compiled/en-XA.json
@@ -10401,6 +10401,20 @@
       "value": "]"
     }
   ],
+  "use_address_fields.error.please_enter_postal_code": [
+    {
+      "type": 0,
+      "value": "["
+    },
+    {
+      "type": 0,
+      "value": "Ƥŀḗḗȧȧşḗḗ ḗḗƞŧḗḗř ẏǿǿŭŭř ƥǿǿşŧȧȧŀ ƈǿǿḓḗḗ."
+    },
+    {
+      "type": 0,
+      "value": "]"
+    }
+  ],
   "use_address_fields.error.please_enter_your_postal_or_zip": [
     {
       "type": 0,
diff --git a/packages/template-retail-react-app/config/default.js b/packages/template-retail-react-app/config/default.js
@@ -48,7 +48,7 @@ module.exports = {
                 landingPath: '/reset-password-landing'
             }
         },
-        defaultSite: 'RefArch',
+        defaultSite: 'RefArchGlobal',
         siteAliases: {
             RefArch: 'us',
             RefArchGlobal: 'global'
@@ -57,17 +57,11 @@ module.exports = {
         commerceAPI: {
             proxyPath: `/mobify/proxy/api`,
             parameters: {
-                clientId: '0bb3af38-b52c-4f4b-966e-fe7087ca47e2',
-                organizationId: 'f_ecom_zyoe_006',
-                shortCode: 'sandbox-001',
-                siteId: 'RefArch'
+                clientId: 'c9c45bfd-0ed3-4aa2-9971-40f88962b836',
+                organizationId: 'f_ecom_zzrf_001',
+                shortCode: '8o7m175y',
+                siteId: 'RefArchGlobal'
             }
-            /*parameters: {
-                clientId: 'cc62dfa8-777f-486a-8af2-bdc048a4ba52',
-                organizationId: 'f_ecom_zyoe_009',
-                shortCode: 'sandbox-001',
-                siteId: 'RefArch'
-            }*/
         },
         einsteinAPI: {
             host: 'https://api.cquotient.com',
@@ -94,20 +88,10 @@ module.exports = {
         },
         storeLocatorEnabled: true,
         multishipEnabled: true,
-        // Salesforce Payments configuration
-        // To enable, set enabled to true and provide the SDK and metadata URLs for your Commerce Cloud instance.
-        // Example URLs: https://<instance>.unified.demandware.net/on/demandware.static/Sites-Site/-/-/internal/jscript/sfp/v1/sfp.js
-        //               https://<instance>.unified.demandware.net/on/demandware.static/Sites-Site/-/-/internal/metadata/v1.json
-        /*sfPayments: {
-            enabled: false,
-            sdkUrl: '',
-            metadataUrl: ''
-        },*/
         sfPayments: {
             enabled: true,
-            sdkUrl: 'https://zyoe-006.unified.demandware.net/on/demandware.static/Sites-Site/-/-/internal/jscript/sfp/v1/sfp.js',
-            metadataUrl:
-                'https://zyoe-006.unified.demandware.net/on/demandware.static/Sites-Site/-/-/internal/metadata/v1.json'
+            sdkUrl: '',
+            metadataUrl: ''
         },
         googleCloudAPI: {
             apiKey: process.env.GOOGLE_CLOUD_API_KEY
@@ -129,11 +113,11 @@ module.exports = {
         ssrFunctionNodeVersion: '24.x',
         proxyConfigs: [
             {
-                host: 'sandbox-001.api.commercecloud.salesforce.com',
+                host: 'kv7kzm78.api.commercecloud.salesforce.com',
                 path: 'api'
             },
             {
-                host: 'zyoe-006.dx.commercecloud.salesforce.com',
+                host: 'zzrf-001.dx.commercecloud.salesforce.com',
                 path: 'ocapi'
             }
         ]
diff --git a/packages/template-retail-react-app/config/mocks/default.js b/packages/template-retail-react-app/config/mocks/default.js
@@ -123,7 +123,12 @@ module.exports = {
             enabled: false
         },
         storeLocatorEnabled: true,
-        multishipEnabled: true
+        multishipEnabled: true,
+        sfPayments: {
+            enabled: true,
+            sdkUrl: '',
+            metadataUrl: ''
+        }
     },
     // This list contains server-side only libraries that you don't want to be compiled by webpack
     externals: [],
diff --git a/packages/template-retail-react-app/jest-setup.js b/packages/template-retail-react-app/jest-setup.js
@@ -96,6 +96,13 @@ export const setupMockServer = () => {
         // Mock Data Cloud API
         rest.post('*.c360a.salesforce.com/web/events/*', (req, res, ctx) => {
             return res(ctx.delay(0), ctx.status(204), ctx.json({}))
+        }),
+        // Mock Salesforce Payments metadata
+        rest.get('*/payment-metadata', (req, res, ctx) => {
+            return res(ctx.delay(0), ctx.status(200), ctx.json({}))
+        }),
+        rest.get('*/configuration/shopper-configurations/*', (req, res, ctx) => {
+            return res(ctx.delay(0), ctx.status(200), ctx.json({}))
         })
     )
 }
diff --git a/packages/template-retail-react-app/package.json b/packages/template-retail-react-app/package.json
@@ -22,7 +22,6 @@
     "push": "npm run build && pwa-kit-dev push",
     "save-credentials": "pwa-kit-dev save-credentials",
     "start": "cross-env NODE_ICU_DATA=node_modules/full-icu pwa-kit-dev start",
-    "start:https": "cross-env NODE_TLS_REJECT_UNAUTHORIZED=0 NODE_ICU_DATA=node_modules/full-icu DEV_SERVER_PROTOCOL=https DEV_SERVER_SSL_FILE_PATH=../../localhost.pem pwa-kit-dev start",
     "start:inspect": "npm run start -- --inspect",
     "start:pseudolocale": "npm run extract-default-translations && npm run compile-translations:pseudo && cross-env USE_PSEUDOLOCALE=true npm run start",
     "tail-logs": "pwa-kit-dev tail-logs",
@@ -102,11 +101,11 @@
   "bundlesize": [
     {
       "path": "build/main.js",
-      "maxSize": "90 kB"
+      "maxSize": "98 kB"
     },
     {
       "path": "build/vendor.js",
-      "maxSize": "366 kB"
+      "maxSize": "370 kB"
     }
   ]
 }
diff --git a/packages/template-retail-react-app/translations/en-GB.json b/packages/template-retail-react-app/translations/en-GB.json
diff --git a/packages/template-retail-react-app/translations/en-US.json b/packages/template-retail-react-app/translations/en-US.json

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`## v5.1.0-dev`
	`2`	`+- Bump commerce-sdk-isomorphic to 5.1.0-unstable-20260226081656`
`2`	`3`	`- Add Node 24 support. Drop Node 16 support. [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)`
`3`	`4`
`4`	`5`	`## v5.0.0 (Feb 12, 2026)`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`## v3.17.0-dev`
	`2`	`+- Add Salesforce Payments configuration to generated projects`
`2`	`3`	`- Clear verdaccio npm cache during project generation [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)`
`3`	`4`	- Add Node 24 support, remove legacy `url` module import. Drop Node 16 support [#3652](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3652)
`4`	`5`