@salesforce/retail-react-app 7.1.0-preview.1 → 8.0.0-dev

package/app/hooks/use-product-address-assignment.js

@@ -0,0 +1,280 @@
+/*
+ * Copyright (c) 2025, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+import {useState, useEffect, useCallback, useMemo, useRef} from 'react'
+import {nanoid} from 'nanoid'
+import {useCurrentCustomer} from '@salesforce/retail-react-app/app/hooks/use-current-customer'
+import {
+    areAddressesEqual,
+    isAddressEmpty
+} from '@salesforce/retail-react-app/app/utils/address-utils'
+import {isPickupMethod} from '@salesforce/retail-react-app/app/utils/shipment-utils'
+
+/**
+ * Managing address selection state with product delivery items
+ */
+export const useProductAddressAssignment = (basket) => {
+    const {data: customer} = useCurrentCustomer()
+
+    const deliveryItems = useMemo(() => {
+        return (
+            basket?.productItems?.filter((item) => {
+                const shipment = basket?.shipments?.find((s) => s.shipmentId === item.shipmentId)
+                return !isPickupMethod(shipment?.shippingMethod)
+            }) || []
+        )
+    }, [basket?.productItems, basket?.shipments])
+
+    const [guestAddresses, setGuestAddresses] = useState([])
+    const [selectedGuestAddresses, setSelectedGuestAddresses] = useState({})
+    const [selectedRegisteredUserAddresses, setSelectedRegisteredUserAddresses] = useState({})
+
+    // track if already initialized addresses to prevent infinite loops
+    const hasInitialized = useRef(false)
+
+    const availableAddresses = useMemo(() => {
+        if (customer?.isGuest) {
+            return guestAddresses
+        }
+        return customer?.addresses || []
+    }, [customer, guestAddresses])
+
+    // initialize address selections -registered users
+    useEffect(() => {
+        if (
+            customer?.customerId &&
+            customer?.isRegistered &&
+            deliveryItems?.length > 0 &&
+            availableAddresses.length > 0
+        ) {
+            const initialSelected = {}
+
+            const existingShipments =
+                basket?.shipments?.filter(
+                    (shipment) =>
+                        shipment.shippingAddress && !isPickupMethod(shipment?.shippingMethod)
+                ) || []
+
+            if (existingShipments.length > 0) {
+                deliveryItems.forEach((item) => {
+                    const addressKey = item.itemId
+                    const shipment = existingShipments.find((s) => s.shipmentId === item.shipmentId)
+
+                    if (shipment && shipment.shippingAddress) {
+                        const matchingAddress = availableAddresses.find((addr) =>
+                            areAddressesEqual(addr, shipment.shippingAddress)
+                        )
+
+                        if (matchingAddress) {
+                            initialSelected[addressKey] = matchingAddress.addressId
+                        } else if (availableAddresses.length > 0) {
+                            // fall back to first customer address if no match
+                            initialSelected[addressKey] = availableAddresses[0].addressId
+                        }
+                    } else {
+                        // set default for items that don't have a address assignment yet
+                        if (availableAddresses.length > 0) {
+                            const defaultAddress =
+                                availableAddresses.find((addr) => addr.preferred) ||
+                                availableAddresses[0]
+                            if (defaultAddress) {
+                                initialSelected[addressKey] = defaultAddress.addressId
+                            }
+                        }
+                    }
+                })
+            } else if (availableAddresses.length > 0) {
+                // Fall back to customer addresses if no existing shipments
+                deliveryItems.forEach((item) => {
+                    const addressKey = item.itemId
+                    // preferred address or use first address as default
+                    const defaultAddress =
+                        availableAddresses.find((addr) => addr.preferred) || availableAddresses[0]
+                    if (defaultAddress) {
+                        initialSelected[addressKey] = defaultAddress.addressId
+                    }
+                })
+            }
+
+            // Only update if we have new selections and they're different from current
+            if (Object.keys(initialSelected).length > 0) {
+                setSelectedRegisteredUserAddresses((prev) => {
+                    const newState = {...prev}
+                    let hasChanges = false
+
+                    deliveryItems.forEach((item) => {
+                        const addressKey = item.itemId
+                        if (!prev[addressKey] && initialSelected[addressKey]) {
+                            newState[addressKey] = initialSelected[addressKey]
+                            hasChanges = true
+                        }
+                    })
+
+                    return hasChanges ? newState : prev
+                })
+            }
+        }
+    }, [
+        customer?.customerId,
+        customer?.isGuest,
+        availableAddresses.length,
+        basket?.shipments?.length,
+        deliveryItems?.length
+    ])
+
+    // initialize address selections -guest
+    useEffect(() => {
+        if (customer?.isGuest && deliveryItems?.length > 0 && !hasInitialized.current) {
+            const existingShipments =
+                basket?.shipments?.filter(
+                    (shipment) =>
+                        shipment.shippingAddress && !isPickupMethod(shipment?.shippingMethod)
+                ) || []
+
+            if (existingShipments.length > 0) {
+                const newGuestAddresses = []
+                const newSelectedAddresses = {}
+
+                deliveryItems.forEach((item) => {
+                    const addressKey = item.itemId
+                    const shipment = existingShipments.find((s) => s.shipmentId === item.shipmentId)
+
+                    if (shipment && !isAddressEmpty(shipment.shippingAddress)) {
+                        const existingAddress = guestAddresses.find((addr) =>
+                            areAddressesEqual(addr, shipment.shippingAddress)
+                        )
+
+                        if (existingAddress) {
+                            newSelectedAddresses[addressKey] = existingAddress.addressId
+                        } else {
+                            const addressId = `guest_${item.itemId}`
+                            const address = {
+                                addressId,
+                                firstName: shipment.shippingAddress.firstName,
+                                lastName: shipment.shippingAddress.lastName,
+                                address1: shipment.shippingAddress.address1,
+                                city: shipment.shippingAddress.city,
+                                stateCode: shipment.shippingAddress.stateCode,
+                                postalCode: shipment.shippingAddress.postalCode,
+                                countryCode: shipment.shippingAddress.countryCode,
+                                phone: shipment.shippingAddress.phone,
+                                isGuestAddress: true,
+                                originalShipmentId: shipment.shipmentId
+                            }
+
+                            newGuestAddresses.push(address)
+                            newSelectedAddresses[addressKey] = addressId
+                        }
+                    }
+                })
+
+                // update state if we have new addresses/selections
+                if (newGuestAddresses.length > 0) {
+                    setGuestAddresses((prev) => {
+                        const allAddresses = [...prev, ...newGuestAddresses]
+                        const uniqueAddresses = []
+
+                        allAddresses.forEach((addr) => {
+                            const isDuplicate = uniqueAddresses.some((existingAddr) =>
+                                areAddressesEqual(addr, existingAddr)
+                            )
+
+                            if (!isDuplicate) {
+                                uniqueAddresses.push(addr)
+                            }
+                        })
+
+                        return uniqueAddresses
+                    })
+                }
+                if (Object.keys(newSelectedAddresses).length > 0) {
+                    setSelectedGuestAddresses((prev) => ({...prev, ...newSelectedAddresses}))
+                }
+                hasInitialized.current = true
+            }
+        }
+    }, [customer?.isGuest, basket?.productItems?.length, basket?.shipments?.length])
+
+    const selectedAddresses = customer?.isGuest
+        ? selectedGuestAddresses
+        : selectedRegisteredUserAddresses
+
+    const setAddressesForItems = useCallback(
+        (itemIds, addressId) => {
+            const itemIdArray = Array.isArray(itemIds) ? itemIds : [itemIds]
+
+            if (customer?.isGuest) {
+                setSelectedGuestAddresses((prev) => {
+                    const newState = {...prev}
+                    if (addressId === '') {
+                        // Remove selections for specified items
+                        itemIdArray.forEach((itemId) => {
+                            delete newState[itemId]
+                        })
+                    } else {
+                        // Set selections for specified items
+                        itemIdArray.forEach((itemId) => {
+                            newState[itemId] = addressId
+                        })
+                    }
+                    return newState
+                })
+            } else {
+                setSelectedRegisteredUserAddresses((prev) => {
+                    const newState = {...prev}
+                    if (addressId === '') {
+                        // Remove selections for specified items
+                        itemIdArray.forEach((itemId) => {
+                            delete newState[itemId]
+                        })
+                    } else {
+                        // Set selections for specified items
+                        itemIdArray.forEach((itemId) => {
+                            newState[itemId] = addressId
+                        })
+                    }
+                    return newState
+                })
+            }
+        },
+        [customer?.isGuest]
+    )
+
+    const addGuestAddress = useCallback((address) => {
+        const newAddress = {
+            ...address,
+            addressId: `guest_${nanoid()}`,
+            isGuestAddress: true
+        }
+        setGuestAddresses((prev) => [...prev, newAddress])
+        return newAddress
+    }, [])
+
+    const itemAddressMap = useMemo(() => {
+        const map = {}
+        deliveryItems.forEach((item) => {
+            const addressId = selectedAddresses[item.itemId]
+            const address = availableAddresses.find((addr) => addr.addressId === addressId)
+            if (address) {
+                map[item.itemId] = address
+            }
+        })
+        return map
+    }, [deliveryItems, selectedAddresses, availableAddresses])
+
+    const allItemsHaveAddresses = useMemo(() => {
+        return deliveryItems.every((item) => itemAddressMap[item.itemId])
+    }, [deliveryItems, itemAddressMap])
+
+    return {
+        availableAddresses: availableAddresses || [],
+        selectedAddresses: selectedAddresses || {},
+        addGuestAddress,
+        setAddressesForItems,
+        deliveryItems: deliveryItems || [],
+        allItemsHaveAddresses
+    }
+}

