diff --git a/src/components/content/order/common/availabilityzone/AvailabilityZoneError.tsx b/src/components/content/order/common/availabilityzone/AvailabilityZoneError.tsx
index df6e9bfae..38d4502f8 100644
--- a/src/components/content/order/common/availabilityzone/AvailabilityZoneError.tsx
+++ b/src/components/content/order/common/availabilityzone/AvailabilityZoneError.tsx
@@ -4,11 +4,9 @@
*/
import { ApiError, Response } from '../../../../../xpanse-api/generated';
-import { Alert } from 'antd';
+import { Alert, Button } from 'antd';
import { convertStringArrayToUnorderedList } from '../../../../utils/generateUnorderedList';
-import React from 'react';
-
-export function AvailabilityZoneError({ error }: { error: Error }): React.JSX.Element {
+export function AvailabilityZoneError({ retryRequest, error }: { retryRequest: () => void; error: Error }) {
if (error instanceof ApiError && error.body && 'details' in error.body) {
const response: Response = error.body as Response;
return (
@@ -17,6 +15,17 @@ export function AvailabilityZoneError({ error }: { error: Error }): React.JSX.El
description={convertStringArrayToUnorderedList(response.details)}
type={'error'}
closable={false}
+ action={
+
+ }
/>
);
} else {
@@ -26,6 +35,17 @@ export function AvailabilityZoneError({ error }: { error: Error }): React.JSX.El
description={error.message}
type={'error'}
closable={false}
+ action={
+
+ }
/>
);
}
diff --git a/src/components/content/order/common/availabilityzone/AvailabilityZoneFormItem.tsx b/src/components/content/order/common/availabilityzone/AvailabilityZoneFormItem.tsx
index c6b9a4c2b..b5bac7376 100644
--- a/src/components/content/order/common/availabilityzone/AvailabilityZoneFormItem.tsx
+++ b/src/components/content/order/common/availabilityzone/AvailabilityZoneFormItem.tsx
@@ -25,7 +25,11 @@ export function AvailabilityZoneFormItem({
selectCsp: UserOrderableServiceVo.csp;
}): React.JSX.Element {
const availabilityZonesVariableRequest = useGetAvailabilityZonesForRegionQuery(selectCsp, selectRegion);
-
+ const retryRequest = () => {
+ if (availabilityZonesVariableRequest.isError) {
+ void availabilityZonesVariableRequest.refetch();
+ }
+ };
function getFormContent() {
if (availabilityZonesVariableRequest.isLoading || availabilityZonesVariableRequest.isFetching) {
return