@salesforce/retail-react-app 8.3.0-preview.1 → 8.4.0-nightly-20260116000329

package/app/pages/login/passwordless-landing.test.js

@@ -17,6 +17,11 @@ import Account from '@salesforce/retail-react-app/app/pages/account'
 import mockConfig from '@salesforce/retail-react-app/config/mocks/default'
 import {mockedRegisteredCustomer} from '@salesforce/retail-react-app/app/mocks/mock-data'
 import {AuthHelpers} from '@salesforce/commerce-sdk-react'
+import {getConfig} from '@salesforce/pwa-kit-runtime/utils/ssr-config'
+
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-config', () => ({
+    getConfig: jest.fn(() => mockConfig)
+}))
 
 const mockMergedBasket = {
     basketId: 'a10ff320829cb0eef93ca5310a',
@@ -45,12 +50,13 @@ const MockedComponent = () => {
     )
 }
 
+const mockUseRouteMatch = jest.fn(() => ({path: '/'}))
+
 jest.mock('react-router', () => {
+    const original = jest.requireActual('react-router')
     return {
-        ...jest.requireActual('react-router'),
-        useRouteMatch: () => {
-            return {path: '/passwordless-login-landing'}
-        }
+        ...original,
+        useRouteMatch: () => mockUseRouteMatch()
     }
 })
 