package/app/hooks/use-product-address-assignment.test.js

@@ -0,0 +1,414 @@
+/*
+ * Copyright (c) 2025, Salesforce, Inc.
+ * All rights reserved.
+ * SPDX-License-Identifier: BSD-3-Clause
+ * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/BSD-3-Clause
+ */
+
+import {renderHook, act} from '@testing-library/react'
+import {useProductAddressAssignment} from '@salesforce/retail-react-app/app/hooks/use-product-address-assignment'
+
+// Mock dependencies
+jest.mock('@salesforce/retail-react-app/app/hooks/use-current-customer')
+
+import {useCurrentCustomer} from '@salesforce/retail-react-app/app/hooks/use-current-customer'
+
+const mockUseCurrentCustomer = useCurrentCustomer
+
+const mockBasket = {
+    basketId: 'basket-1',
+    productItems: [
+        {itemId: 'item-1', productId: 'product-1', shipmentId: 'shipment-1'},
+        {itemId: 'item-2', productId: 'product-2', shipmentId: 'shipment-2'}
+    ],
+    shipments: [
+        {
+            shipmentId: 'shipment-1',
+            shippingMethod: {id: 'delivery-method-1'},
+            shippingAddress: {
+                firstName: 'John',
+                lastName: 'Doe',
+                address1: '123 Test St',
+                city: 'Test City',
+                stateCode: 'CA',
+                postalCode: '12345',
+                countryCode: 'US',
+                phone: '1234567890'
+            }
+        },
+        {
+            shipmentId: 'shipment-2',
+            shippingMethod: {id: 'delivery-method-2'},
+            shippingAddress: {
+                firstName: 'Jane',
+                lastName: 'Smith',
+                address1: '456 Another St',
+                city: 'Another City',
+                stateCode: 'NY',
+                postalCode: '67890',
+                countryCode: 'US',
+                phone: '0987654321'
+            }
+        }
+    ]
+}
+
+const mockCustomer = {
+    customerId: 'customer-1',
+    isGuest: false,
+    isRegistered: true,
+    addresses: [
+        {
+            addressId: 'addr-1',
+            firstName: 'John',
+            lastName: 'Doe',
+            address1: '123 Test St',
+            city: 'Test City',
+            stateCode: 'CA',
+            postalCode: '12345',
+            countryCode: 'US',
+            phone: '1234567890',
+            preferred: true
+        },
+        {
+            addressId: 'addr-2',
+            firstName: 'Jane',
+            lastName: 'Smith',
+            address1: '456 Another St',
+            city: 'Another City',
+            stateCode: 'NY',
+            postalCode: '67890',
+            countryCode: 'US',
+            phone: '0987654321',
+            preferred: false
+        }
+    ]
+}
+
+const mockGuestCustomer = {
+    customerId: 'guest-1',
+    isGuest: true,
+    addresses: []
+}
+
+describe('useProductAddressAssignment', () => {
+    beforeEach(() => {
+        jest.clearAllMocks()
+
+        mockUseCurrentCustomer.mockReturnValue({
+            data: mockCustomer,
+            isLoading: false
+        })
+    })
+
+    describe('deliveryItems filtering', () => {
+        test('should filter out pickup shipments', () => {
+            const pickupBasket = {
+                ...mockBasket,
+                shipments: mockBasket.shipments.map((s) => ({
+                    ...s,
+                    shippingMethod: {...s.shippingMethod, c_storePickupEnabled: true}
+                }))
+            }
+
+            const {result} = renderHook(() => useProductAddressAssignment(pickupBasket))
+
+            expect(result.current.deliveryItems).toHaveLength(0)
+        })
+
+        test('should include delivery shipments', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.deliveryItems).toHaveLength(2)
+            expect(result.current.deliveryItems[0].itemId).toBe('item-1')
+            expect(result.current.deliveryItems[1].itemId).toBe('item-2')
+        })
+
+        test('should handle empty basket', () => {
+            const emptyBasket = {...mockBasket, productItems: []}
+            const {result} = renderHook(() => useProductAddressAssignment(emptyBasket))
+
+            expect(result.current.deliveryItems).toHaveLength(0)
+        })
+    })
+
+    describe('availableAddresses', () => {
+        test('should return customer addresses for registered users', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.availableAddresses).toHaveLength(2)
+            expect(result.current.availableAddresses[0].addressId).toBe('addr-1')
+            expect(result.current.availableAddresses[1].addressId).toBe('addr-2')
+        })
+
+        test('should return guest addresses for guest users from existing shipments', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.availableAddresses).toHaveLength(2)
+            expect(result.current.availableAddresses[0].isGuestAddress).toBe(true)
+        })
+    })
+
+    describe('registered user address initialization', () => {
+        test('should initialize addresses from existing shipments', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-1')
+            expect(result.current.selectedAddresses['item-2']).toBe('addr-2')
+        })
+
+        test('should fall back to preferred address when no shipment match', () => {
+            const basketWithoutShipments = {
+                ...mockBasket,
+                shipments: []
+            }
+
+            const {result} = renderHook(() => useProductAddressAssignment(basketWithoutShipments))
+
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-1')
+            expect(result.current.selectedAddresses['item-2']).toBe('addr-1')
+        })
+
+        test('should use first address when no preferred address exists', () => {
+            const customerWithoutPreferred = {
+                ...mockCustomer,
+                addresses: mockCustomer.addresses.map((addr) => ({...addr, preferred: false}))
+            }
+
+            mockUseCurrentCustomer.mockReturnValue({
+                data: customerWithoutPreferred,
+                isLoading: false
+            })
+
+            const basketWithoutShipments = {
+                ...mockBasket,
+                shipments: []
+            }
+
+            const {result} = renderHook(() => useProductAddressAssignment(basketWithoutShipments))
+
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-1')
+            expect(result.current.selectedAddresses['item-2']).toBe('addr-1')
+        })
+    })
+
+    describe('guest user address initialization', () => {
+        test('should initialize guest addresses from existing shipments', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.availableAddresses).toHaveLength(2)
+            expect(result.current.selectedAddresses['item-1']).toMatch(/^guest_/)
+            expect(result.current.selectedAddresses['item-2']).toMatch(/^guest_/)
+        })
+
+        test('should prevent duplicate guest addresses', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const basketWithDuplicateAddresses = {
+                ...mockBasket,
+                shipments: [
+                    mockBasket.shipments[0],
+                    {
+                        ...mockBasket.shipments[1],
+                        shippingAddress: mockBasket.shipments[0].shippingAddress
+                    }
+                ]
+            }
+
+            const {result} = renderHook(() =>
+                useProductAddressAssignment(basketWithDuplicateAddresses)
+            )
+
+            expect(result.current.availableAddresses).toHaveLength(1)
+        })
+
+        test('should only initialize once', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const {result, rerender} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            const initialAddressCount = result.current.availableAddresses.length
+
+            rerender()
+
+            expect(result.current.availableAddresses).toHaveLength(initialAddressCount)
+        })
+    })
+
+    describe('addGuestAddress', () => {
+        test('should add new guest address with unique ID', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            const newAddress = {
+                firstName: 'New',
+                lastName: 'User',
+                address1: '789 New St',
+                city: 'New City',
+                stateCode: 'TX',
+                postalCode: '55555',
+                countryCode: 'US',
+                phone: '5555555555'
+            }
+
+            act(() => {
+                const addedAddress = result.current.addGuestAddress(newAddress)
+                expect(addedAddress.addressId).toMatch(/^guest_/)
+                expect(addedAddress.isGuestAddress).toBe(true)
+            })
+
+            expect(result.current.availableAddresses).toHaveLength(3)
+            const addedAddress = result.current.availableAddresses.find(
+                (addr) => addr.firstName === 'New'
+            )
+            expect(addedAddress).toBeDefined()
+            expect(addedAddress.firstName).toBe('New')
+        })
+    })
+
+    describe('setAddressesForItems', () => {
+        test('should set addresses for registered users', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            act(() => {
+                result.current.setAddressesForItems(['item-1'], 'addr-2')
+            })
+
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-2')
+        })
+
+        test('should set addresses for guest users', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: mockGuestCustomer,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            act(() => {
+                result.current.setAddressesForItems(['item-1'], 'guest_new')
+            })
+
+            expect(result.current.selectedAddresses['item-1']).toBe('guest_new')
+        })
+
+        test('should handle multiple items', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            act(() => {
+                result.current.setAddressesForItems(['item-1', 'item-2'], 'addr-2')
+            })
+
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-2')
+            expect(result.current.selectedAddresses['item-2']).toBe('addr-2')
+        })
+
+        test('should clear addresses when empty string provided', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            act(() => {
+                result.current.setAddressesForItems(['item-1'], '')
+            })
+
+            expect(result.current.selectedAddresses['item-1']).toBeUndefined()
+        })
+    })
+
+    describe('address selection state', () => {
+        test('should have selected addresses for items', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.selectedAddresses['item-1']).toBeDefined()
+            expect(result.current.selectedAddresses['item-1']).toBe('addr-1')
+        })
+
+        test('should handle items without addresses', () => {
+            const basketWithoutAddresses = {
+                ...mockBasket,
+                shipments: []
+            }
+
+            const {result} = renderHook(() => useProductAddressAssignment(basketWithoutAddresses))
+
+            expect(result.current.selectedAddresses['item-1']).toBeDefined()
+        })
+    })
+
+    describe('allItemsHaveAddresses', () => {
+        test('should return true when all items have addresses', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.allItemsHaveAddresses).toBe(true)
+        })
+
+        test('should return true when items have addresses from customer data', () => {
+            const basketWithoutAddresses = {
+                ...mockBasket,
+                shipments: []
+            }
+
+            const {result} = renderHook(() => useProductAddressAssignment(basketWithoutAddresses))
+
+            expect(result.current.allItemsHaveAddresses).toBe(true)
+        })
+    })
+
+    describe('edge cases', () => {
+        test('should handle null basket', () => {
+            const {result} = renderHook(() => useProductAddressAssignment(null))
+
+            expect(result.current.deliveryItems).toHaveLength(0)
+            expect(result.current.availableAddresses).toHaveLength(2)
+            expect(result.current.selectedAddresses).toEqual({})
+            expect(result.current.allItemsHaveAddresses).toBe(true)
+        })
+
+        test('should handle undefined customer', () => {
+            mockUseCurrentCustomer.mockReturnValue({
+                data: undefined,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.availableAddresses).toHaveLength(0)
+        })
+
+        test('should handle empty addresses array', () => {
+            const customerWithoutAddresses = {
+                ...mockCustomer,
+                addresses: []
+            }
+
+            mockUseCurrentCustomer.mockReturnValue({
+                data: customerWithoutAddresses,
+                isLoading: false
+            })
+
+            const {result} = renderHook(() => useProductAddressAssignment(mockBasket))
+
+            expect(result.current.availableAddresses).toHaveLength(0)
+            expect(result.current.allItemsHaveAddresses).toBe(false)
+        })
+    })
+})