@salesforce/retail-react-app 6.0.0 → 6.1.0-dev

package/app/pages/product-list/index.jsx

@@ -72,6 +72,7 @@ import {
 } from '@salesforce/retail-react-app/app/hooks'
 import {useToast} from '@salesforce/retail-react-app/app/hooks/use-toast'
 import useEinstein from '@salesforce/retail-react-app/app/hooks/use-einstein'
+import useDataCloud from '@salesforce/retail-react-app/app/hooks/use-datacloud'
 import useActiveData from '@salesforce/retail-react-app/app/hooks/use-active-data'
 
 // Others
@@ -117,6 +118,7 @@ const ProductList = (props) => {
     const location = useLocation()
     const toast = useToast()
     const einstein = useEinstein()
+    const dataCloud = useDataCloud()
     const activeData = useActiveData()
     const {res} = useServerContext()
     const customerId = useCustomerId()
@@ -159,7 +161,14 @@ const ProductList = (props) => {
                 perPricebook: true,
                 allVariationProperties: true,
                 allImages: true,
-                expand: ['promotions', 'variations', 'prices', 'images', 'custom_properties'],
+                expand: [
+                    'promotions',
+                    'variations',
+                    'prices',
+                    'images',
+                    'page_meta_tags',
+                    'custom_properties'
+                ],
                 refine: _refine
             }
         },
@@ -384,6 +393,7 @@ const ProductList = (props) => {
                         additionalProperties: {error: err, searchQuery}
                     })
                 }
+                dataCloud.sendViewSearchResults(searchParams, productSearchResult)
                 activeData.sendViewSearch(searchParams, productSearchResult)
             } else {
                 try {
@@ -394,6 +404,7 @@ const ProductList = (props) => {
                         additionalProperties: {error: err, category}
                     })
                 }
+                dataCloud.sendViewCategory(searchParams, category, productSearchResult)
                 activeData.sendViewCategory(searchParams, category, productSearchResult)
             }
         }
