@W-19743729 remove shipment dropdown from cart, put orphan bonus products in the end (#3358)

* remove shipment dropdown from cart, put orphan bonus products in the end

* lint, tests

Author: sf-shikhar-prasoon

packages/template-retail-react-app/app/pages/cart/index.jsx

@@ -5,15 +5,11 @@
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
  */
 import React from 'react'
+import PropTypes from 'prop-types'
 import {FormattedMessage} from 'react-intl'
 import {Box, Text} from '@salesforce/retail-react-app/app/components/shared/ui'
-import {useCurrentBasket} from '@salesforce/retail-react-app/app/hooks/use-current-basket'
-
-const BonusProductsTitle = () => {
-    const {data: basket} = useCurrentBasket()
-    const bonusItemsCount =
-        basket?.productItems?.filter((item) => item.bonusProductLineItem)?.length || 0
 
+const BonusProductsTitle = ({bonusItemsCount = 0}) => {
     return (
         <Box layerStyle="cardBordered" p={3}>
             <Text fontWeight="bold">
@@ -27,4 +23,8 @@ const BonusProductsTitle = () => {
     )
 }
 
+BonusProductsTitle.propTypes = {
+    bonusItemsCount: PropTypes.number
+}
+
 export default BonusProductsTitle

packages/template-retail-react-app/app/pages/cart/index.test.js

@@ -8,51 +8,25 @@ import React from 'react'
 import {screen} from '@testing-library/react'
 import {renderWithProviders} from '@salesforce/retail-react-app/app/utils/test-utils'
 import BonusProductsTitle from '@salesforce/retail-react-app/app/pages/cart/partials/bonus-products-title'
-import {useCurrentBasket} from '@salesforce/retail-react-app/app/hooks/use-current-basket'
-
-// Mock the useCurrentBasket hook
-jest.mock('@salesforce/retail-react-app/app/hooks/use-current-basket')
 
 describe('BonusProductsTitle', () => {
-    beforeEach(() => {
-        jest.clearAllMocks()
-        // Provide a default mock that includes derivedData to prevent AddToCartModal errors
-        useCurrentBasket.mockReturnValue({
-            data: {},
-            derivedData: {totalItems: 0}
-        })
-    })
-
     it('renders title with 1 item when one bonus product', () => {
-        const basketData = {
-            productItems: [
-                {id: '1', bonusProductLineItem: true},
-                {id: '2', bonusProductLineItem: false}
-            ]
-        }
-        useCurrentBasket.mockReturnValue({
-            data: basketData,
-            derivedData: {totalItems: 2}
-        })
-
-        renderWithProviders(<BonusProductsTitle />)
+        renderWithProviders(<BonusProductsTitle bonusItemsCount={1} />)
         expect(screen.getByText('Bonus Products (1 item)')).toBeInTheDocument()
     })
 
     it('renders title with multiple items when multiple bonus products', () => {
-        const basketData = {
-            productItems: [
-                {id: '1', bonusProductLineItem: true},
-                {id: '2', bonusProductLineItem: true},
-                {id: '3', bonusProductLineItem: false}
-            ]
-        }
-        useCurrentBasket.mockReturnValue({
-            data: basketData,
-            derivedData: {totalItems: 3}
-        })
+        renderWithProviders(<BonusProductsTitle bonusItemsCount={2} />)
+        expect(screen.getByText('Bonus Products (2 items)')).toBeInTheDocument()
+    })
 
+    it('renders title with 0 items when no bonus products', () => {
+        renderWithProviders(<BonusProductsTitle bonusItemsCount={0} />)
+        expect(screen.getByText('Bonus Products (0 items)')).toBeInTheDocument()
+    })
+
+    it('renders title with default count when no prop provided', () => {
         renderWithProviders(<BonusProductsTitle />)
-        expect(screen.getByText('Bonus Products (2 items)')).toBeInTheDocument()
+        expect(screen.getByText('Bonus Products (0 items)')).toBeInTheDocument()
     })
 })

packages/template-retail-react-app/app/pages/cart/partials/bonus-products-title.jsx

@@ -185,8 +185,6 @@ const CartProductListWithGroupedBonusProducts = ({
                     )
                 }
             })}
-
-            {/* Temporarily disabled orphan bonus products for debugging */}
         </Stack>
     )
 }

packages/template-retail-react-app/app/pages/cart/partials/bonus-products-title.test.js

