Merge branch 'develop' into W-18685522-reset-and-passwordless-integration-test

jeremy-jung1 · web-flow · commit d3b026c7dcfe · 2025-07-08T13:27:34.000-07:00
diff --git a/packages/pwa-kit-create-app/CHANGELOG.md b/packages/pwa-kit-create-app/CHANGELOG.md
@@ -3,7 +3,8 @@
 - Add `program.json` + Support for Agent-Friendly CLI Input via stdio [#2662](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2662)
 - Change the default ECOM instance in the generated application [#2610](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2610)
 - Load active data scripts on demand only [#2623](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2623)
-- Introduce the cursor rules to assist storefront project developers [#2578] (https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2578)
+- Introduce the cursor rules to assist storefront project developers [#2578](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2578) [#2754](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2754)
+- Add `StoreLocatorProvider` to the `AppConfig` template to support BOPIS [#2753](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2753)
 
 ## v3.10.0 (May 22, 2025)
 - Add Data Cloud API configuration to `default.js`. [#2318](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2318)
diff --git a/packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/components/_app-config/index.jsx.hbs b/packages/pwa-kit-create-app/assets/bootstrap/js/overrides/app/components/_app-config/index.jsx.hbs
@@ -12,7 +12,7 @@ import {ChakraProvider} from '@salesforce/retail-react-app/app/components/shared
 import 'focus-visible/dist/focus-visible'
 
 import theme from '@salesforce/retail-react-app/app/theme'
-import {MultiSiteProvider} from '@salesforce/retail-react-app/app/contexts'
+import {MultiSiteProvider, StoreLocatorProvider} from '@salesforce/retail-react-app/app/contexts'
 import {
     resolveSiteFromUrl,
     resolveLocaleFromUrl
@@ -27,7 +27,16 @@ import {withReactQuery} from '@salesforce/pwa-kit-react-sdk/ssr/universal/compon
 import {useCorrelationId} from '@salesforce/pwa-kit-react-sdk/ssr/universal/hooks'
 import {getAppOrigin} from '@salesforce/pwa-kit-react-sdk/utils/url'
 import {ReactQueryDevtools} from '@tanstack/react-query-devtools'
-import {DEFAULT_DNT_STATE} from '@salesforce/retail-react-app/app/constants'
+import {
+    DEFAULT_DNT_STATE,
+    STORE_LOCATOR_RADIUS,
+    STORE_LOCATOR_RADIUS_UNIT,
+    STORE_LOCATOR_DEFAULT_COUNTRY,
+    STORE_LOCATOR_DEFAULT_COUNTRY_CODE,
+    STORE_LOCATOR_DEFAULT_POSTAL_CODE,
+    STORE_LOCATOR_DEFAULT_PAGE_SIZE,
+    STORE_LOCATOR_SUPPORTED_COUNTRIES
+} from '@salesforce/retail-react-app/app/constants'
 
 /**
  * Use the AppConfig component to inject extra arguments into the getProps
@@ -49,6 +58,16 @@ const AppConfig = ({children, locals = {}}) => {
 
     const passwordlessCallback = locals.appConfig.login?.passwordless?.callbackURI
 
+    const storeLocatorConfig = {
+        radius: STORE_LOCATOR_RADIUS,
+        radiusUnit: STORE_LOCATOR_RADIUS_UNIT,
+        defaultCountry: STORE_LOCATOR_DEFAULT_COUNTRY,
+        defaultCountryCode: STORE_LOCATOR_DEFAULT_COUNTRY_CODE,
+        defaultPostalCode: STORE_LOCATOR_DEFAULT_POSTAL_CODE,
+        defaultPageSize: STORE_LOCATOR_DEFAULT_PAGE_SIZE,
+        supportedCountries: STORE_LOCATOR_SUPPORTED_COUNTRIES
+    }
+
     return (
         <CommerceApiProvider
             shortCode={commerceApiConfig.parameters.shortCode}
@@ -70,7 +89,9 @@ const AppConfig = ({children, locals = {}}) => {
             {{/if}}
         >
             <MultiSiteProvider site={locals.site} locale={locals.locale} buildUrl={locals.buildUrl}>
-                <ChakraProvider theme={theme}>{children}</ChakraProvider>
+                <StoreLocatorProvider config={storeLocatorConfig}>
+                    <ChakraProvider theme={theme}>{children}</ChakraProvider>
+                </StoreLocatorProvider>
             </MultiSiteProvider>
             <ReactQueryDevtools />
         </CommerceApiProvider>
diff --git a/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/app/components/_app-config/index.jsx.hbs b/packages/pwa-kit-create-app/assets/templates/@salesforce/retail-react-app/app/components/_app-config/index.jsx.hbs
@@ -12,7 +12,7 @@ import {ChakraProvider} from '@salesforce/retail-react-app/app/components/shared
 import 'focus-visible/dist/focus-visible'
 
 import theme from '@salesforce/retail-react-app/app/theme'
-import {MultiSiteProvider} from '@salesforce/retail-react-app/app/contexts'
+import {MultiSiteProvider, StoreLocatorProvider} from '@salesforce/retail-react-app/app/contexts'
 import {useAppOrigin} from '@salesforce/retail-react-app/app/hooks/use-app-origin'
 import {
     resolveSiteFromUrl,
@@ -28,6 +28,15 @@ import {withReactQuery} from '@salesforce/pwa-kit-react-sdk/ssr/universal/compon
 import {useCorrelationId} from '@salesforce/pwa-kit-react-sdk/ssr/universal/hooks'
 import {ReactQueryDevtools} from '@tanstack/react-query-devtools'
 import {DEFAULT_DNT_STATE} from '@salesforce/retail-react-app/app/constants'
+import {
+    STORE_LOCATOR_RADIUS,
+    STORE_LOCATOR_RADIUS_UNIT,
+    STORE_LOCATOR_DEFAULT_COUNTRY,
+    STORE_LOCATOR_DEFAULT_COUNTRY_CODE,
+    STORE_LOCATOR_DEFAULT_POSTAL_CODE,
+    STORE_LOCATOR_DEFAULT_PAGE_SIZE,
+    STORE_LOCATOR_SUPPORTED_COUNTRIES
+} from '@salesforce/retail-react-app/app/constants'
 
 /**
  * Use the AppConfig component to inject extra arguments into the getProps
@@ -49,6 +58,16 @@ const AppConfig = ({children, locals = {}}) => {
 
     const passwordlessCallback = locals.appConfig.login?.passwordless?.callbackURI
 
+    const storeLocatorConfig = {
+        radius: STORE_LOCATOR_RADIUS,
+        radiusUnit: STORE_LOCATOR_RADIUS_UNIT,
+        defaultCountry: STORE_LOCATOR_DEFAULT_COUNTRY,
+        defaultCountryCode: STORE_LOCATOR_DEFAULT_COUNTRY_CODE,
+        defaultPostalCode: STORE_LOCATOR_DEFAULT_POSTAL_CODE,
+        defaultPageSize: STORE_LOCATOR_DEFAULT_PAGE_SIZE,
+        supportedCountries: STORE_LOCATOR_SUPPORTED_COUNTRIES
+    }
+
     return (
         <CommerceApiProvider
             shortCode={commerceApiConfig.parameters.shortCode}
@@ -70,7 +89,9 @@ const AppConfig = ({children, locals = {}}) => {
             {{/if}}
         >
             <MultiSiteProvider site={locals.site} locale={locals.locale} buildUrl={locals.buildUrl}>
-                <ChakraProvider theme={theme}>{children}</ChakraProvider>
+                <StoreLocatorProvider config={storeLocatorConfig}>
+                    <ChakraProvider theme={theme}>{children}</ChakraProvider>
+                </StoreLocatorProvider>
             </MultiSiteProvider>
             <ReactQueryDevtools />
         </CommerceApiProvider>
diff --git a/packages/pwa-kit-create-app/scripts/create-mobify-app.js b/packages/pwa-kit-create-app/scripts/create-mobify-app.js
@@ -352,35 +352,28 @@ const runGenerator = (context, {outputDir, templateVersion, verbose}) => {
         assets.forEach((asset) => {
             sh.cp('-rf', p.join(packagePath, asset), outputDir)
         })
-
-        // Copy the .cursor/rules directory if it exists
-        if (sh.test('-e', CURSOR_RULES_FROM_DIR)) {
-            const outputCursorRulesDir = p.join(outputDir, '.cursor', 'rules')
-
-            // Create the directory if it doesn't exist
-            if (!sh.test('-e', outputCursorRulesDir)) {
-                fs.mkdirSync(outputCursorRulesDir, {recursive: true})
-            }
-
-            // Copy the contents of CURSOR_RULES_FROM_DIR to outputCursorRulesDir
-            const files = fs.readdirSync(CURSOR_RULES_FROM_DIR)
-            files.forEach((file) => {
-                sh.cp('-rf', p.join(CURSOR_RULES_FROM_DIR, file), outputCursorRulesDir)
-            })
-        }
     } else {
         console.log('Copying base template from package or npm: ', packagePath, outputDir)
         // Copy the base template either from the package or npm.
         sh.cp('-rf', packagePath, outputDir)
 
-        // Copy template specific assets over.
-        const assetsDir = p.join(ASSETS_TEMPLATES_DIR, id)
+        // Copy template specific assets over, if they exist.
+        const assetsDir = p.join(ASSETS_TEMPLATES_DIR, source.name || id)
         if (sh.test('-e', assetsDir)) {
+            console.log(`Copying template-specific assets from ${assetsDir}`)
             getFiles(assetsDir)
                 .map((file) => file.replace(assetsDir, ''))
                 .forEach((relFilePath) =>
                     processTemplate(relFilePath, assetsDir, outputDir, context)
                 )
+        } else {
+            // However, we expected to see assetsDir for retail-react-app template
+            if (source.name === '@salesforce/retail-react-app') {
+                console.error(
+                    `Error: cannot find template-specific assets for retail-react-app in directory ${assetsDir}`
+                )
+                process.exit(1)
+            }
         }
 
         // Update the generated projects version. NOTE: For bootstrapped projects this
@@ -398,6 +391,22 @@ const runGenerator = (context, {outputDir, templateVersion, verbose}) => {
         sh.rm('-rf', tmp)
     }
 
+    // Copy the .cursor/rules directory if it exists
+    if (sh.test('-e', CURSOR_RULES_FROM_DIR)) {
+        const outputCursorRulesDir = p.join(outputDir, '.cursor', 'rules')
+
+        // Create the directory if it doesn't exist
+        if (!sh.test('-e', outputCursorRulesDir)) {
+            fs.mkdirSync(outputCursorRulesDir, {recursive: true})
+        }
+
+        // Copy the contents of CURSOR_RULES_FROM_DIR to outputCursorRulesDir
+        const files = fs.readdirSync(CURSOR_RULES_FROM_DIR)
+        files.forEach((file) => {
+            sh.cp('-rf', p.join(CURSOR_RULES_FROM_DIR, file), outputCursorRulesDir)
+        })
+    }
+
     // Install dependencies for the newly minted project.
     npmInstall(outputDir, {verbose})
 }
