Skip to content

Commit

Permalink
add recreate for myServices.
Browse files Browse the repository at this point in the history
  • Loading branch information
Alice1319 committed Nov 15, 2024
1 parent 1f82b08 commit e41ad0b
Show file tree
Hide file tree
Showing 12 changed files with 747 additions and 780 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
/*
* SPDX-License-Identifier: Apache-2.0
* SPDX-FileCopyrightText: Huawei Inc.
*/

import { useQuery } from '@tanstack/react-query';
import {
getSelfHostedServiceDetailsById,
GetSelfHostedServiceDetailsByIdData,
getVendorHostedServiceDetailsById,
GetVendorHostedServiceDetailsByIdData,
serviceHostingType,
taskStatus,
} from '../../../../xpanse-api/generated';

export function useServiceDetailsByServiceIdQuery(
serviceId: string | undefined,
currentServiceHostingType: string,
currentMigrationTaskStatus: string | undefined
) {
return useQuery({
queryKey: ['getServiceDetailsById', serviceId, currentServiceHostingType],
queryFn: () => {
if (currentServiceHostingType === serviceHostingType.SELF.toString()) {
const data: GetSelfHostedServiceDetailsByIdData = {
serviceId: serviceId ?? '',
};
return getSelfHostedServiceDetailsById(data);
} else {
const data: GetVendorHostedServiceDetailsByIdData = {
serviceId: serviceId ?? '',
};
return getVendorHostedServiceDetailsById(data);
}
},
enabled:
serviceId !== undefined &&
(currentMigrationTaskStatus === taskStatus.SUCCESSFUL || currentMigrationTaskStatus === taskStatus.FAILED),
staleTime: Infinity,
gcTime: Infinity,
});
}
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
import { deploymentStatusPollingInterval } from '../../../utils/constants.tsx';

