diff --git a/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.component.tsx b/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.component.tsx
index b34302aef53f..ec24d17a2e51 100644
--- a/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.component.tsx
+++ b/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.component.tsx
@@ -72,13 +72,16 @@ export default function HubOrderTracking() {
[],
);
- const getInitialStatus = (orderData: LastOrderTrackingResponse) => ({
- date: orderData.date,
- label:
- orderData.status === 'delivered'
- ? 'INVOICE_IN_PROGRESS'
- : 'custom_creation',
- });
+ const getInitialStatus = (orderData: LastOrderTrackingResponse) => {
+ if (!orderData?.date || !orderData?.status) return undefined;
+ return {
+ date: orderData.date,
+ label:
+ orderData.status === 'delivered'
+ ? 'INVOICE_IN_PROGRESS'
+ : 'custom_creation',
+ };
+ };
const getLatestStatus = (history: OrderHistory[]) => {
return history.reduce((latest, item) => {
@@ -112,15 +115,6 @@ export default function HubOrderTracking() {
});
};
- if (error)
- return (
-
- );
-
return (
(isLoading || !isFreshCustomer) && (
) : (
<>
-
- (
-
-
-
+
+ (
+
- {t('hub_order_tracking_order_id', {
- orderId: orderDataResponse.orderId,
- })}
-
-
-
- )}
- />
-
-
-
- {format(new Date(currentStatus.date))}
- {t(`order_tracking_history_${currentStatus.label}`)}
-
-
-
-
-
-
- (
-
+
+ {t('hub_order_tracking_order_id', {
+ orderId: orderDataResponse.orderId,
+ })}
+
+
+
+ )}
+ />
+
+
+
- {t('hub_order_tracking_see_all')}
-
-
-
-
- )}
+ {format(new Date(currentStatus.date))}
+ {t(`order_tracking_history_${currentStatus.label}`)}
+
+
+
+
+
+
+ (
+
+ {t('hub_order_tracking_see_all')}
+
+
+
+
+ )}
+ />
+
+ >
+ )}
+ {(error ||
+ !orderDataResponse?.date ||
+ !orderDataResponse?.status) && (
+
-
+ )}
>
)}
diff --git a/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.spec.tsx b/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.spec.tsx
index dd06e5fe2401..4d7ed4acfa43 100644
--- a/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.spec.tsx
+++ b/packages/manager/apps/hub-react/src/components/hub-order-tracking/HubOrderTracking.spec.tsx
@@ -30,7 +30,7 @@ vi.mock('@/components/tile-error/TileError.component', () => ({
}));
const useLastOrderTrackingMockValue: any = {
- data: { orderId: 12345, history: [], date: new Date() },
+ data: { orderId: 12345, history: [], date: new Date(), status: 'delivered' },
isFetched: true,
isLoading: false,
refetch,
@@ -105,6 +105,7 @@ describe('HubOrderTracking Component', async () => {
});
it('displays TileError when there is an error', async () => {
+ useLastOrderTrackingMockValue.isLoading = false;
useLastOrderTrackingMockValue.error = true;
renderComponent();
diff --git a/packages/manager/apps/hub-react/src/data/hooks/lastOrderTracking/useLastOrderTracking.tsx b/packages/manager/apps/hub-react/src/data/hooks/lastOrderTracking/useLastOrderTracking.tsx
index 6a42ca088250..e194e257eded 100644
--- a/packages/manager/apps/hub-react/src/data/hooks/lastOrderTracking/useLastOrderTracking.tsx
+++ b/packages/manager/apps/hub-react/src/data/hooks/lastOrderTracking/useLastOrderTracking.tsx
@@ -10,8 +10,8 @@ export const useLastOrderTracking = () => {
error: lastOrderError,
refetch: refetchLastOrder,
} = useLastOrder();
- const orderId = lastOrder?.data.orderId;
- const orderDate = lastOrder?.data.date;
+ const orderId = lastOrder?.data?.orderId;
+ const orderDate = lastOrder?.data?.date;
// Use dependent queries to wait for the lastOrder to load
const {