Skip to content

Commit c647115

Browse files
Merge branch 'develop' into W-20975885-new-launch-agent-header-component
2 parents 2081fa1 + b81884c commit c647115

File tree

3 files changed

+369
-71
lines changed

3 files changed

+369
-71
lines changed

packages/template-retail-react-app/CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
- [Feature] PWA Integration with OMS
55
- Integrate Order Details page to display orders data from OMS [#3573](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3573)
66
- Integrate Order History page to display data from OMS [#3581](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3581)
7+
- Add shipping display support for OMS [#3588](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3588)
78

89
## v8.3.0 (Dec 17, 2025)
910
- [Bugfix] Fix Forgot Password link not working from Account Profile password update form [#3493](https://github.com/SalesforceCommerceCloud/pwa-kit/pull/3493)

packages/template-retail-react-app/app/pages/account/order-detail.jsx

Lines changed: 102 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
Button,
1919
Divider,
2020
Grid,
21+
Link as ChakraLink,
2122
SimpleGrid,
2223
Skeleton
2324
} from '@salesforce/retail-react-app/app/components/shared/ui'
@@ -326,27 +327,46 @@ const AccountOrderDetail = () => {
326327
})}
327328

328329
{/* Delivery Shipments */}
329-
{deliveryShipments.map((shipment, index) => (
330-
<React.Fragment key={`delivery-${index}`}>
331-
<Stack spacing={1}>
332-
<Heading as="h2" fontSize="sm" pt={1}>
333-
{deliveryShipments.length > 1 ? (
334-
<FormattedMessage
335-
defaultMessage="Shipping Method {number}"
336-
id="account_order_detail.heading.shipping_method_number"
337-
values={{number: index + 1}}
338-
/>
339-
) : (
340-
<FormattedMessage
341-
defaultMessage="Shipping Method"
342-
id="account_order_detail.heading.shipping_method"
343-
/>
344-
)}
345-
</Heading>
346-
<Box>
347-
<Text fontSize="sm" textTransform="titlecase">
348-
{
349-
{
330+
{deliveryShipments.map((shipment, index) => {
331+
// Hide shipping address for OMS multi-shipment orders
332+
// Can't reliably correlate OMS shipments to ECOM addresses by index
333+
const isOmsOrder = !!order?.omsData
334+
const omsShipment = isOmsOrder
335+
? order.omsData.shipments?.[index]
336+
: null
337+
const isOmsMultiShipment =
338+
isOmsOrder &&
339+
(order.omsData.shipments?.length > 1 ||
340+
order.shipments?.length > 1)
341+
342+
const shippingMethodName =
343+
omsShipment?.provider || shipment.shippingMethod.name
344+
const shippingStatus =
345+
omsShipment?.status || shipment.shippingStatus
346+
const trackingNumber =
347+
omsShipment?.trackingNumber || shipment.trackingNumber
348+
const trackingUrl = omsShipment?.trackingUrl
349+
350+
return (
351+
<React.Fragment key={`delivery-${index}`}>
352+
<Stack spacing={1}>
353+
<Heading as="h2" fontSize="sm" pt={1}>
354+
{deliveryShipments.length > 1 ? (
355+
<FormattedMessage
356+
defaultMessage="Shipping Method {number}"
357+
id="account_order_detail.heading.shipping_method_number"
358+
values={{number: index + 1}}
359+
/>
360+
) : (
361+
<FormattedMessage
362+
defaultMessage="Shipping Method"
363+
id="account_order_detail.heading.shipping_method"
364+
/>
365+
)}
366+
</Heading>
367+
<Box>
368+
<Text fontSize="sm" textTransform="titlecase">
369+
{{
350370
not_shipped: formatMessage({
351371
defaultMessage: 'Not shipped',
352372
id: 'account_order_detail.shipping_status.not_shipped'
@@ -359,57 +379,68 @@ const AccountOrderDetail = () => {
359379
defaultMessage: 'Shipped',
360380
id: 'account_order_detail.shipping_status.shipped'
361381
})
362-
}[shipment.shippingStatus]
363-
}
364-
</Text>
365-
<Text fontSize="sm">
366-
{shipment.shippingMethod.name}
367-
</Text>
368-
{shipment.trackingNumber && (
369-
<Text fontSize="sm">
370-
<FormattedMessage
371-
defaultMessage="Tracking Number"
372-
id="account_order_detail.label.tracking_number"
373-
/>
374-
: {shipment.trackingNumber}
382+
}[shippingStatus] || shippingStatus}
375383
</Text>
376-
)}
377-
</Box>
378-
</Stack>
379-
<Stack spacing={1}>
380-
<Heading as="h2" fontSize="sm" pt={1}>
381-
{deliveryShipments.length > 1 ? (
382-
<FormattedMessage
383-
defaultMessage="Shipping Address {number}"
384-
id="account_order_detail.heading.shipping_address_number"
385-
values={{number: index + 1}}
386-
/>
387-
) : (
388-
<FormattedMessage
389-
defaultMessage="Shipping Address"
390-
id="account_order_detail.heading.shipping_address"
391-
/>
392-
)}
393-
</Heading>
394-
<Box>
395-
<Text fontSize="sm">
396-
{shipment.shippingAddress.firstName &&
397-
shipment.shippingAddress.lastName
398-
? `${shipment.shippingAddress.firstName} ${shipment.shippingAddress.lastName}`
399-
: shipment.shippingAddress.fullName}
400-
</Text>
401-
<Text fontSize="sm">
402-
{shipment.shippingAddress.address1}
403-
</Text>
404-
<Text fontSize="sm">
405-
{shipment.shippingAddress.city},{' '}
406-
{shipment.shippingAddress.stateCode}{' '}
407-
{shipment.shippingAddress.postalCode}
408-
</Text>
409-
</Box>
410-
</Stack>
411-
</React.Fragment>
412-
))}
384+
<Text fontSize="sm">{shippingMethodName}</Text>
385+
{trackingNumber && (
386+
<Text fontSize="sm">
387+
<FormattedMessage
388+
defaultMessage="Tracking Number"
389+
id="account_order_detail.label.tracking_number"
390+
/>
391+
:{' '}
392+
{trackingUrl ? (
393+
<ChakraLink
394+
href={trackingUrl}
395+
isExternal
396+
color="blue.600"
397+
>
398+
{trackingNumber}
399+
</ChakraLink>
400+
) : (
401+
trackingNumber
402+
)}
403+
</Text>
404+
)}
405+
</Box>
406+
</Stack>
407+
{!isOmsMultiShipment && (
408+
<Stack spacing={1}>
409+
<Heading as="h2" fontSize="sm" pt={1}>
410+
{deliveryShipments.length > 1 ? (
411+
<FormattedMessage
412+
defaultMessage="Shipping Address {number}"
413+
id="account_order_detail.heading.shipping_address_number"
414+
values={{number: index + 1}}
415+
/>
416+
) : (
417+
<FormattedMessage
418+
defaultMessage="Shipping Address"
419+
id="account_order_detail.heading.shipping_address"
420+
/>
421+
)}
422+
</Heading>
423+
<Box>
424+
<Text fontSize="sm">
425+
{shipment.shippingAddress.firstName &&
426+
shipment.shippingAddress.lastName
427+
? `${shipment.shippingAddress.firstName} ${shipment.shippingAddress.lastName}`
428+
: shipment.shippingAddress.fullName}
429+
</Text>
430+
<Text fontSize="sm">
431+
{shipment.shippingAddress.address1}
432+
</Text>
433+
<Text fontSize="sm">
434+
{shipment.shippingAddress.city},{' '}
435+
{shipment.shippingAddress.stateCode}{' '}
436+
{shipment.shippingAddress.postalCode}
437+
</Text>
438+
</Box>
439+
</Stack>
440+
)}
441+
</React.Fragment>
442+
)
443+
})}
413444

414445
{/* Payment Method */}
415446
{paymentCard && (

0 commit comments

Comments
 (0)