@@ -72,6 +78,14 @@ jest.mock('@salesforce/commerce-sdk-react', () => {
 
 // Set up and clean up
 beforeEach(() => {
+    jest.clearAllMocks()
+    getConfig.mockReturnValue(mockConfig)
+
+    // Reset useRouteMatch mock to return path based on window.location.pathname
+    mockUseRouteMatch.mockImplementation(() => ({
+        path: typeof window !== 'undefined' && window.location ? window.location.pathname : '/'
+    }))
+
     global.server.use(
         rest.post('*/customers', (req, res, ctx) => {
             return res(ctx.delay(0), ctx.status(200), ctx.json(mockedRegisteredCustomer))
@@ -92,11 +106,32 @@ beforeEach(() => {
         })
     )
 })
-afterEach(() => {
-    jest.resetModules()
-})
 
 describe('Passwordless landing tests', function () {
+    test('does not run passwordless login when landing path does not match', async () => {
+        const token = '11111111'
+        const invalidLoginPath = '/invalid-passwordless-login-landing'
+
+        window.history.pushState(
+            {},
+            'Passwordless Login Landing',
+            createPathWithDefaults(`${invalidLoginPath}?token=${token}`)
+        )
+        renderWithProviders(<MockedComponent />, {
+            wrapperProps: {
+                siteAlias: 'uk',
+                locale: {id: 'en-GB'},
+                appConfig: mockConfig.app
+            }
+        })
+
+        await waitFor(() => {
+            expect(
+                mockAuthHelperFunctions[AuthHelpers.LoginPasswordlessUser].mutateAsync
+            ).not.toHaveBeenCalled()
+        })
+    })
+
     test('redirects to account page when redirect url is not passed', async () => {
         const token = '12345678'
         window.history.pushState(
@@ -151,4 +186,76 @@ describe('Passwordless landing tests', function () {
             expect(window.location.pathname).toBe('/uk/en-GB/womens-tops')
         })
     })
+
+    test('detects landing path when at the end of path', async () => {
+        const token = '33333333'
+        const loginPath = '/global/en-GB/passwordless-login-landing'
+        // mockRouteMatch.mockReturnValue({path: loginPath})
+        window.history.pushState(
+            {},
+            'Passwordless Login Landing',
+            createPathWithDefaults(`${loginPath}?token=${token}`)
+        )
+        renderWithProviders(<MockedComponent />, {
+            wrapperProps: {
+                siteAlias: 'global',
+                locale: {id: 'en-GB'},
+                appConfig: mockConfig.app
+            }
+        })
+
+        await waitFor(() => {
+            expect(
+                mockAuthHelperFunctions[AuthHelpers.LoginPasswordlessUser].mutateAsync
+            ).toHaveBeenCalledWith({
+                pwdlessLoginToken: token
+            })
+        })
+
+        expect(
+            mockAuthHelperFunctions[AuthHelpers.LoginPasswordlessUser].mutateAsync
+        ).toHaveBeenCalledWith({
+            pwdlessLoginToken: token
+        })
+    })
+
+    test('landing path changes based on config', async () => {
+        const token = '44444444'
+        const customLandingPath = '/custom-passwordless-login-landing'
+        const mockConfigWithCustomLandingPath = {
+            ...mockConfig,
+            app: {
+                ...mockConfig.app,
+                login: {
+                    ...mockConfig.app.login,
+                    passwordless: {
+                        ...mockConfig.app.login.passwordless,
+                        enabled: true,
+                        landingPath: customLandingPath
+                    }
+                }
+            }
+        }
+
+        getConfig.mockReturnValue(mockConfigWithCustomLandingPath)
+
+        window.history.pushState(
+            {},
+            'Passwordless Login Landing',
+            createPathWithDefaults(`${customLandingPath}?token=${token}`)
+        )
+        renderWithProviders(<MockedComponent />, {
+            wrapperProps: {
+                siteAlias: 'uk',
+                locale: {id: 'en-GB'},
+                appConfig: mockConfigWithCustomLandingPath.app
+            }
+        })
+
+        expect(
+            mockAuthHelperFunctions[AuthHelpers.LoginPasswordlessUser].mutateAsync
+        ).toHaveBeenCalledWith({
+            pwdlessLoginToken: token
+        })
+    })
 })

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

@@ -20,7 +20,6 @@ import {useLocation} from 'react-router-dom'
 import {useRouteMatch} from 'react-router'
 import {usePasswordReset} from '@salesforce/retail-react-app/app/hooks/use-password-reset'
 import {
-    RESET_PASSWORD_LANDING_PATH,
     API_ERROR_MESSAGE,
     FEATURE_UNAVAILABLE_ERROR_MESSAGE
 } from '@salesforce/retail-react-app/app/constants'
@@ -33,7 +32,7 @@ const ResetPassword = () => {
     const dataCloud = useDataCloud()
     const {pathname} = useLocation()
     const {path} = useRouteMatch()
-    const {getPasswordResetToken} = usePasswordReset()
+    const {getPasswordResetToken, resetPasswordLandingPath} = usePasswordReset()
 
     const submitForm = async ({email}) => {
         try {
@@ -71,7 +70,7 @@ const ResetPassword = () => {
                 marginBottom={8}
                 borderRadius="base"
             >
-                {path === RESET_PASSWORD_LANDING_PATH ? (
+                {path.endsWith(resetPasswordLandingPath) ? (
                     <ResetPasswordLanding />
                 ) : (
                     <ResetPasswordForm

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

@@ -14,6 +14,16 @@ import {
 import ResetPassword from '.'
 import mockConfig from '@salesforce/retail-react-app/config/mocks/default'
 
+const mockUseRouteMatch = jest.fn(() => ({path: '/'}))
+
+jest.mock('react-router', () => {
+    const original = jest.requireActual('react-router')
+    return {
+        ...original,
+        useRouteMatch: () => mockUseRouteMatch()
+    }
+})
+
 const MockedComponent = () => {
     return (
         <div>
@@ -24,7 +34,10 @@ const MockedComponent = () => {
 
 // Set up and clean up
 beforeEach(() => {
-    jest.resetModules()
+    // Reset useRouteMatch mock to return path based on window.location.pathname
+    mockUseRouteMatch.mockImplementation(() => ({
+        path: typeof window !== 'undefined' && window.location ? window.location.pathname : '/'
+    }))
     window.history.pushState({}, 'Reset Password', createPathWithDefaults('/reset-password'))
 })
 afterEach(() => {
@@ -75,3 +88,20 @@ test('Allows customer to generate password token', async () => {
         expect(window.location.pathname).toBe('/uk/en-GB/login')
     })
 })
+
+test.each([
+    ['base path', '/reset-password-landing'],
+    ['path with site and locale', '/uk/en-GB/reset-password-landing']
+])('renders reset password landing page when using %s', async (_, landingPath) => {
+    window.history.pushState({}, 'Reset Password', createPathWithDefaults(landingPath))
+
+    // render our test component
+    renderWithProviders(<MockedComponent />, {
+        wrapperProps: {siteAlias: 'uk', appConfig: mockConfig.app}
+    })
+
+    // check if the landing page is rendered
+    await waitFor(() => {
+        expect(screen.getByText(/confirm new password/i)).toBeInTheDocument()
+    })
+})

package/app/routes.jsx

@@ -20,14 +20,7 @@ import {getConfig} from '@salesforce/pwa-kit-runtime/utils/ssr-config'
 import {Skeleton} from '@salesforce/retail-react-app/app/components/shared/ui'
 import {configureRoutes} from '@salesforce/retail-react-app/app/utils/routes-utils'
 
-// Constants
-import {
-    PASSWORDLESS_LOGIN_LANDING_PATH,
-    RESET_PASSWORD_LANDING_PATH
-} from '@salesforce/retail-react-app/app/constants'
-
 const fallback = <Skeleton height="75vh" width="100%" />
-const socialRedirectURI = getConfig()?.app?.login?.social?.redirectURI
 
 // Pages
 const Home = loadable(() => import('./pages/home'), {fallback})
@@ -77,16 +70,6 @@ export const routes = [
         component: ResetPassword,
         exact: true
     },
-    {
-        path: RESET_PASSWORD_LANDING_PATH,
-        component: ResetPassword,
-        exact: true
-    },
-    {
-        path: PASSWORDLESS_LOGIN_LANDING_PATH,
-        component: Login,
-        exact: true
-    },
     {
         path: '/account',
         component: Account
@@ -105,11 +88,6 @@ export const routes = [
         component: LoginRedirect,
         exact: true
     },
-    {
-        path: socialRedirectURI || '/social-callback',
-        component: SocialLoginRedirect,
-        exact: true
-    },
     {
         path: '/cart',
         component: Cart,
@@ -134,16 +112,44 @@ export const routes = [
     {
         path: '/store-locator',
         component: StoreLocator
-    },
-    {
-        path: '*',
-        component: PageNotFound
     }
 ]
 
 export default () => {
     const config = getConfig()
-    return configureRoutes(routes, config, {
-        ignoredRoutes: ['/callback', '*']
+    const loginConfig = config?.app?.login
+    const resetPasswordLandingPath = loginConfig?.resetPassword?.landingPath
+    const socialLoginEnabled = loginConfig?.social?.enabled
+    const socialRedirectURI = loginConfig?.social?.redirectURI
+    const passwordlessLoginEnabled = loginConfig?.passwordless?.enabled
+    const passwordlessLoginLandingPath = loginConfig?.passwordless?.landingPath
+
+    // Add dynamic routes conditionally (only if features are enabled and paths are defined)
+    const dynamicRoutes = [
+        resetPasswordLandingPath && {
+            path: resetPasswordLandingPath,
+            component: ResetPassword,
+            exact: true
+        },
+        passwordlessLoginEnabled &&
+            passwordlessLoginLandingPath && {
+                path: passwordlessLoginLandingPath,
+                component: Login,
+                exact: true
+            },
+        socialLoginEnabled &&
+            socialRedirectURI && {
+                path: socialRedirectURI,
+                component: SocialLoginRedirect,
+                exact: true
+            }
+    ].filter(Boolean)
+
+    const allRoutes = configureRoutes([...routes, ...dynamicRoutes], config, {
+        ignoredRoutes: ['/callback'],
+        fuzzyPathMatching: true
     })
+
+    // Add catch-all route at the end so it doesn't match before dynamic routes
+    return [...allRoutes, {path: '*', component: PageNotFound}]
 }

package/app/routes.test.js

@@ -5,9 +5,281 @@
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
 import routes from '@salesforce/retail-react-app/app/routes'
+import {getConfig} from '@salesforce/pwa-kit-runtime/utils/ssr-config'
+
+// Mock getConfig to return test values
+import mockConfig from '@salesforce/retail-react-app/config/mocks/default'
+jest.mock('@salesforce/pwa-kit-runtime/utils/ssr-config', () => ({
+    getConfig: jest.fn(() => mockConfig)
+}))
 
 describe('Routes', () => {
+    beforeEach(() => {
+        jest.clearAllMocks()
+    })
+
     test('exports a valid react-router configuration', () => {
         expect(Array.isArray(routes) || typeof routes === 'function').toBe(true)
     })
+
+    test('adds catch-all route at the end', () => {
+        const allRoutes = routes()
+        const lastRoute = allRoutes.pop()
+        expect(lastRoute.path).toBe('*')
+    })
+
+    describe('Dynamic routes', () => {
+        describe('Reset password landing route', () => {
+            test.each([
+                ['path is null', null],
+                ['path is empty string', '']
+            ])('does not add route when %s', (_, landingPath) => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            resetPassword: {
+                                landingPath
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const resetPasswordRoute = allRoutes.find(
+                    (route) => route.path === '/custom-reset-password-landing'
+                )
+
+                expect(resetPasswordRoute).toBeUndefined()
+            })
+
+            test('does not add route when landingPath property is missing', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            resetPassword: {}
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const resetPasswordRoute = allRoutes.find(
+                    (route) => route.path === '/reset-password-landing'
+                )
+
+                expect(resetPasswordRoute).toBeUndefined()
+            })
+
+            test('adds route when path is defined', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            resetPassword: {
+                                landingPath: '/reset-password-landing'
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const resetPasswordRoute = allRoutes.find(
+                    (route) => route.path === '/reset-password-landing'
+                )
+
+                expect(resetPasswordRoute).toBeDefined()
+                expect(resetPasswordRoute.exact).toBe(true)
+            })
+        })
+
+        describe('Passwordless login landing route', () => {
+            test('does not add route when disabled', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            passwordless: {
+                                enabled: false,
+                                landingPath: '/custom-passwordless-login-landing'
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const passwordlessRoute = allRoutes.find(
+                    (route) => route.path === '/custom-passwordless-login-landing'
+                )
+
+                expect(passwordlessRoute).toBeUndefined()
+            })
+
+            test.each([
+                ['path is null', null],
+                ['path is empty string', '']
+            ])('does not add route when %s', (_, landingPath) => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            passwordless: {
+                                enabled: true,
+                                landingPath
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const passwordlessRoute = allRoutes.find(
+                    (route) => route.path === '/custom-passwordless-login-landing'
+                )
+
+                expect(passwordlessRoute).toBeUndefined()
+            })
+
+            test('does not add route when landingPath property is missing', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            passwordless: {
+                                enabled: true
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const passwordlessRoute = allRoutes.find(
+                    (route) => route.path === '/custom-passwordless-login-landing'
+                )
+
+                expect(passwordlessRoute).toBeUndefined()
+            })
+
+            test('adds route when enabled and path is defined', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            passwordless: {
+                                enabled: true,
+                                landingPath: '/passwordless-login-landing'
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const passwordlessRoute = allRoutes.find(
+                    (route) => route.path === '/passwordless-login-landing'
+                )
+
+                expect(passwordlessRoute).toBeDefined()
+                expect(passwordlessRoute.exact).toBe(true)
+            })
+        })
+
+        describe('Social login redirect route', () => {
+            test('does not add route when disabled', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            social: {
+                                enabled: false,
+                                redirectURI: '/custom-social-callback'
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const socialRoute = allRoutes.find(
+                    (route) => route.path === '/custom-social-callback'
+                )
+
+                expect(socialRoute).toBeUndefined()
+            })
+
+            test.each([
+                ['redirectURI is null', null],
+                ['redirectURI is empty string', '']
+            ])('does not add route when %s', (_, redirectURI) => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            social: {
+                                enabled: true,
+                                redirectURI
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const socialRoute = allRoutes.find(
+                    (route) => route.path === '/custom-social-callback'
+                )
+
+                expect(socialRoute).toBeUndefined()
+            })
+
+            test('does not add route when redirectURI property is missing', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            social: {
+                                enabled: true
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const socialRoute = allRoutes.find(
+                    (route) => route.path === '/custom-social-callback'
+                )
+
+                expect(socialRoute).toBeUndefined()
+            })
+
+            test('adds route when enabled and URI is defined', () => {
+                getConfig.mockReturnValue({
+                    ...mockConfig,
+                    app: {
+                        ...mockConfig.app,
+                        login: {
+                            social: {
+                                enabled: true,
+                                redirectURI: '/custom-social-callback'
+                            }
+                        }
+                    }
+                })
+
+                const allRoutes = routes()
+                const socialRoute = allRoutes.find(
+                    (route) => route.path === '/custom-social-callback'
+                )
+
+                expect(socialRoute).toBeDefined()
+                expect(socialRoute.exact).toBe(true)
+            })
+        })
+    })
 })

package/app/utils/bonus-product/cart.js

@@ -553,3 +553,35 @@ export const processProductsForBonusCart = (
 
     return productItems
 }
+
+/**
+ * Consolidates duplicate bonus products in a product items array for display purposes.
+ * Groups bonus products by productId and sums their quantities, while keeping non-bonus products as-is.
+ *
+ * @param {Array<Object>} productItems - Array of product items from basket or order
+ * @returns {Array<Object>} Array of product items with consolidated bonus products
+ */
+export const consolidateDuplicateBonusProducts = (productItems) => {
+    if (!productItems || productItems.length === 0) {
+        return []
+    }
+
+    // Separate bonus products from regular products
+    const bonusProducts = []
+    const regularProducts = []
+
+    productItems.forEach((item) => {
+        if (item.bonusProductLineItem) {
+            bonusProducts.push(item)
+        } else {
+            regularProducts.push(item)
+        }
+    })
+
+    // Consolidate duplicate bonus products by productId
+    const consolidatedBonusProducts = aggregateBonusProductQuantities(bonusProducts)
+
+    // Combine regular products with consolidated bonus products
+    // Keep regular products first, then bonus products
+    return [...regularProducts, ...consolidatedBonusProducts]
+}