@@ -7,7 +7,8 @@
 
 import {
     isProductEligibleForBonusProducts,
-    isProductAvailableAsBonus
+    isProductAvailableAsBonus,
+    getPromotionIdsForProduct
 } from '@salesforce/retail-react-app/app/utils/bonus-product/common'
 
 /**
@@ -24,11 +25,43 @@ import {
  * - UI behavior determination
  */
 
+/**
+ * Determines if a product's promotions are automatic (no choice) or manual (choice of bonus products).
+ * Automatic promotions add bonus products directly to cart without user selection.
+ * Choice promotions allow users to select which bonus products they want.
+ *
+ * @param {Object} basket - The current basket data
+ * @param {string} productId - The product ID to check
+ * @param {Object} productsWithPromotions - Object mapping productId to product data with promotions
+ * @returns {boolean} True if product has automatic promotions only
+ */
+export const isAutomaticPromotion = (basket, productId, productsWithPromotions) => {
+    if (!basket || !productId || !productsWithPromotions) {
+        return false
+    }
+
+    // Get promotion IDs for this product
+    const promotionIds = getPromotionIdsForProduct(basket, productId, productsWithPromotions)
+
+    if (promotionIds.length === 0) {
+        return false
+    }
+
+    // Check if ANY of this product's promotions have bonusDiscountLineItems (choice promotions)
+    const hasChoicePromotions =
+        basket.bonusDiscountLineItems?.some((item) => promotionIds.includes(item.promotionId)) ||
+        false
+
+    // Automatic if no choice promotions found
+    return !hasChoicePromotions
+}
+
 /**
  * Enhanced check if a product should show bonus product selection.
  * A product is eligible if:
  * 1. It has promotions that can trigger bonus products
  * 2. It is NOT itself available as a bonus product in the current basket
+ * 3. It is NOT an automatic promotion (which doesn't need selection UI)
  * @param {Object} basket - The current basket data
  * @param {string} productId - The product ID to check
  * @param {Object} productsWithPromotions - Object mapping productId to product data with promotions
@@ -44,6 +77,16 @@ export const shouldShowBonusProductSelection = (basket, productId, productsWithP
     // Then check if this product is itself available as a bonus product
     // If it is, it shouldn't show bonus product selection when added as a regular item
     const isAvailableAsBonus = isProductAvailableAsBonus(basket, productId)
+    if (isAvailableAsBonus) {
+        return false
+    }
+
+    // Finally check if this is an automatic promotion
+    // Automatic promotions don't need selection UI since products are added automatically
+    const isAutomatic = isAutomaticPromotion(basket, productId, productsWithPromotions)
+    if (isAutomatic) {
+        return false
+    }
 
-    return !isAvailableAsBonus
+    return true
 }

packages/template-retail-react-app/app/pages/cart/partials/cart-product-list-with-grouped-bonus-products.jsx

@@ -13,6 +13,7 @@ describe('Bonus Product Business Logic', () => {
             const basket = {
                 bonusDiscountLineItems: [
                     {
+                        promotionId: 'promo-1', // Include the promotion ID to make it a choice promotion
                         bonusProducts: [{productId: 'different-product'}]
                     }
                 ]

packages/template-retail-react-app/app/utils/bonus-product/business-logic.js

@@ -41,7 +41,10 @@ export {
 export {getBonusProductCountsForPromotion} from '@salesforce/retail-react-app/app/utils/bonus-product/calculations'
 
 // Re-export business logic utilities
-export {shouldShowBonusProductSelection} from '@salesforce/retail-react-app/app/utils/bonus-product/business-logic'
+export {
+    shouldShowBonusProductSelection,
+    isAutomaticPromotion
+} from '@salesforce/retail-react-app/app/utils/bonus-product/business-logic'
 
 // Re-export React hooks
 export {
@@ -50,18 +53,3 @@ export {
     useAvailableBonusItemsForProduct,
     useRemainingAvailableBonusProductsForProduct
 } from '@salesforce/retail-react-app/app/utils/bonus-product/hooks'
-
-// Shipment management utilities
-export const getBonusProductsForQualifyingItems = (basket, qualifyingItems) => {
-    if (!basket?.productItems || !qualifyingItems?.length) return []
-
-    return basket.productItems.filter((productItem) => {
-        if (!productItem.bonusProductLineItem) return false
-
-        return qualifyingItems.some(
-            (qualifyingItem) =>
-                productItem.qualifyingProductItemId === qualifyingItem.itemId ||
-                productItem.shipmentId === qualifyingItem.shipmentId
-        )
-    })
-}