@salesforce/retail-react-app 6.1.0 → 7.0.0-nightly-20250526080400

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## v7.0.0-dev.0 (May 20, 2025)
+
+- Improved the layout of product tiles in product scroll and product list [#2446](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2446)
+
 ## v6.1.0 (May 22, 2025)
 
 - Fix hreflang alternate links [#2269](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/2269)
@@ -101,6 +105,7 @@
 - Add aria-label for Checkout's action buttons [#1906](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1906)
 - Avoid forced focus changes that are not user-initiated [#1940](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/1940)
 
+
 ## v3.0.2 (Jul 11, 2024)
 
 ### Bug Fixes

package/app/components/nested-accordion/index.jsx

@@ -141,14 +141,14 @@ NestedAccordion.propTypes = {
     item: PropTypes.object.isRequired,
     /**
      * An array of `AccordionItem` components that will be displayed after all
-     * of the child items. Alternatively you can pass a function that will recieve
+     * of the child items. Alternatively you can pass a function that will receive
      * the current item and it's depth, your should return an `AccordionItem` or
      * array of `AccordionItem`'s.
      */
     itemsAfter: PropTypes.oneOfType([PropTypes.array, PropTypes.func]),
     /**
      * An array of `AccordionItem` components that will be displayed before all
-     * of the child items. Alternatively you can pass a function that will recieve
+     * of the child items. Alternatively you can pass a function that will receive
      * the current item and it's depth, your should return an `AccordionItem` or
      * array of `AccordionItem`'s.
      */

package/app/components/product-scroller/index.jsx

@@ -30,7 +30,7 @@ const ProductScroller = forwardRef(
             products,
             isLoading,
             scrollProps,
-            itemWidth = {base: '70%', md: '40%', lg: 'calc(33.33% - 10px)'},
+            itemWidth = {base: '70%', md: '40%', lg: 'calc(25% - 15px)'},
             productTileProps,
             ...props
         },

package/app/components/product-tile/index.test.js

@@ -86,7 +86,7 @@ test('Renders variant details based on the selected swatch', async () => {
     // Initial render will show swatched and the image will be the represented product variation
     expect(swatches).toHaveLength(2)
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg'
     )
     const currentPriceTag = productTile.querySelectorAll('b')
     const strikethroughPriceTag = productTile.querySelectorAll('s')
@@ -100,7 +100,7 @@ test('Renders variant details based on the selected swatch', async () => {
     fireEvent.mouseOver(swatches[0])
     await waitFor(() => screen.getByTestId('product-tile-image'))
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw29b7f226/images/large/PG.52002RUBN4Q.NAVYWL.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed78c6fc/images/medium/PG.52002RUBN4Q.NAVYWL.PZ.jpg'
     )
     expect(currentPriceTag).toHaveLength(1)
     expect(within(currentPriceTag[0]).getByText(/£143\.99/i)).toBeDefined()
@@ -122,7 +122,7 @@ test('Renders variant details based on the selected swatch on mobile', async ()
     // Initial render will show swatched and the image will be the represented product variation
     expect(swatches).toHaveLength(2)
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg'
     )
     const currentPriceTag = productTile.querySelectorAll('b')
     const strikethroughPriceTag = productTile.querySelectorAll('s')
@@ -136,7 +136,7 @@ test('Renders variant details based on the selected swatch on mobile', async ()
     fireEvent.click(swatches[0])
     await waitFor(() => screen.getByTestId('product-tile-image'))
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw29b7f226/images/large/PG.52002RUBN4Q.NAVYWL.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed78c6fc/images/medium/PG.52002RUBN4Q.NAVYWL.PZ.jpg'
     )
     expect(currentPriceTag).toHaveLength(1)
     expect(within(currentPriceTag[0]).getByText(/£143\.99/i)).toBeDefined()
@@ -154,7 +154,7 @@ test('Renders price range with starting price and strikethrough price for master
     expect(getByText(/Long Sleeve Embellished Boat Neck Top/i)).toBeInTheDocument()
     const productImage = getByTestId('product-tile-image')
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw3255ea4c/images/large/PG.10217069.JJ908XX.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwc9ce7da9/images/medium/PG.10217069.JJ908XX.PZ.jpg'
     )
 
     const currentPriceTag = container.querySelectorAll('b')
@@ -171,7 +171,7 @@ test('Renders price range with starting price and strikethrough price for master
     fireEvent.mouseOver(swatches[0])
     await waitFor(() => screen.getByTestId('product-tile-image'))
     expect(productImage.firstChild.getAttribute('src')).toBe(
-        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg'
+        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed56b2da/images/medium/PG.10217069.JJ5QZXX.PZ.jpg'
     )
     expect(currentPriceTag).toHaveLength(1)
     expect(within(currentPriceTag[0]).getByText(/From £18\.55/i)).toBeDefined()

package/app/components/product-view/index.test.js

@@ -128,6 +128,29 @@ test('Product View can update quantity', async () => {
     })
 })
 
+describe('ProductView Component', () => {
+    test('increases quantity when increment button is clicked', async () => {
+        const user = userEvent.setup()
+        renderWithProviders(<ProductView product={mockProductDetail} />)
+
+        const quantityInput = await screen.findByRole('spinbutton')
+        const incrementButton = screen.getByTestId('quantity-increment')
+        const decrementButton = screen.getByTestId('quantity-decrement')
+
+        // Click increment
+        await user.click(incrementButton)
+        await waitFor(() => {
+            expect(quantityInput).toHaveValue('2')
+        })
+
+        // Click decrement
+        await user.click(decrementButton)
+        await waitFor(() => {
+            expect(quantityInput).toHaveValue('1')
+        })
+    })
+})
+
 test('renders a product set properly - parent item', () => {
     const parent = mockProductSet
     renderWithProviders(

package/app/components/quantity-picker/index.test.jsx

@@ -5,7 +5,7 @@
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
 import React, {useState} from 'react'
-import {screen} from '@testing-library/react'
+import {screen, fireEvent} from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import {renderWithProviders} from '@salesforce/retail-react-app/app/utils/test-utils'
 import QuantityPicker from '@salesforce/retail-react-app/app/components/quantity-picker/index'
@@ -34,7 +34,7 @@ describe('QuantityPicker', () => {
         await user.click(button)
         expect(input.value).toBe('4')
     })
-    test('hitting enter/space on plus increments value', async () => {
+    test('typing enter/space on plus increments value', async () => {
         const user = userEvent.setup()
         renderWithProviders(<MockComponent />)
         const input = screen.getByRole('spinbutton')
@@ -44,7 +44,19 @@ describe('QuantityPicker', () => {
         await user.type(button, '{space}')
         expect(input.value).toBe('7')
     })
-    test('hitting space on minus decrements value', async () => {
+
+    test('keydown enter/space on plus increments value', async () => {
+        const user = userEvent.setup()
+        renderWithProviders(<MockComponent />)
+        const input = screen.getByRole('spinbutton')
+        const button = screen.getByText('+')
+        fireEvent.keyDown(button, {key: 'Enter'})
+        expect(input.value).toBe('6')
+        fireEvent.keyDown(button, {key: ' '})
+        expect(input.value).toBe('7')
+    })
+
+    test('typing space on minus decrements value', async () => {
         const user = userEvent.setup()
         renderWithProviders(<MockComponent />)
         const input = screen.getByRole('spinbutton')
@@ -54,6 +66,18 @@ describe('QuantityPicker', () => {
         await user.type(button, '{space}')
         expect(input.value).toBe('3')
     })
+
+    test('keydown enter/space on minus decrements value', async () => {
+        const user = userEvent.setup()
+        renderWithProviders(<MockComponent />)
+        const input = screen.getByRole('spinbutton')
+        const button = screen.getByText(MINUS)
+        fireEvent.keyDown(button, {key: 'Enter'})
+        expect(input.value).toBe('4')
+        fireEvent.keyDown(button, {key: ' '})
+        expect(input.value).toBe('3')
+    })
+
     test('plus button is tabbable', async () => {
         const user = userEvent.setup()
         renderWithProviders(<MockComponent />)

package/app/constants.js

@@ -18,7 +18,7 @@ export const STALE_WHILE_REVALIDATE = 60 * 15 // 15 min
 export const DEFAULT_SEARCH_PARAMS = {limit: 25, offset: 0, sort: 'best-matches', refine: []}
 export const DEFAULT_LIMIT_VALUES = [25, 50, 100] // Page sizes
 
-//Constants for customer orders searching.
+// Constants for customer orders searching.
 export const DEFAULT_ORDERS_SEARCH_PARAMS = {limit: 10, offset: 0, sort: 'best-matches', refine: []}
 
 // Constants for Search Component
@@ -27,11 +27,11 @@ export const RECENT_SEARCH_KEY = 'recent-search-key'
 export const RECENT_SEARCH_MIN_LENGTH = 3
 
 // Constants for product list page
-export const PRODUCT_LIST_IMAGE_VIEW_TYPE = 'large'
+export const PRODUCT_LIST_IMAGE_VIEW_TYPE = 'medium'
 export const PRODUCT_LIST_SELECTABLE_ATTRIBUTE_ID = 'color'
 
 // Constants for product tile page
-export const PRODUCT_TILE_IMAGE_VIEW_TYPE = 'large'
+export const PRODUCT_TILE_IMAGE_VIEW_TYPE = 'medium'
 export const PRODUCT_TILE_SELECTABLE_ATTRIBUTE_ID = 'color'
 
 // Constants for the Homepage's Shop Products section.

package/app/hooks/use-auth-modal.test.js

@@ -357,7 +357,7 @@ test('Allows customer to create an account', async () => {
     )
 })
 
-// TODO: investingate why this test is failing when running with other tests
+// TODO: investigate why this test is failing when running with other tests
 // eslint-disable-next-line jest/no-disabled-tests
 test.skip('Allows customer to sign in to their account', async () => {
     const user = userEvent.setup()

package/app/hooks/use-multi-site.js

@@ -10,7 +10,7 @@ import {MultiSiteContext} from '@salesforce/retail-react-app/app/contexts'
 
 /**
  * Custom React hook to get the function that returns usefule multi-site values, the site, the locale and
- * the funtion used to build URLs following the App configuration.
+ * the function used to build URLs following the App configuration.
  * @returns {{site, locale, buildUrl: (function(*, *, *): *)}}
  */
 const useMultiSite = () => {

package/app/mocks/product-search-hit-data.js

@@ -17,10 +17,10 @@ const mockProductSearchItem = {
         {
             images: [
                 {
-                    alt: 'Charcoal Single Pleat Wool Suit, , large',
+                    alt: 'Charcoal Single Pleat Wool Suit, , medium',
                     disBaseLink:
-                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
-                    link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
+                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
+                    link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
                     title: 'Charcoal Single Pleat Wool Suit, '
                 },
                 {
@@ -36,10 +36,10 @@ const mockProductSearchItem = {
         {
             images: [
                 {
-                    alt: 'Charcoal Single Pleat Wool Suit, Charcoal, large',
+                    alt: 'Charcoal Single Pleat Wool Suit, Charcoal, medium',
                     disBaseLink:
-                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
-                    link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw175c1a89/images/large/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
+                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
+                    link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw23283a20/images/medium/PG.33698RUBN4Q.CHARCWL.PZ.jpg',
                     title: 'Charcoal Single Pleat Wool Suit, Charcoal'
                 },
                 {
@@ -535,9 +535,9 @@ const mockStandardProductHit = {
     currency: 'GBP',
     hitType: 'product',
     image: {
-        alt: 'Laptop Briefcase with wheels (37L), , large',
+        alt: 'Laptop Briefcase with wheels (37L), , medium',
         disBaseLink:
-            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7cb2d401/images/large/P0048_001.jpg',
+            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwcc8912f4/images/medium/P0048_001.jpg?sw=768&q=60',
         link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7cb2d401/images/large/P0048_001.jpg',
         title: 'Laptop Briefcase with wheels (37L), '
     },
@@ -578,9 +578,9 @@ const mockMasterProductHitWithOneVariant = {
     currency: 'GBP',
     hitType: 'master',
     image: {
-        alt: 'Black Flat Front Wool Suit, , large',
+        alt: 'Black Flat Front Wool Suit, , medium',
         disBaseLink:
-            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw3d8972fe/images/large/PG.52001DAN84Q.BLACKWL.PZ.jpg',
+            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw5aa46219/images/medium/PG.52001DAN84Q.BLACKWL.PZ.jpg',
         link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw3d8972fe/images/large/PG.52001DAN84Q.BLACKWL.PZ.jpg',
         title: 'Black Flat Front Wool Suit, '
     },
@@ -704,9 +704,9 @@ const mockMasterProductHitWithMultipleVariants = {
     currency: 'GBP',
     hitType: 'master',
     image: {
-        alt: 'Long Sleeve Embellished Boat Neck Top, , large',
+        alt: 'Long Sleeve Embellished Boat Neck Top, , medium',
         disBaseLink:
-            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
+            'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed56b2da/images/medium/PG.10217069.JJ5QZXX.PZ.jpg',
         link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
         title: 'Long Sleeve Embellished Boat Neck Top, '
     },
@@ -714,9 +714,9 @@ const mockMasterProductHitWithMultipleVariants = {
         {
             images: [
                 {
-                    alt: 'Long Sleeve Embellished Boat Neck Top, , large',
+                    alt: 'Long Sleeve Embellished Boat Neck Top, , medium',
                     disBaseLink:
-                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
+                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed56b2da/images/medium/PG.10217069.JJ5QZXX.PZ.jpg',
                     link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
                     title: 'Long Sleeve Embellished Boat Neck Top, '
                 },
@@ -733,9 +733,9 @@ const mockMasterProductHitWithMultipleVariants = {
         {
             images: [
                 {
-                    alt: 'Long Sleeve Embellished Boat Neck Top, Begonia Pink, large',
+                    alt: 'Long Sleeve Embellished Boat Neck Top, Begonia Pink, medium',
                     disBaseLink:
-                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
+                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwed56b2da/images/medium/PG.10217069.JJ5QZXX.PZ.jpg',
                     link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw7e4c00a0/images/large/PG.10217069.JJ5QZXX.PZ.jpg',
                     title: 'Long Sleeve Embellished Boat Neck Top, Begonia Pink'
                 },
@@ -762,9 +762,9 @@ const mockMasterProductHitWithMultipleVariants = {
         {
             images: [
                 {
-                    alt: 'Long Sleeve Embellished Boat Neck Top, Grey Heather, large',
+                    alt: 'Long Sleeve Embellished Boat Neck Top, Grey Heather, medium',
                     disBaseLink:
-                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dw3255ea4c/images/large/PG.10217069.JJ908XX.PZ.jpg',
+                        'https://edge.disstg.commercecloud.salesforce.com/dw/image/v2/ZZRF_001/on/demandware.static/-/Sites-apparel-m-catalog/default/dwc9ce7da9/images/medium/PG.10217069.JJ908XX.PZ.jpg',
                     link: 'https://zzrf-001.dx.commercecloud.salesforce.com/on/demandware.static/-/Sites-apparel-m-catalog/default/dw3255ea4c/images/large/PG.10217069.JJ908XX.PZ.jpg',
                     title: 'Long Sleeve Embellished Boat Neck Top, Grey Heather'
                 },

package/app/pages/account/index.test.js

@@ -140,8 +140,8 @@ describe('Render and logs out', function () {
             expect(logOutIcons[1]).toHaveAttribute('aria-hidden', 'true')
         })
 
-        await user.click(screen.getAllByText(/Log Out/)[0])
         useCustomerType.mockReturnValue({isRegistered: false, isGuest: true})
+        await user.click(screen.getAllByText(/Log Out/)[0])
 
         await waitFor(() => {
             expect(window.location.pathname).toBe(`${expectedBasePath}/login`)

package/app/pages/cart/index.test.js

@@ -28,6 +28,7 @@ import {
     baskets as mockBaskets,
     products as mockProducts
 } from '@salesforce/retail-react-app/app/pages/cart/cart.mock'
+import userEvent from '@testing-library/user-event'
 
 const mockProduct = {
     ...mockVariant,
@@ -549,6 +550,128 @@ describe('Update this is a gift option', function () {
         })
     })
 })
+describe('Update this is not a gift option', function () {
+    beforeEach(() => {
+        global.server.use(
+            rest.patch('*/baskets/:basketId/items/:itemId', (req, res, ctx) => {
+                const basket = mockCustomerBaskets.baskets[0]
+                const updatedBasket = {
+                    ...basket,
+                    productItems: [
+                        {
+                            adjustedTax: 2.93,
+                            basePrice: 61.43,
+                            bonusProductLineItem: false,
+                            gift: false,
+                            itemId: '4a9af0a24fe46c3f6d8721b371',
+                            itemText: 'Belted Cardigan With Studs',
+                            price: 61.43,
+                            priceAfterItemDiscount: 61.43,
+                            priceAfterOrderDiscount: 61.43,
+                            productId: '701642889830M',
+                            productName: 'Belted Cardigan With Studs',
+                            quantity: 2,
+                            shipmentId: 'me',
+                            tax: 2.93,
+                            taxBasis: 61.43,
+                            taxClassId: 'standard',
+                            taxRate: 0.05
+                        }
+                    ]
+                }
+                return res(ctx.json(updatedBasket))
+            }),
+            rest.get('*/customers/:customerId/baskets', (req, res, ctx) => {
+                return res(
+                    ctx.delay(0),
+                    ctx.json({
+                        baskets: [
+                            {
+                                ...mockCustomerBaskets.baskets[0],
+                                productItems: [
+                                    {
+                                        adjustedTax: 2.93,
+                                        basePrice: 61.43,
+                                        bonusProductLineItem: false,
+                                        gift: true,
+                                        itemId: '4a9af0a24fe46c3f6d8721b371',
+                                        itemText: 'Belted Cardigan With Studs',
+                                        price: 61.43,
+                                        priceAfterItemDiscount: 61.43,
+                                        priceAfterOrderDiscount: 61.43,
+                                        productId: '701642889830M',
+                                        productName: 'Belted Cardigan With Studs',
+                                        quantity: 2,
+                                        shipmentId: 'me',
+                                        tax: 2.93,
+                                        taxBasis: 61.43,
+                                        taxClassId: 'standard',
+                                        taxRate: 0.05
+                                    }
+                                ]
+                            }
+                        ],
+                        total: 1
+                    })
+                )
+            })
+        )
+    })
+    test('can update cart item when user unchecks the gift checkbox', async () => {
+        const {user} = renderWithProviders(<Cart />)
+        await waitFor(() => {
+            expect(screen.getByTestId('sf-cart-container')).toBeInTheDocument()
+            expect(screen.getByText(/Belted Cardigan With Studs/i)).toBeInTheDocument()
+
+            const cartItem = screen.getByTestId('sf-cart-item-701642889830M')
+            expect(cartItem).toBeInTheDocument()
+        })
+
+        const giftCheckbox = screen.getByRole('checkbox')
+        expect(giftCheckbox).toBeChecked()
+        await user.click(giftCheckbox)
+        global.server.use(
+            rest.get('*/customers/:customerId/baskets', (req, res, ctx) => {
+                return res.once(
+                    ctx.delay(0),
+                    ctx.json({
+                        baskets: [
+                            {
+                                ...mockCustomerBaskets.baskets[0],
+                                productItems: [
+                                    {
+                                        adjustedTax: 2.93,
+                                        basePrice: 61.43,
+                                        bonusProductLineItem: false,
+                                        gift: false,
+                                        itemId: '4a9af0a24fe46c3f6d8721b371',
+                                        itemText: 'Belted Cardigan With Studs',
+                                        price: 61.43,
+                                        priceAfterItemDiscount: 61.43,
+                                        priceAfterOrderDiscount: 61.43,
+                                        productId: '701642889830M',
+                                        productName: 'Belted Cardigan With Studs',
+                                        quantity: 2,
+                                        shipmentId: 'me',
+                                        tax: 2.93,
+                                        taxBasis: 61.43,
+                                        taxClassId: 'standard',
+                                        taxRate: 0.05
+                                    }
+                                ]
+                            }
+                        ],
+                        total: 1
+                    })
+                )
+            })
+        )
+
+        await waitFor(() => {
+            expect(giftCheckbox).not.toBeChecked()
+        })
+    })
+})
 
 describe('Product bundles', () => {
     beforeEach(() => {
@@ -796,3 +919,26 @@ describe('Unavailable products tests', function () {
         })
     })
 })
+
+test('shows error toast when updating cart item fails', async () => {
+    // Mock the update item API to fail
+    global.server.use(
+        rest.patch('*/baskets/:basketId/items/:itemId', (req, res, ctx) => {
+            return res(ctx.status(500))
+        })
+    )
+
+    renderWithProviders(<Cart />)
+    await waitFor(() => expect(screen.getByTestId('sf-cart-container')).toBeInTheDocument())
+
+    // Find the first "Edit" button and click it to open the edit modal
+    const editButtons = await screen.findAllByRole('button', {name: /edit/i})
+    await userEvent.click(editButtons[0])
+
+    // In the modal, find and click the "Update" or "Save" button (adjust selector as needed)
+    const updateButton = await screen.findByRole('button', {name: /update|save/i})
+    await userEvent.click(updateButton)
+
+    // Wait for the error toast to appear
+    await waitFor(() => expect(screen.getByText(/something went wrong/i)).toBeInTheDocument())
+})

package/app/pages/checkout/partials/checkout-footer.test.js

@@ -14,3 +14,10 @@ test('renders component', () => {
     renderWithProviders(<CheckoutFooter />)
     expect(screen.getByRole('link', {name: 'Shipping'})).toBeInTheDocument()
 })
+
+test('displays copyright message with current year', () => {
+    renderWithProviders(<CheckoutFooter />)
+    const currentYear = new Date().getFullYear()
+    const copyrightText = `© ${currentYear} Salesforce or its affiliates. All rights reserved. This is a demo store only. Orders made WILL NOT be processed.`
+    expect(screen.getByText(copyrightText)).toBeInTheDocument()
+})

package/app/pages/login/index.test.js

@@ -99,6 +99,39 @@ describe('Logging in tests', function () {
         )
     })
 
+    test('Shows inline error when email is empty', async () => {
+        const {user} = renderWithProviders(<MockedComponent />, {
+            wrapperProps: {
+                siteAlias: 'uk',
+                locale: {id: 'en-GB'},
+                appConfig: mockConfig.app,
+                bypassAuth: false
+            }
+        })
+
+        // Only fill password, leave email empty
+        await user.type(screen.getByLabelText('Password'), 'Password!1')
+        // Try to submit the form
+        await user.click(screen.getByText(/sign in/i))
+        expect(await screen.findByText(/Please enter your email address\./i)).toBeInTheDocument()
+    })
+
+    test('Shows inline error when password is empty', async () => {
+        const {user} = renderWithProviders(<MockedComponent />, {
+            wrapperProps: {
+                siteAlias: 'uk',
+                locale: {id: 'en-GB'},
+                appConfig: mockConfig.app,
+                bypassAuth: false
+            }
+        })
+        // Only fill email, leave password empty
+        await user.type(screen.getByLabelText('Email'), 'customer@test.com')
+        // Try to submit the form
+        await user.click(screen.getByText(/sign in/i))
+        expect(await screen.findByText(/Please enter your password\./i)).toBeInTheDocument()
+    })
+
     test('Allows customer to sign in to their account', async () => {
         const {user} = renderWithProviders(<MockedComponent />, {
             wrapperProps: {

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

@@ -554,7 +554,7 @@ const ProductList = (props) => {
                         </Stack>
                         <Box>
                             <SimpleGrid
-                                columns={[2, 2, 3, 3]}
+                                columns={[2, 2, 4, 5]}
                                 spacingX={4}
                                 spacingY={{base: 12, lg: 16}}
                             >

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforce/retail-react-app",
-  "version": "6.1.0",
+  "version": "7.0.0-nightly-20250526080400",
   "license": "See license in LICENSE",
   "author": "cc-pwa-kit@salesforce.com",
   "ccExtensibility": {
@@ -46,10 +46,10 @@
     "@loadable/component": "^5.15.3",
     "@peculiar/webcrypto": "^1.4.2",
     "@salesforce/cc-datacloud-typescript": "1.1.2",
-    "@salesforce/commerce-sdk-react": "3.3.0",
-    "@salesforce/pwa-kit-dev": "3.10.0",
-    "@salesforce/pwa-kit-react-sdk": "3.10.0",
-    "@salesforce/pwa-kit-runtime": "3.10.0",
+    "@salesforce/commerce-sdk-react": "3.4.0-nightly-20250526080400",
+    "@salesforce/pwa-kit-dev": "3.11.0-nightly-20250526080400",
+    "@salesforce/pwa-kit-react-sdk": "3.11.0-nightly-20250526080400",
+    "@salesforce/pwa-kit-runtime": "3.11.0-nightly-20250526080400",
     "@tanstack/react-query": "^4.28.0",
     "@tanstack/react-query-devtools": "^4.29.1",
     "@testing-library/dom": "^9.0.1",
@@ -107,5 +107,5 @@
       "maxSize": "328 kB"
     }
   ],
-  "gitHead": "da9ff1c4b28222ba4d27661be61c18f43192c83d"
+  "gitHead": "f7cdce47d5702c370abf36a0a639bd6e7fee89c6"
 }