export function useLatestServiceOrderStatusQuery(
orderId: string | undefined,
orderId: string | undefined | null,
isStartPolling: boolean,
refetchUntilStates: taskStatus[]
) {
Expand Down
83 changes: 83 additions & 0 deletions src/components/content/deployedServices/myServices/MyServices.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import {
LockOutlined,
PlayCircleOutlined,
PoweroffOutlined,
RedoOutlined,
RiseOutlined,
SyncOutlined,
} from '@ant-design/icons';
Expand Down Expand Up @@ -60,6 +61,8 @@ import { useServiceDetailsByIdQuery } from '../../order/orderStatus/useServiceDe
import { PurgeServiceStatusAlert } from '../../order/purge/PurgeServiceStatusAlert';
import { usePurgeRequestStatusQuery } from '../../order/purge/usePurgeRequestStatusQuery';
import { usePurgeRequestSubmitQuery } from '../../order/purge/usePurgeRequestSubmitQuery';
import RecreateServiceStatusAlert from '../../order/recreate/RecreateServiceStatusAlert.tsx';
import useRecreateRequest from '../../order/recreate/useRecreateRequest.ts';
import useRedeployFailedDeploymentQuery from '../../order/retryDeployment/useRedeployFailedDeploymentQuery';
import { Scale } from '../../order/scale/Scale';
import { CurrentServiceConfiguration } from '../../order/serviceConfiguration/CurrentServiceConfiguration';
Expand Down Expand Up @@ -108,6 +111,7 @@ function MyServices(): React.JSX.Element {
const [isDestroyRequestSubmitted, setIsDestroyRequestSubmitted] = useState<boolean>(false);
const [isPurgeRequestSubmitted, setIsPurgeRequestSubmitted] = useState<boolean>(false);
const [isRetryDeployRequestSubmitted, setIsRetryDeployRequestSubmitted] = useState<boolean>(false);
const [isRecreateRequestSubmitted, setIsRecreateRequestSubmitted] = useState<boolean>(false);
const [isMyServiceDetailsModalOpen, setIsMyServiceDetailsModalOpen] = useState(false);
const [isMyServiceHistoryModalOpen, setIsMyServiceHistoryModalOpen] = useState(false);
const [isMyServiceConfigurationModalOpen, setIsMyServiceConfigurationModalOpen] = useState(false);
Expand All @@ -119,6 +123,7 @@ function MyServices(): React.JSX.Element {
const serviceDestroyQuery = useDestroyRequestSubmitQuery();
const servicePurgeQuery = usePurgeRequestSubmitQuery();
const redeployFailedDeploymentQuery = useRedeployFailedDeploymentQuery();
const serviceRecreateRequest = useRecreateRequest();
const serviceStateStartQuery = useServiceStateStartQuery(refreshData);
const serviceStateStopQuery = useServiceStateStopQuery(refreshData);
const serviceStateRestartQuery = useServiceStateRestartQuery(refreshData);
Expand Down Expand Up @@ -157,6 +162,12 @@ function MyServices(): React.JSX.Element {
[taskStatus.SUCCESSFUL, taskStatus.FAILED]
);

const getRecreateServiceOrderStatusPollingQuery = useLatestServiceOrderStatusQuery(
serviceRecreateRequest.data?.orderId,
serviceRecreateRequest.isSuccess,
[taskStatus.SUCCESSFUL, taskStatus.FAILED]
);

const getServiceDetailsQuery = useServiceDetailsByIdQuery(
activeRecord?.serviceId,
getReDeployLatestServiceOrderStatusQuery.data?.taskStatus.toString() === taskStatus.SUCCESSFUL ||
Expand All @@ -168,6 +179,10 @@ function MyServices(): React.JSX.Element {
void listDeployedServicesQuery.refetch();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
serviceRecreateRequest.isError,
serviceRecreateRequest.isPending,
getRecreateServiceOrderStatusPollingQuery.isError,
getRecreateServiceOrderStatusPollingQuery.data?.isOrderCompleted,
serviceStateStartQuery.isError,
serviceStateStartQuery.isPending,
getStartServiceDetailsQuery.isError,
Expand Down Expand Up @@ -470,6 +485,34 @@ function MyServices(): React.JSX.Element {
),
}
: null,
record.serviceDeploymentState.toString() === serviceDeploymentState.DEPLOYMENT_SUCCESSFUL.toString() ||
record.serviceDeploymentState.toString() === serviceDeploymentState.DESTROY_FAILED.toString() ||
record.serviceDeploymentState.toString() === serviceDeploymentState.MODIFICATION_FAILED.toString() ||
record.serviceDeploymentState.toString() === serviceDeploymentState.MODIFICATION_SUCCESSFUL.toString()
? {
key: 'recreateService',
label: (
<Popconfirm
title='Recreate the service'
description='Are you sure to recreate the service?'
cancelText='Yes'
okText='No'
onCancel={() => {
recreate(record);
}}
>
<Button
className={myServicesStyles.buttonAsLink}
icon={<RedoOutlined />}
disabled={isDisableRecreateBtn(record)}
type={'link'}
>
recreate
</Button>
</Popconfirm>
),
}
: null,
{
key:
record.serviceDeploymentState.toString() === serviceDeploymentState.DESTROY_SUCCESSFUL.toString() ||
Expand Down Expand Up @@ -789,6 +832,18 @@ function MyServices(): React.JSX.Element {
return true;
};

const isDisableRecreateBtn = (record: DeployedService) => {
if (
record.serviceDeploymentState !== serviceDeploymentState.DEPLOYMENT_SUCCESSFUL &&
record.serviceDeploymentState !== serviceDeploymentState.DESTROY_FAILED &&
record.serviceDeploymentState !== serviceDeploymentState.MODIFICATION_FAILED &&
record.serviceDeploymentState !== serviceDeploymentState.MODIFICATION_SUCCESSFUL
) {
return true;
}
return false;
};

const closeDestroyResultAlert = (isClose: boolean) => {
if (isClose) {
setActiveRecord(undefined);
Expand Down Expand Up @@ -833,6 +888,14 @@ function MyServices(): React.JSX.Element {
setUniqueRequestId('');
};

const closeRecreateResultAlert = (isClose: boolean) => {
if (isClose) {
setActiveRecord(undefined);
refreshData();
setIsRecreateRequestSubmitted(false);
}
};

const columns: ColumnsType<DeployedService> = [
{
title: 'Id',
Expand Down Expand Up @@ -1164,6 +1227,16 @@ function MyServices(): React.JSX.Element {
record.serviceDeploymentState = serviceDeploymentState.DEPLOYING;
}

function recreate(record: DeployedService): void {
setIsRecreateRequestSubmitted(true);
setActiveRecord(
record.serviceHostingType === serviceHostingType.SELF
? (record as DeployedServiceDetails)
: (record as VendorHostedDeployedServiceDetails)
);
serviceRecreateRequest.mutate(record.serviceId);
}

function onMonitor(record: DeployedService): void {
navigate('/monitor', {
state: record,
Expand Down Expand Up @@ -1508,6 +1581,16 @@ function MyServices(): React.JSX.Element {
onClose={closeRetryDeployResultAlert}
/>
) : null}
{isRecreateRequestSubmitted && activeRecord ? (
<RecreateServiceStatusAlert
key={activeRecord.serviceId}
currentSelectedService={activeRecord}
recreateRequest={serviceRecreateRequest}
recreateServiceOrderStatusPollingQueryError={getRecreateServiceOrderStatusPollingQuery.error}
recreateServiceOrderStatusPollingQueryData={getRecreateServiceOrderStatusPollingQuery.data}
closeRecreateResultAlert={closeRecreateResultAlert}
/>
) : null}
{activeRecord ? (
<Modal
title={'Service Details'}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ import {
taskStatus,
UserOrderableServiceVo,
} from '../../../../xpanse-api/generated';
import { useServiceDetailsByServiceIdQuery } from '../../common/deployedServiceDetailsByServiceIdQuery/useServiceDetailsByServiceIdQuery.ts';
import { useLatestServiceOrderStatusQuery } from '../../common/latestServiceOrderStatusQuery/useLatestServiceOrderStatusQuery.ts';
import useGetOrderableServiceDetailsQuery from '../../deployedServices/myServices/query/useGetOrderableServiceDetailsQuery';
import { FlavorSelection } from '../common/FlavorSelection.tsx';
Expand All @@ -35,7 +36,7 @@ import CspSelect from '../formElements/CspSelect';
import { MigrationSteps } from '../types/MigrationSteps';
import { ServiceFlavorWithPriceResult } from '../types/ServiceFlavorWithPrice';
import MigrateServiceStatusAlert from './MigrateServiceStatusAlert';
import { useMigrateServiceRequest, useServiceDetailsByServiceIdQuery } from './useMigrateServiceQuery';
import { useMigrateServiceRequest } from './useMigrateServiceQuery';

export const MigrateServiceSubmit = ({
userOrderableServiceVoList,
Expand Down
42 changes: 2 additions & 40 deletions src/components/content/order/migrate/useMigrateServiceQuery.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,18 +3,8 @@
* SPDX-FileCopyrightText: Huawei Inc.
*/

import { useMutation, useQuery } from '@tanstack/react-query';
import {
getSelfHostedServiceDetailsById,
GetSelfHostedServiceDetailsByIdData,
getVendorHostedServiceDetailsById,
GetVendorHostedServiceDetailsByIdData,
migrate,
MigrateData,
MigrateRequest,
serviceHostingType,
taskStatus,
} from '../../../../xpanse-api/generated';
import { useMutation } from '@tanstack/react-query';
import { migrate, MigrateData, MigrateRequest } from '../../../../xpanse-api/generated';

export function useMigrateServiceRequest() {
return useMutation({
Expand All @@ -26,31 +16,3 @@ export function useMigrateServiceRequest() {
},
});
}

export function useServiceDetailsByServiceIdQuery(
serviceId: string | undefined,
currentServiceHostingType: string,
currentMigrationTaskStatus: string | undefined
) {
return useQuery({
queryKey: ['getServiceDetailsById', serviceId, currentServiceHostingType],
queryFn: () => {
if (currentServiceHostingType === serviceHostingType.SELF.toString()) {
const data: GetSelfHostedServiceDetailsByIdData = {
serviceId: serviceId ?? '',
};
return getSelfHostedServiceDetailsById(data);
} else {
const data: GetVendorHostedServiceDetailsByIdData = {
serviceId: serviceId ?? '',
};
return getVendorHostedServiceDetailsById(data);
}
},
enabled:
serviceId !== undefined &&
(currentMigrationTaskStatus === taskStatus.SUCCESSFUL || currentMigrationTaskStatus === taskStatus.FAILED),
staleTime: Infinity,
gcTime: Infinity,
});
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
/*
* SPDX-License-Identifier: Apache-2.0
* SPDX-FileCopyrightText: Huawei Inc.
*/

import { Alert } from 'antd';
import { StopwatchResult } from 'react-timer-hook';
import { ServiceProviderContactDetails } from '../../../../xpanse-api/generated';

import React from 'react';
import submitAlertStyles from '../../../../styles/submit-alert.module.css';
import { ContactDetailsShowType } from '../../common/ocl/ContactDetailsShowType';
import { ContactDetailsText } from '../../common/ocl/ContactDetailsText';
import DeploymentTimer from '../orderStatus/DeploymentTimer';
import OrderSubmitResultDetails from '../orderStatus/OrderSubmitResultDetails';

export const RecreateOrderSubmitResult = ({
msg,
uuid,
type,
stopWatch,
closeRecreateResultAlert,
contactServiceDetails,
}: {
msg: string | React.JSX.Element;
uuid: string;
type: 'success' | 'error';
stopWatch: StopwatchResult;
closeRecreateResultAlert: (arg: boolean) => void;
contactServiceDetails: ServiceProviderContactDetails | undefined;
}): React.JSX.Element => {
const onClose = () => {
closeRecreateResultAlert(true);
};

return (
<div className={submitAlertStyles.submitAlertTip}>
{' '}
<Alert
message={`Processing Status`}
description={<OrderSubmitResultDetails msg={msg} uuid={uuid} />}
showIcon
closable={true}
onClose={onClose}
type={type}
action={
<>
{contactServiceDetails !== undefined ? (
<ContactDetailsText
serviceProviderContactDetails={contactServiceDetails}
showFor={ContactDetailsShowType.Order}
/>
) : (
<></>
)}
<DeploymentTimer stopWatch={stopWatch} />
</>
}
/>{' '}
</div>
);
};
Loading

0 comments on commit e41ad0b

Please sign in to comment.