@@ -411,6 +422,9 @@ const ProductList = (props) => {
                 <title>{category?.pageTitle ?? searchQuery}</title>
                 <meta name="description" content={category?.pageDescription ?? searchQuery} />
                 <meta name="keywords" content={category?.pageKeywords} />
+                {productSearchResult?.pageMetaTags?.map(({id, value}) => {
+                    return <meta name={id} content={value} key={id} />
+                })}
             </Helmet>
             {showNoResults ? (
                 <EmptySearchResults searchQuery={searchQuery} category={category} />

package/app/pages/registration/index.jsx

@@ -16,6 +16,7 @@ import Seo from '@salesforce/retail-react-app/app/components/seo'
 import RegisterForm from '@salesforce/retail-react-app/app/components/register'
 import useNavigation from '@salesforce/retail-react-app/app/hooks/use-navigation'
 import useEinstein from '@salesforce/retail-react-app/app/hooks/use-einstein'
+import useDataCloud from '@salesforce/retail-react-app/app/hooks/use-datacloud'
 import {API_ERROR_MESSAGE} from '@salesforce/retail-react-app/app/constants'
 
 const Registration = () => {
@@ -24,6 +25,7 @@ const Registration = () => {
     const {isRegistered} = useCustomerType()
     const form = useForm()
     const einstein = useEinstein()
+    const dataCloud = useDataCloud()
     const {pathname} = useLocation()
     const register = useAuthHelper(AuthHelpers.Register)
 
@@ -54,6 +56,7 @@ const Registration = () => {
     /**************** Einstein ****************/
     useEffect(() => {
         einstein.sendViewPage(pathname)
+        dataCloud.sendViewPage(pathname)
     }, [])
 
     return (

package/app/pages/reset-password/index.jsx

@@ -15,6 +15,7 @@ import ResetPasswordForm from '@salesforce/retail-react-app/app/components/reset
 import ResetPasswordLanding from '@salesforce/retail-react-app/app/pages/reset-password/reset-password-landing'
 import useNavigation from '@salesforce/retail-react-app/app/hooks/use-navigation'
 import useEinstein from '@salesforce/retail-react-app/app/hooks/use-einstein'
+import useDataCloud from '@salesforce/retail-react-app/app/hooks/use-datacloud'
 import {useLocation} from 'react-router-dom'
 import {useRouteMatch} from 'react-router'
 import {usePasswordReset} from '@salesforce/retail-react-app/app/hooks/use-password-reset'
@@ -29,6 +30,7 @@ const ResetPassword = () => {
     const form = useForm()
     const navigate = useNavigation()
     const einstein = useEinstein()
+    const dataCloud = useDataCloud()
     const {pathname} = useLocation()
     const {path} = useRouteMatch()
     const {getPasswordResetToken} = usePasswordReset()
@@ -48,6 +50,7 @@ const ResetPassword = () => {
     /**************** Einstein ****************/
     useEffect(() => {
         einstein.sendViewPage(pathname)
+        dataCloud.sendViewPage(pathname)
     }, [])
 
     return (

package/app/ssr.js

@@ -313,7 +313,9 @@ const {handler} = runtime.createHandler(options, (app) => {
                     ],
                     'connect-src': [
                         // Connect to Einstein APIs
-                        'api.cquotient.com'
+                        'api.cquotient.com',
+                        // Connect to DataCloud APIs
+                        '*.c360a.salesforce.com'
                     ]
                 }
             }

package/config/default.js

@@ -53,6 +53,10 @@ module.exports = {
             // This differs from the siteId in commerceAPIConfig for testing purposes
             siteId: 'aaij-MobileFirst',
             isProduction: false
+        },
+        dataCloudAPI: {
+            appSourceId: 'fb81edab-24c6-4b40-8684-b67334dfdf32',
+            tenantId: 'mmyw8zrxhfsg09lfmzrd1zjqmg'
         }
     },
     externals: [],

package/config/mocks/default.js

@@ -95,6 +95,10 @@ module.exports = {
             // This is temporary and is meant as a placeholder until there is a mechanism for reading
             // the is_production property from an MRT target
             isProduction: false
+        },
+        dataCloudAPI: {
+            appSourceId: '23df7335-2e9d-4fbc-bc34-7e93649e69b7',
+            tenantId: '5zqheixqu9vji7spdkzxwh4hpz'
         }
     },
     // This list contains server-side only libraries that you don't want to be compiled by webpack

package/jest-setup.js

@@ -50,6 +50,12 @@ export const setupMockServer = () => {
         rest.get('*/customers/:customerId/baskets', (req, res, ctx) =>
             res(ctx.delay(0), ctx.status(200), ctx.json(mockCustomerBaskets))
         ),
+        rest.get('*/shopper-context/:usid', (req, res, ctx) =>
+            res(ctx.delay(0), ctx.status(200), ctx.json({}))
+        ),
+        rest.get('*/shopper-experience/*', (req, res, ctx) =>
+            res(ctx.delay(0), ctx.status(200), ctx.json({}))
+        ),
         rest.post('*/sessions', (req, res, ctx) => res(ctx.delay(0), ctx.status(200))),
         rest.post('*/oauth2/token', (req, res, ctx) =>
             res(
@@ -86,6 +92,10 @@ export const setupMockServer = () => {
         }),
         rest.post('*/v3/personalization/recs/EinsteinTestSite/*', (req, res, ctx) => {
             return res(ctx.delay(0), ctx.status(200), ctx.json({}))
+        }),
+        // Mock Data Cloud API
+        rest.post('*.pc-rnd.c360a.salesforce.com/web/events/*', (req, res, ctx) => {
+            return res(ctx.delay(0), ctx.status(204), ctx.json({}))
         })
     )
 }

package/jest.config.js

@@ -18,8 +18,12 @@ module.exports = {
         '^@tanstack/react-query$':
             '<rootDir>/node_modules/@tanstack/react-query/build/lib/index.js',
         '^is-what$': '<rootDir>/node_modules/is-what/dist/cjs/index.cjs',
-        '^copy-anything$': '<rootDir>/node_modules/copy-anything/dist/cjs/index.cjs'
+        '^copy-anything$': '<rootDir>/node_modules/copy-anything/dist/cjs/index.cjs',
+        "^@salesforce/cc-datacloud-typescript$": "<rootDir>/node_modules/@salesforce/cc-datacloud-typescript/dist/index.js"
     },
+    transformIgnorePatterns: [
+        "/node_modules/(?!@salesforce/cc-datacloud-typescript)"
+    ],
     setupFilesAfterEnv: [path.join(__dirname, 'jest-setup.js')],
     collectCoverageFrom: [
         'app/**/*.{js,jsx}',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/retail-react-app",
-  "version": "6.0.0",
+  "version": "6.1.0-dev",
   "license": "See license in LICENSE",
   "author": "cc-pwa-kit@salesforce.com",
   "ccExtensibility": {
@@ -45,10 +45,11 @@
     "@lhci/cli": "^0.11.0",
     "@loadable/component": "^5.15.3",
     "@peculiar/webcrypto": "^1.4.2",
-    "@salesforce/commerce-sdk-react": "3.2.0",
-    "@salesforce/pwa-kit-dev": "3.9.0",
-    "@salesforce/pwa-kit-react-sdk": "3.9.0",
-    "@salesforce/pwa-kit-runtime": "3.9.0",
+    "@salesforce/cc-datacloud-typescript": "^1.0.10",
+    "@salesforce/commerce-sdk-react": "3.3.0-dev",
+    "@salesforce/pwa-kit-dev": "3.10.0-dev",
+    "@salesforce/pwa-kit-react-sdk": "3.10.0-dev",
+    "@salesforce/pwa-kit-runtime": "3.10.0-dev",
     "@tanstack/react-query": "^4.28.0",
     "@tanstack/react-query-devtools": "^4.29.1",
     "@testing-library/dom": "^9.0.1",
@@ -57,7 +58,7 @@
     "@testing-library/user-event": "^14.4.3",
     "babel-plugin-module-resolver": "5.0.2",
     "base64-arraybuffer": "^0.2.0",
-    "bundlesize2": "^0.0.31",
+    "bundlesize2": "^0.0.35",
     "card-validator": "^8.1.1",
     "cross-env": "^5.2.1",
     "cross-fetch": "^3.1.4",
@@ -72,7 +73,7 @@
     "jwt-decode": "^4.0.0",
     "lodash": "^4.17.21",
     "msw": "^1.2.1",
-    "nanoid": "^3.3.4",
+    "nanoid": "^3.3.8",
     "prop-types": "^15.8.1",
     "query-string": "^7.1.3",
     "raf": "^3.4.1",
@@ -87,6 +88,11 @@
   "devDependencies": {
     "cross-env": "^5.2.1"
   },
+  "overrides": {
+    "react-router": {
+      "path-to-regexp": "^1.9.0"
+    }
+  },
   "engines": {
     "node": "^16.11.0 || ^18.0.0 || ^20.0.0 || ^22.0.0",
     "npm": "^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0"
@@ -98,8 +104,8 @@
     },
     {
       "path": "build/vendor.js",
-      "maxSize": "325 kB"
+      "maxSize": "328 kB"
     }
   ],
-  "gitHead": "bb69324df47c107d592f50aa9a5e7069ae89fccd"
+  "gitHead": "d86dc7bea3fe03a0f475ecf1a0ab878374f07026"
 }