Merge pull request eclipse-xpanse#795 from WangLiNaruto/bug/billing_m…

…ode_enum

use BillingMode enum to store BillingMode state instead of state

src/components/content/order/common/BillingModeSelection.tsx

@@ -12,11 +12,11 @@ export const BillingModeSelection = ({
     setSelectBillingMode,
     billingModes,
 }: {
-    selectBillingMode: string;
-    setSelectBillingMode: Dispatch<SetStateAction<string>>;
+    selectBillingMode: DeployRequest.billingMode;
+    setSelectBillingMode: Dispatch<SetStateAction<DeployRequest.billingMode>>;
     billingModes: DeployRequest.billingMode[] | undefined;
 }): React.JSX.Element => {
-    function onChange(value: string) {
+    function onChange(value: DeployRequest.billingMode) {
         setSelectBillingMode(value);
     }
 
@@ -39,7 +39,7 @@ export const BillingModeSelection = ({
                         <Radio.Group
                             buttonStyle='solid'
                             onChange={(e) => {
-                                onChange(e.target.value as string);
+                                onChange(e.target.value as DeployRequest.billingMode);
                             }}
                             value={selectBillingMode}
                         >

src/components/content/order/common/utils/OrderSubmitProps.ts

@@ -15,5 +15,5 @@ export interface OrderSubmitProps {
     contactServiceDetails: ServiceProviderContactDetails | undefined;
     availabilityZones?: Record<string, string>;
     eula: string | undefined;
-    billingMode: string;
+    billingMode: DeployRequest.billingMode;
 }

src/components/content/order/create/OrderSubmit.tsx

@@ -63,7 +63,7 @@ function OrderSubmit(state: OrderSubmitProps): React.JSX.Element {
             serviceHostingType: state.serviceHostingType,
             availabilityZones: state.availabilityZones,
             eulaAccepted: isEulaAccepted,
-            billingMode: state.billingMode as DeployRequest.billingMode,
+            billingMode: state.billingMode,
         };
         const serviceRequestProperties: Record<string, unknown> = {};
         for (const variable in useOrderFormStore.getState().deployParams) {

src/components/content/order/create/SelectServiceForm.tsx

@@ -7,7 +7,6 @@ import { To, useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 import React, { useEffect, useMemo, useState } from 'react';
 import {
     AvailabilityZoneConfig,
-    Billing,
     DeployRequest,
     ServiceProviderContactDetails,
     UserOrderableServiceVo,
@@ -110,19 +109,19 @@ export function SelectServiceForm({ services }: { services: UserOrderableService
         selectServiceHostType,
         versionToServicesMap.get(selectVersion)
     );
-    const defaultBillingMode: Billing.defaultBillingMode | undefined = getDefaultBillingMode(
+    const defaultBillingMode: DeployRequest.billingMode | undefined = getDefaultBillingMode(
         selectCsp,
         selectServiceHostType,
         versionToServicesMap.get(selectVersion)
     );
-    const [selectBillingMode, setSelectBillMode] = useState<string>(
+    const [selectBillingMode, setSelectBillMode] = useState<DeployRequest.billingMode>(
         serviceInfo
             ? serviceInfo.billingMode
             : defaultBillingMode
               ? defaultBillingMode
               : billingModes
                 ? billingModes[0]
-                : ''
+                : DeployRequest.billingMode.FIXED
     );
 
     let priceValue: string = flavorList.find((flavor) => flavor.value === selectFlavor)?.price ?? '';
@@ -164,7 +163,9 @@ export function SelectServiceForm({ services }: { services: UserOrderableService
     const onChangeFlavor = (newFlavor: string) => {
         setSelectFlavor(newFlavor);
         billingModes = getBillingModes(selectCsp, selectServiceHostType, versionToServicesMap.get(selectVersion));
-        setSelectBillMode(defaultBillingMode ? defaultBillingMode.toString() : billingModes ? billingModes[0] : '');
+        setSelectBillMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : DeployRequest.billingMode.FIXED
+        );
         flavorList.forEach((flavor) => {
             if (newFlavor === flavor.value) {
                 priceValue = flavor.price;
@@ -210,7 +211,9 @@ export function SelectServiceForm({ services }: { services: UserOrderableService
         setSelectVersion(currentVersion);
         setSelectCsp(cspList[0]);
         setSelectServiceHostType(serviceHostTypes[0]);
-        setSelectBillMode(defaultBillingMode ? defaultBillingMode.toString() : billingModes ? billingModes[0] : '');
+        setSelectBillMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : DeployRequest.billingMode.FIXED
+        );
     };
 
     const onChangeCloudProvider = (csp: UserOrderableServiceVo.csp) => {
@@ -235,7 +238,9 @@ export function SelectServiceForm({ services }: { services: UserOrderableService
         setSelectRegion(regionList[0]?.value ?? '');
         setSelectFlavor(flavorList[0]?.value ?? '');
         setSelectServiceHostType(serviceHostTypes[0]);
-        setSelectBillMode(defaultBillingMode ? defaultBillingMode.toString() : billingModes ? billingModes[0] : '');
+        setSelectBillMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : DeployRequest.billingMode.FIXED
+        );
     };
 
     function onAvailabilityZoneChange(varName: string, availabilityZone: string | undefined) {

src/components/content/order/formDataHelpers/billingHelper.ts

@@ -3,7 +3,7 @@
  * SPDX-FileCopyrightText: Huawei Inc.
  */
 
-import { Billing, DeployRequest, UserOrderableServiceVo } from '../../../../xpanse-api/generated';
+import { DeployRequest, UserOrderableServiceVo } from '../../../../xpanse-api/generated';
 
 export function getBillingModes(
     csp: UserOrderableServiceVo.csp,
@@ -28,15 +28,17 @@ export function getDefaultBillingMode(
     csp: UserOrderableServiceVo.csp,
     selectServiceHostingType: UserOrderableServiceVo.serviceHostingType,
     versionMapper: UserOrderableServiceVo[] | undefined
-): Billing.defaultBillingMode | undefined {
-    let defaultBillingMode: Billing.defaultBillingMode | undefined = undefined;
+): DeployRequest.billingMode | undefined {
+    let defaultBillingMode: DeployRequest.billingMode | undefined = undefined;
     if (versionMapper) {
         versionMapper.forEach((userOrderableServiceVo) => {
             if (
                 csp === userOrderableServiceVo.csp &&
-                selectServiceHostingType === userOrderableServiceVo.serviceHostingType
+                selectServiceHostingType === userOrderableServiceVo.serviceHostingType &&
+                userOrderableServiceVo.billing.defaultBillingMode
             ) {
-                defaultBillingMode = userOrderableServiceVo.billing.defaultBillingMode;
+                defaultBillingMode =
+                    userOrderableServiceVo.billing.defaultBillingMode.toString() as DeployRequest.billingMode;
             }
         });
     }

src/components/content/order/formDataHelpers/deployParamsHelper.ts

@@ -22,7 +22,7 @@ export const getDeployParams = (
     currentContactServiceDetails: ServiceProviderContactDetails | undefined,
     availabilityZones: Record<string, string> | undefined,
     eula: string | undefined,
-    selectBillingMode: string
+    selectBillingMode: DeployRequest.billingMode
 ): OrderSubmitProps => {
     let service: UserOrderableServiceVo | undefined;
     let registeredServiceId = '';

src/components/content/order/migrate/DeploymentForm.tsx

@@ -38,7 +38,7 @@ export const DeploymentForm = ({
     selectFlavor: string;
     isEulaAccepted: boolean;
     setIsEulaAccepted: Dispatch<SetStateAction<boolean>>;
-    selectBillingMode: string;
+    selectBillingMode: MigrateRequest.billingMode;
     setCurrentMigrationStep: (currentMigrationStep: MigrationSteps) => void;
     setDeployParameters: (createRequest: DeployRequest) => void;
     stepItem: StepProps;
@@ -54,7 +54,7 @@ export const DeploymentForm = ({
         undefined,
         availabilityZones,
         currentEula,
-        selectBillingMode as MigrateRequest.billingMode
+        selectBillingMode
     );
     const [cacheFormVariable] = useOrderFormStore((state) => [state.addDeployVariable]);
 
@@ -74,7 +74,7 @@ export const DeploymentForm = ({
             serviceHostingType: deployParams.serviceHostingType,
             availabilityZones: deployParams.availabilityZones,
             eulaAccepted: isEulaAccepted,
-            billingMode: selectBillingMode as DeployRequest.billingMode,
+            billingMode: selectBillingMode,
         };
         const serviceRequestProperties: Record<string, unknown> = {};
         for (const variable in useOrderFormStore.getState().deployParams) {

src/components/content/order/migrate/Migrate.tsx

@@ -53,8 +53,8 @@ export const Migrate = ({
     const [selectFlavor, setSelectFlavor] = useState<string>(currentSelectedService.deployRequest.flavor);
 
     const [billingModes, setBillingModes] = useState<MigrateRequest.billingMode[] | undefined>(undefined);
-    const [selectBillingMode, setSelectBillingMode] = useState<string>(
-        currentSelectedService.deployRequest.billingMode
+    const [selectBillingMode, setSelectBillingMode] = useState<MigrateRequest.billingMode>(
+        currentSelectedService.deployRequest.billingMode.toString() as MigrateRequest.billingMode
     );
 
     const [isEulaAccepted, setIsEulaAccepted] = useState<boolean>(false);

src/components/content/order/migrate/MigrateServiceSubmit.tsx

@@ -54,7 +54,7 @@ export const MigrateServiceSubmit = ({
     availabilityZones: Record<string, string>;
     selectFlavor: string;
     selectServiceHostingType: UserOrderableServiceVo.serviceHostingType;
-    selectBillingMode: string;
+    selectBillingMode: MigrateRequest.billingMode;
     setCurrentMigrationStep: (currentMigrationStep: MigrationSteps) => void;
     deployParams: DeployRequest | undefined;
     currentSelectedService: DeployedService;
@@ -101,7 +101,7 @@ export const MigrateServiceSubmit = ({
             const migrateRequest: MigrateRequest = deployParams as MigrateRequest;
             migrateRequest.region = region;
             migrateRequest.id = currentSelectedService.id;
-            migrateRequest.billingMode = selectBillingMode as MigrateRequest.billingMode;
+            migrateRequest.billingMode = selectBillingMode;
             migrateServiceRequest.mutate(migrateRequest);
             stepItem.status = 'process';
             setIsShowDeploymentResult(true);

src/components/content/order/migrate/SelectDestination.tsx

@@ -4,12 +4,7 @@
  */
 
 import CspSelect from '../formElements/CspSelect';
-import {
-    AvailabilityZoneConfig,
-    Billing,
-    DeployRequest,
-    UserOrderableServiceVo,
-} from '../../../../xpanse-api/generated';
+import { AvailabilityZoneConfig, MigrateRequest, UserOrderableServiceVo } from '../../../../xpanse-api/generated';
 import { Button, Form, Space, StepProps, Tabs } from 'antd';
 import { Tab } from 'rc-tabs/lib/interface';
 import React, { Dispatch, SetStateAction, useEffect, useState } from 'react';
@@ -79,9 +74,9 @@ export const SelectDestination = ({
     selectAvailabilityZones: Record<string, string>;
     setSelectAvailabilityZones: Dispatch<SetStateAction<Record<string, string>>>;
     currentFlavor: string;
-    billingModes: DeployRequest.billingMode[] | undefined;
-    selectBillingMode: string;
-    setSelectBillingMode: Dispatch<SetStateAction<string>>;
+    billingModes: MigrateRequest.billingMode[] | undefined;
+    selectBillingMode: MigrateRequest.billingMode;
+    setSelectBillingMode: Dispatch<SetStateAction<MigrateRequest.billingMode>>;
     setCurrentMigrationStep: (currentMigrationStep: MigrationSteps) => void;
     stepItem: StepProps;
 }): React.JSX.Element => {
@@ -127,12 +122,14 @@ export const SelectDestination = ({
         setSelectServiceHostingType(selectServiceHostType);
         billingModes = getBillingModes(selectCsp, selectServiceHostType, userOrderableServiceVoList);
 
-        const defaultBillingMode: Billing.defaultBillingMode | undefined = getDefaultBillingMode(
+        const defaultBillingMode: MigrateRequest.billingMode | undefined = getDefaultBillingMode(
             selectCsp,
             selectServiceHostType,
             userOrderableServiceVoList
         );
-        setSelectBillingMode(defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : '');
+        setSelectBillingMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : MigrateRequest.billingMode.FIXED
+        );
         updateSelectedParameters(
             selectCsp,
             selectArea,
@@ -146,12 +143,14 @@ export const SelectDestination = ({
     const onChangeFlavor = (newFlavor: string) => {
         setSelectFlavor(newFlavor);
         billingModes = getBillingModes(selectCsp, selectServiceHostType, userOrderableServiceVoList);
-        const defaultBillingMode: Billing.defaultBillingMode | undefined = getDefaultBillingMode(
+        const defaultBillingMode: MigrateRequest.billingMode | undefined = getDefaultBillingMode(
             selectCsp,
             selectServiceHostType,
             userOrderableServiceVoList
         );
-        setSelectBillingMode(defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : '');
+        setSelectBillingMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : MigrateRequest.billingMode.FIXED
+        );
         flavorList.forEach((flavor) => {
             if (newFlavor === flavor.value) {
                 priceValue = flavor.price;
@@ -217,12 +216,14 @@ export const SelectDestination = ({
         setSelectRegion(regionList[0]?.value ?? '');
         setSelectFlavor(flavorList[0]?.value ?? '');
         setSelectServiceHostingType(serviceHostTypes[0]);
-        const defaultBillingMode: Billing.defaultBillingMode | undefined = getDefaultBillingMode(
+        const defaultBillingMode: MigrateRequest.billingMode | undefined = getDefaultBillingMode(
             selectCsp,
             selectServiceHostType,
             userOrderableServiceVoList
         );
-        setSelectBillingMode(defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : '');
+        setSelectBillingMode(
+            defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : MigrateRequest.billingMode.FIXED
+        );
         updateSelectedParameters(
             csp,
             areaList[0]?.key ?? '',

src/components/content/order/migrate/SelectMigrationTarget.tsx

@@ -7,7 +7,6 @@ import { Button, Form, Radio, RadioChangeEvent, Space, StepProps } from 'antd';
 import React, { Dispatch, SetStateAction } from 'react';
 import { MigrationSteps } from '../types/MigrationSteps';
 import {
-    Billing,
     DeployedServiceDetails,
     MigrateRequest,
     UserOrderableServiceVo,
@@ -50,7 +49,7 @@ export const SelectMigrationTarget = ({
     setRegionList: Dispatch<SetStateAction<RegionDropDownInfo[]>>;
     setSelectRegion: Dispatch<SetStateAction<string>>;
     setBillingModes: Dispatch<SetStateAction<MigrateRequest.billingMode[] | undefined>>;
-    setSelectBillingMode: Dispatch<SetStateAction<string>>;
+    setSelectBillingMode: Dispatch<SetStateAction<MigrateRequest.billingMode>>;
     setCurrentMigrationStep: (currentMigrationStep: MigrationSteps) => void;
     stepItem: StepProps;
 }): React.JSX.Element => {
@@ -84,7 +83,7 @@ export const SelectMigrationTarget = ({
             userOrderableServiceVoList
         );
         setBillingModes(billingModes);
-        const defaultBillingMode: Billing.defaultBillingMode | undefined = getDefaultBillingMode(
+        const defaultBillingMode: MigrateRequest.billingMode | undefined = getDefaultBillingMode(
             cspList[0],
             serviceHostTypes[0],
             userOrderableServiceVoList
@@ -94,7 +93,7 @@ export const SelectMigrationTarget = ({
                 ? defaultBillingMode
                 : billingModes
                   ? billingModes[0]
-                  : currentSelectedService.deployRequest.billingMode
+                  : (currentSelectedService.deployRequest.billingMode as MigrateRequest.billingMode)
         );
     };