From aac1199302a7f255b36ba27079456b4dd14ee9f6 Mon Sep 17 00:00:00 2001 From: WangLiNaruto <122504203+WangLiNaruto@users.noreply.github.com> Date: Fri, 7 Jun 2024 11:52:24 +0800 Subject: [PATCH 1/6] AZ data not shown in final migration page when AZ not selected (#860) --- .../MigrateServiceSubmitAvailabilityZoneInfo.tsx | 6 +++++- .../order/migrate/MigrateServiceSubmit.tsx | 16 +++++++--------- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/src/components/content/order/common/MigrateServiceSubmitAvailabilityZoneInfo.tsx b/src/components/content/order/common/MigrateServiceSubmitAvailabilityZoneInfo.tsx index 995eb186..0098910d 100644 --- a/src/components/content/order/common/MigrateServiceSubmitAvailabilityZoneInfo.tsx +++ b/src/components/content/order/common/MigrateServiceSubmitAvailabilityZoneInfo.tsx @@ -31,7 +31,11 @@ export const MigrateServiceSubmitAvailabilityZoneInfo = ({ 0 + ? availabilityZones[availabilityZone.varName] + : {} + } > {availabilityZones[availabilityZone.varName] ? availabilityZones[availabilityZone.varName] diff --git a/src/components/content/order/migrate/MigrateServiceSubmit.tsx b/src/components/content/order/migrate/MigrateServiceSubmit.tsx index 423268e2..34fc89c7 100644 --- a/src/components/content/order/migrate/MigrateServiceSubmit.tsx +++ b/src/components/content/order/migrate/MigrateServiceSubmit.tsx @@ -192,15 +192,13 @@ export const MigrateServiceSubmit = ({ /> - {Object.keys(availabilityZones).length > 0 ? ( - - ) : undefined} +
From e3956e55120e3f7490423cb1a8ec1ee9de2c4c0c Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 7 Jun 2024 05:52:52 +0200 Subject: [PATCH 2/6] dependencies: bump rc-field-form from 2.2.0 to 2.2.1 (#862) Bumps [rc-field-form](https://github.com/react-component/field-form) from 2.2.0 to 2.2.1. - [Release notes](https://github.com/react-component/field-form/releases) - [Changelog](https://github.com/react-component/field-form/blob/master/CHANGELOG.md) - [Commits](https://github.com/react-component/field-form/compare/v2.2.0...v2.2.1) --- updated-dependencies: - dependency-name: rc-field-form dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 502f3d61..5161353f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,7 @@ "antd": "^5.18.0", "echarts": "5.5.0", "echarts-for-react": "^3.0.2", - "rc-field-form": "^2.2.0", + "rc-field-form": "^2.2.1", "rc-menu": "^9.14.0", "rc-tabs": "^15.1.0", "react": "^18.2.0", @@ -14954,9 +14954,9 @@ } }, "node_modules/rc-field-form": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/rc-field-form/-/rc-field-form-2.2.0.tgz", - "integrity": "sha512-Kl7wBXCmFbRi9aPw0yiRTSPH3WQGRnOVGX/UxlEjAz2pGwsaw2MisCJ7GTXukdiybYsw8K7agDD7ZsPGUNcDKg==", + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/rc-field-form/-/rc-field-form-2.2.1.tgz", + "integrity": "sha512-uoNqDoR7A4tn4QTSqoWPAzrR7ZwOK5I+vuZ/qdcHtbKx+ZjEsTg7QXm2wk/jalDiSksAQmATxL0T5LJkRREdIA==", "dependencies": { "@babel/runtime": "^7.18.0", "@rc-component/async-validator": "^5.0.3", diff --git a/package.json b/package.json index b87c10d7..d9a2fbda 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,7 @@ "antd": "^5.18.0", "echarts": "5.5.0", "echarts-for-react": "^3.0.2", - "rc-field-form": "^2.2.0", + "rc-field-form": "^2.2.1", "rc-menu": "^9.14.0", "rc-tabs": "^15.1.0", "react": "^18.2.0", From 0490f2167586d723f67ca37db1fcc770bbe387ab Mon Sep 17 00:00:00 2001 From: Alice1319 Date: Fri, 7 Jun 2024 22:01:34 +0800 Subject: [PATCH 3/6] display price. (#838) --- .../content/order/common/FlavorFeatures.tsx | 2 +- .../content/order/common/FlavorPrice.tsx | 72 +++++++++++++++++-- .../content/order/common/FlavorPriceRetry.tsx | 54 ++++++++++++++ .../content/order/common/FlavorSelection.tsx | 65 +++++++++++++++-- .../content/order/common/FlavorTitle.tsx | 2 +- .../order/common/useGetServicePricesQuery.ts | 35 +++++++++ .../order/create/SelectServiceForm.tsx | 13 ++-- .../order/formDataHelpers/flavorHelper.ts | 64 ++++++++++++++++- .../content/order/migrate/Migrate.tsx | 1 + .../order/migrate/MigrateServiceSubmit.tsx | 9 ++- .../order/migrate/SelectDestination.tsx | 18 ++--- src/components/content/order/scale/Scale.tsx | 49 ++++++++++--- .../order/types/ServiceFlavorWithPrice.ts | 32 +++++++++ src/styles/flavor.module.css | 34 +++++++++ src/styles/service-modify.module.css | 2 +- 15 files changed, 414 insertions(+), 38 deletions(-) create mode 100644 src/components/content/order/common/FlavorPriceRetry.tsx create mode 100644 src/components/content/order/common/useGetServicePricesQuery.ts create mode 100644 src/components/content/order/types/ServiceFlavorWithPrice.ts diff --git a/src/components/content/order/common/FlavorFeatures.tsx b/src/components/content/order/common/FlavorFeatures.tsx index c1571a7f..cdcc4397 100644 --- a/src/components/content/order/common/FlavorFeatures.tsx +++ b/src/components/content/order/common/FlavorFeatures.tsx @@ -10,7 +10,7 @@ import flavorStyles from '../../../../styles/flavor.module.css'; import serviceModifyStyles from '../../../../styles/service-modify.module.css'; import { ServiceFlavor } from '../../../../xpanse-api/generated'; -export const FlavorFeatures = (flavor: ServiceFlavor): React.JSX.Element => { +export const FlavorFeatures = ({ flavor }: { flavor: ServiceFlavor }): React.JSX.Element => { return ( <> { +export const FlavorPrice = ({ + flavor, + isSuccess, + priceData, + isError, + error, + retryRequest, +}: { + flavor: ServiceFlavor; + isSuccess: boolean; + priceData?: ServiceFlavorWithPriceResult[]; + isError: boolean; + error: Error | null; + retryRequest: () => void; +}): React.JSX.Element => { + const { Text } = Typography; + const flavorMap = convertToFlavorMap(priceData); return ( <> - - {/* TODO Will be fixed after #1597 is fixed */} - {(20).toString().concat(' ').concat('EUR/').concat('hour')} - + {isSuccess ? ( +
+ {flavor.name && flavorMap[flavor.name].price.successful ? ( + <> + {flavorMap[flavor.name].price.recurringPrice ? ( + + {flavorMap[flavor.name].price.recurringPrice?.cost + .toString() + .concat(' ') + .concat(flavorMap[flavor.name].price.recurringPrice?.currency ?? '') + .concat('/') + .concat( + getMappedPeriod(flavorMap[flavor.name].price.recurringPrice?.period ?? '') + )} + + ) : null} + {flavorMap[flavor.name].price.oneTimePaymentPrice ? ( +
+ + {flavorMap[flavor.name].price.oneTimePaymentPrice?.cost + .toString() + .concat(' ') + .concat(flavorMap[flavor.name].price.oneTimePaymentPrice?.currency ?? '') + .concat('/') + .concat( + getMappedPeriod( + flavorMap[flavor.name].price.oneTimePaymentPrice?.period ?? '' + ) + )} + +
+ ) : null} + + ) : ( + <> + + + )} +
+ ) : null} + {isError ? ( + + ) : null} ); }; diff --git a/src/components/content/order/common/FlavorPriceRetry.tsx b/src/components/content/order/common/FlavorPriceRetry.tsx new file mode 100644 index 00000000..9c7c025f --- /dev/null +++ b/src/components/content/order/common/FlavorPriceRetry.tsx @@ -0,0 +1,54 @@ +/* + * SPDX-License-Identifier: Apache-2.0 + * SPDX-FileCopyrightText: Huawei Inc. + */ + +import { CloseCircleOutlined, InfoCircleOutlined, RedoOutlined } from '@ant-design/icons'; +import { Button, Popover } from 'antd'; +import React from 'react'; +import flavorStyles from '../../../../styles/flavor.module.css'; +import { ServiceFlavor } from '../../../../xpanse-api/generated'; +import { convertStringArrayToUnorderedList } from '../../../utils/generateUnorderedList.tsx'; +import { getServicePriceErrorDetails } from '../formDataHelpers/flavorHelper.ts'; +import { ServiceFlavorWithPriceResult } from '../types/ServiceFlavorWithPrice.ts'; + +export const FlavorPriceRetry = ({ + flavor, + flavorMap, + error, + retryRequest, +}: { + flavor: ServiceFlavor; + flavorMap: Record; + error?: Error | null; + retryRequest: () => void; +}): React.JSX.Element => { + return ( + <> + {' '} + + +   {'Error:'} + + } + > + + + {'retry request'}} className={flavorStyles.flavorRetryPopover}> + { + retryRequest(); + }} + /> + + + ); +}; diff --git a/src/components/content/order/common/FlavorSelection.tsx b/src/components/content/order/common/FlavorSelection.tsx index df0ae9b7..2412bb13 100644 --- a/src/components/content/order/common/FlavorSelection.tsx +++ b/src/components/content/order/common/FlavorSelection.tsx @@ -3,24 +3,57 @@ * SPDX-FileCopyrightText: Huawei Inc. */ -import { Flex, Form, Radio } from 'antd'; +import { LoadingOutlined } from '@ant-design/icons'; +import { Flex, Form, Radio, Spin } from 'antd'; import React from 'react'; import flavorStyles from '../../../../styles/flavor.module.css'; import serviceOrderStyles from '../../../../styles/service-order.module.css'; -import { ServiceFlavor } from '../../../../xpanse-api/generated'; -import { FlavorFeatures } from './FlavorFeatures'; +import { DeployRequest, ServiceFlavor, UserOrderableServiceVo } from '../../../../xpanse-api/generated'; +import { FlavorFeatures } from './FlavorFeatures.tsx'; import { FlavorPrice } from './FlavorPrice'; import { FlavorTitle } from './FlavorTitle'; +import useGetServicePricesQuery from './useGetServicePricesQuery.ts'; export const FlavorSelection = ({ selectFlavor, flavorList, onChangeFlavor, + selectVersion, + selectCsp, + services, + selectRegion, + selectBillingMode, }: { selectFlavor: string; flavorList?: ServiceFlavor[]; onChangeFlavor?: (newFlavor: string) => void; + selectVersion: string; + selectCsp: UserOrderableServiceVo.csp; + services?: UserOrderableServiceVo[]; + selectRegion: string; + selectBillingMode: DeployRequest.billingMode; }): React.JSX.Element => { + const getServiceTemplateId = (): string => { + if (services) { + const service = services.find((service) => service.version === selectVersion && service.csp === selectCsp); + return service ? service.serviceTemplateId : ''; + } + return ''; + }; + + const getServicePriceQuery = useGetServicePricesQuery( + getServiceTemplateId(), + selectRegion, + selectBillingMode, + flavorList + ); + + const retryRequest = () => { + if (selectRegion.length > 0 && getServiceTemplateId().length > 0) { + void getServicePriceQuery.refetch(); + } + }; + return ( <>
- {FlavorTitle(flavor.name)} -
{FlavorPrice()}
- {FlavorFeatures(flavor)} + + {getServicePriceQuery.isLoading || getServicePriceQuery.isFetching ? ( +
+ + } + /> +
+ ) : ( + + )} +
))} diff --git a/src/components/content/order/common/FlavorTitle.tsx b/src/components/content/order/common/FlavorTitle.tsx index 2e82ecf1..7467f6e7 100644 --- a/src/components/content/order/common/FlavorTitle.tsx +++ b/src/components/content/order/common/FlavorTitle.tsx @@ -6,6 +6,6 @@ import React from 'react'; import flavorStyles from '../../../../styles/flavor.module.css'; -export const FlavorTitle = (title: string): React.JSX.Element => { +export const FlavorTitle = ({ title }: { title: string }): React.JSX.Element => { return {title}; }; diff --git a/src/components/content/order/common/useGetServicePricesQuery.ts b/src/components/content/order/common/useGetServicePricesQuery.ts new file mode 100644 index 00000000..202d2d04 --- /dev/null +++ b/src/components/content/order/common/useGetServicePricesQuery.ts @@ -0,0 +1,35 @@ +/* + * SPDX-License-Identifier: Apache-2.0 + * SPDX-FileCopyrightText: Huawei Inc. + */ + +import { useQuery } from '@tanstack/react-query'; +import { + DeployRequest, + FlavorPriceResult, + ServiceFlavor, + ServicePricesService, +} from '../../../../xpanse-api/generated'; +import { getFlavorWithPricesList } from '../formDataHelpers/flavorHelper.ts'; + +export default function useGetServicePricesQuery( + serviceTemplateId: string, + region: string, + billingMode: DeployRequest.billingMode, + flavorList?: ServiceFlavor[] +) { + return useQuery({ + queryKey: ['getServicePricesQuery', serviceTemplateId, region, billingMode, flavorList], + queryFn: async () => { + const prices: FlavorPriceResult[] = await ServicePricesService.getPricesByService( + serviceTemplateId, + region, + billingMode + ); + return getFlavorWithPricesList(prices, flavorList); + }, + enabled: serviceTemplateId.length > 0, + refetchOnWindowFocus: false, + retry: 0, + }); +} diff --git a/src/components/content/order/create/SelectServiceForm.tsx b/src/components/content/order/create/SelectServiceForm.tsx index 1bdfecd4..259d54fb 100644 --- a/src/components/content/order/create/SelectServiceForm.tsx +++ b/src/components/content/order/create/SelectServiceForm.tsx @@ -162,16 +162,16 @@ export function SelectServiceForm({ services }: { services: UserOrderableService const onChangeServiceHostingType = (serviceHostingType: UserOrderableServiceVo.serviceHostingType) => { location.state = undefined; setSelectServiceHostType(serviceHostingType); - }; - - const onChangeFlavor = (newFlavor: string) => { - setSelectFlavor(newFlavor); billingModes = getBillingModes(selectCsp, selectServiceHostType, versionToServicesMap.get(selectVersion)); setSelectBillMode( defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : DeployRequest.billingMode.FIXED ); }; + const onChangeFlavor = (newFlavor: string) => { + setSelectFlavor(newFlavor); + }; + const onChangeRegion = (value: string) => { setSelectRegion(value); }; @@ -386,6 +386,11 @@ export function SelectServiceForm({ services }: { services: UserOrderableService selectFlavor={selectFlavor} flavorList={flavorList} onChangeFlavor={onChangeFlavor} + selectVersion={selectVersion} + selectCsp={selectCsp} + services={services} + selectRegion={selectRegion} + selectBillingMode={selectBillingMode} />
diff --git a/src/components/content/order/formDataHelpers/flavorHelper.ts b/src/components/content/order/formDataHelpers/flavorHelper.ts index 04e9967d..4454599b 100644 --- a/src/components/content/order/formDataHelpers/flavorHelper.ts +++ b/src/components/content/order/formDataHelpers/flavorHelper.ts @@ -3,7 +3,14 @@ * SPDX-FileCopyrightText: Huawei Inc. */ -import { ServiceFlavor, UserOrderableServiceVo } from '../../../../xpanse-api/generated'; +import { + ApiError, + FlavorPriceResult, + Response, + ServiceFlavor, + UserOrderableServiceVo, +} from '../../../../xpanse-api/generated'; +import { ServiceFlavorWithPriceResult } from '../types/ServiceFlavorWithPrice.ts'; export function getServiceFlavorList( selectCsp: UserOrderableServiceVo.csp, @@ -24,3 +31,58 @@ export function getServiceFlavorList( return flavorMapper.get(selectCsp) ?? []; } + +export const getServicePriceErrorDetails = (error: Error) => { + if (error instanceof ApiError && error.body && 'details' in error.body) { + const response: Response = error.body as Response; + return response.details; + } else { + return [error.message]; + } +}; + +const periodMapping: Record = { + yearly: 'year', + monthly: 'month', + daily: 'day', + hourly: 'hour', + oneTime: 'one time', +}; + +export const getMappedPeriod = (period: string): string => { + return periodMapping[period] || 'unknown'; +}; + +export const convertToFlavorMap = ( + serviceFlavorWithPriceList?: ServiceFlavorWithPriceResult[] +): Record => { + if (!serviceFlavorWithPriceList || serviceFlavorWithPriceList.length === 0) { + return {}; + } + return serviceFlavorWithPriceList.reduce>((map, flavor) => { + map[flavor.name] = flavor; + return map; + }, {}); +}; + +export const getFlavorWithPricesList = ( + priceResults: FlavorPriceResult[], + flavorList?: ServiceFlavor[] +): ServiceFlavorWithPriceResult[] => { + if (!flavorList || flavorList.length === 0) { + return []; + } + + return flavorList + .map((flavor) => { + const priceResult = priceResults.find((price) => flavor.name === price.flavorName); + if (priceResult) { + return { + ...flavor, + price: priceResult, + }; + } + return null; + }) + .filter(Boolean) as ServiceFlavorWithPriceResult[]; +}; diff --git a/src/components/content/order/migrate/Migrate.tsx b/src/components/content/order/migrate/Migrate.tsx index fbddd5ae..db9f3319 100644 --- a/src/components/content/order/migrate/Migrate.tsx +++ b/src/components/content/order/migrate/Migrate.tsx @@ -191,6 +191,7 @@ export const Migrate = ({ setSelectBillingMode={setSelectBillingMode} setCurrentMigrationStep={setCurrentMigrationStep} stepItem={items[MigrationSteps.SelectADestination]} + currentSelectedService={currentSelectedService} /> ); case MigrationSteps.ImportServiceData: diff --git a/src/components/content/order/migrate/MigrateServiceSubmit.tsx b/src/components/content/order/migrate/MigrateServiceSubmit.tsx index 34fc89c7..4c0b2d43 100644 --- a/src/components/content/order/migrate/MigrateServiceSubmit.tsx +++ b/src/components/content/order/migrate/MigrateServiceSubmit.tsx @@ -202,7 +202,14 @@ export const MigrateServiceSubmit = ({
- +
diff --git a/src/components/content/order/migrate/SelectDestination.tsx b/src/components/content/order/migrate/SelectDestination.tsx index 785948ac..1b0745bd 100644 --- a/src/components/content/order/migrate/SelectDestination.tsx +++ b/src/components/content/order/migrate/SelectDestination.tsx @@ -11,6 +11,7 @@ import serviceOrderStyles from '../../../../styles/service-order.module.css'; import tableStyles from '../../../../styles/table.module.css'; import { AvailabilityZoneConfig, + DeployedService, MigrateRequest, ServiceFlavor, UserOrderableServiceVo, @@ -54,6 +55,7 @@ export const SelectDestination = ({ setSelectBillingMode, setCurrentMigrationStep, stepItem, + currentSelectedService, }: { userOrderableServiceVoList: UserOrderableServiceVo[]; updateSelectedParameters: ( @@ -84,6 +86,7 @@ export const SelectDestination = ({ setSelectBillingMode: Dispatch>; setCurrentMigrationStep: (currentMigrationStep: MigrationSteps) => void; stepItem: StepProps; + currentSelectedService: DeployedService; }): React.JSX.Element => { const [form] = Form.useForm(); const getAvailabilityZonesForRegionQuery = useGetAvailabilityZonesForRegionQuery(selectCsp, selectRegion); @@ -150,15 +153,7 @@ export const SelectDestination = ({ const onChangeFlavor = (newFlavor: string) => { setSelectFlavor(newFlavor); - billingModes = getBillingModes(selectCsp, selectServiceHostType, userOrderableServiceVoList); - const defaultBillingMode: MigrateRequest.billingMode | undefined = getDefaultBillingMode( - selectCsp, - selectServiceHostType, - userOrderableServiceVoList - ); - setSelectBillingMode( - defaultBillingMode ? defaultBillingMode : billingModes ? billingModes[0] : MigrateRequest.billingMode.FIXED - ); + updateSelectedParameters( selectCsp, selectArea, @@ -322,6 +317,11 @@ export const SelectDestination = ({ selectFlavor={selectFlavor} flavorList={flavorList} onChangeFlavor={onChangeFlavor} + selectVersion={currentSelectedService.version} + selectCsp={selectCsp} + services={userOrderableServiceVoList} + selectRegion={selectRegion} + selectBillingMode={selectBillingMode} />
diff --git a/src/components/content/order/scale/Scale.tsx b/src/components/content/order/scale/Scale.tsx index e313d32f..f5c9db94 100644 --- a/src/components/content/order/scale/Scale.tsx +++ b/src/components/content/order/scale/Scale.tsx @@ -3,9 +3,9 @@ * SPDX-FileCopyrightText: Huawei Inc. */ -import { ExclamationCircleOutlined, InfoCircleOutlined } from '@ant-design/icons'; +import { ExclamationCircleOutlined, InfoCircleOutlined, LoadingOutlined } from '@ant-design/icons'; import { useMutation } from '@tanstack/react-query'; -import { Badge, Button, Flex, Form, Input, Popconfirm, PopconfirmProps, Radio, Tooltip } from 'antd'; +import { Badge, Button, Flex, Form, Input, Popconfirm, PopconfirmProps, Radio, Spin, Tooltip } from 'antd'; import React, { useState } from 'react'; import appStyles from '../../../../styles/app.module.css'; import flavorStyles from '../../../../styles/flavor.module.css'; @@ -22,10 +22,11 @@ import { import { CUSTOMER_SERVICE_NAME_FIELD } from '../../../utils/constants'; import useGetServiceTemplateDetails from '../../deployedServices/myServices/query/useGetServiceTemplateDetails'; import { FlavorFeatures } from '../common/FlavorFeatures'; -import { FlavorPrice } from '../common/FlavorPrice'; +import { FlavorPrice } from '../common/FlavorPrice.tsx'; import { FlavorTitle } from '../common/FlavorTitle'; import ScaleOrModifySubmitStatusAlert from '../common/ScaleOrModifySubmitStatusAlert'; import { ModifySubmitRequest } from '../common/modifySubmitRequest'; +import useGetServicePricesQuery from '../common/useGetServicePricesQuery.ts'; import { OrderItem } from '../common/utils/OrderItem'; import { ChangeFlavorServiceDataWillBeLost, @@ -123,6 +124,19 @@ export const Scale = ({ setScaleWarning(''); }; + const getServicePriceQuery = useGetServicePricesQuery( + currentSelectedService.serviceTemplateId ?? '', + currentSelectedService.deployRequest.region.name, + currentSelectedService.deployRequest.billingMode, + flavorList + ); + + const retryRequest = () => { + if (currentSelectedService.serviceTemplateId && currentSelectedService.serviceTemplateId.length > 0) { + void getServicePriceQuery.refetch(); + } + }; + return (
Change Flavor:
@@ -183,12 +197,31 @@ export const Scale = ({ key={flavor.name} value={flavor.name} disabled={isCurrentFlavor} - // className={flavorStyles.customRadioButtonContent} - className={`${flavorStyles.customRadioButtonContent} ${flavorStyles.antRadioButtonWrapperChecked}`} + className={`${flavorStyles.customRadioButtonContent} ${flavorStyles.antRadioButtonWrapperDisabled}`} > - {FlavorTitle(flavor.name)} -
{FlavorPrice()}
- {FlavorFeatures(flavor)} + + {getServicePriceQuery.isLoading ? ( +
+ + } + /> +
+ ) : ( + + )} + ); return ( diff --git a/src/components/content/order/types/ServiceFlavorWithPrice.ts b/src/components/content/order/types/ServiceFlavorWithPrice.ts new file mode 100644 index 00000000..4314f119 --- /dev/null +++ b/src/components/content/order/types/ServiceFlavorWithPrice.ts @@ -0,0 +1,32 @@ +/* + * SPDX-License-Identifier: Apache-2.0 + * SPDX-FileCopyrightText: Huawei Inc. + */ + +import { FlavorPriceResult } from '../../../../xpanse-api/generated'; + +/** + * The flavors of the orderable service. + */ +export interface ServiceFlavorWithPriceResult { + /** + * The flavor name + */ + name: string; + /** + * The properties of the flavor + */ + properties: Record; + /** + * The priority of the flavor. The larger value means lower priority. + */ + priority: number; + /** + * Important features and differentiators of the flavor. + */ + features?: string[]; + /** + * prices of the flavor. + */ + price: FlavorPriceResult; +} diff --git a/src/styles/flavor.module.css b/src/styles/flavor.module.css index 5f5f3736..80c72eea 100644 --- a/src/styles/flavor.module.css +++ b/src/styles/flavor.module.css @@ -106,3 +106,37 @@ .flavor-feature-item-name { font-weight: lighter; } + +.flavor-one-time-price-content .ant-typography { + font-size: 12px !important; + margin-top: 0; +} + +.flavor-skeleton { + width: 100%; + height: 50px; + display: flex; + align-items: center; + justify-content: center; +} + +.flavor-skeleton-content { + width: 100%; + height: 100%; +} + +.flavor-price-error-info { + color: red; +} + +.flavor-price-reload { + margin-left: 1px; +} + +.flavor-price-loading { + font-size: 24px; +} + +.flavor-retry-popover .ant-popover-inner-content { + padding: 0; +} diff --git a/src/styles/service-modify.module.css b/src/styles/service-modify.module.css index 99cca67e..75af8c90 100644 --- a/src/styles/service-modify.module.css +++ b/src/styles/service-modify.module.css @@ -23,7 +23,6 @@ .flavor-price-content { text-align: center; - margin-bottom: 15px; } .flavor-select-hover { @@ -74,6 +73,7 @@ word-break: break-word; vertical-align: top; } + .modify-history-error-msg-value { display: inline-block; max-width: 145px; From 1cebb830d195201b55b0c8c66a7a4fcbbf8fe592 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sat, 8 Jun 2024 05:56:03 +0200 Subject: [PATCH 4/6] dependencies: bump knip from 5.17.4 to 5.18.0 (#863) Bumps [knip](https://github.com/webpro-nl/knip/tree/HEAD/packages/knip) from 5.17.4 to 5.18.0. - [Release notes](https://github.com/webpro-nl/knip/releases) - [Changelog](https://github.com/webpro-nl/knip/blob/main/packages/knip/.release-it.json) - [Commits](https://github.com/webpro-nl/knip/commits/5.18.0/packages/knip) --- updated-dependencies: - dependency-name: knip dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5161353f..534d86d7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -50,7 +50,7 @@ "identity-obj-proxy": "^3.0.0", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "knip": "^5.17.4", + "knip": "^5.18.0", "openapi-typescript-codegen": "^0.29.0", "prettier": "3.3.1", "prettier-plugin-organize-imports": "^3.2.4", @@ -13026,9 +13026,9 @@ } }, "node_modules/knip": { - "version": "5.17.4", - "resolved": "https://registry.npmjs.org/knip/-/knip-5.17.4.tgz", - "integrity": "sha512-D6dQjauc3ZIPq0jTYgTeuxpeDKVOaV84S5TNeBDB2GjoPQVzEPW7PA83XijyGXNrflWq4zvWNn49gTUN0Lfeig==", + "version": "5.18.0", + "resolved": "https://registry.npmjs.org/knip/-/knip-5.18.0.tgz", + "integrity": "sha512-V+iJz2490zJQ11J0XCf7FggbiqY4L9HpmwSWS3BvwrH7W+bep9drx+Wj2dCU+8uSUijvwPB2unLbQKFCTuvT5g==", "dev": true, "funding": [ { diff --git a/package.json b/package.json index d9a2fbda..1eca33a8 100644 --- a/package.json +++ b/package.json @@ -124,7 +124,7 @@ "identity-obj-proxy": "^3.0.0", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "knip": "^5.17.4", + "knip": "^5.18.0", "openapi-typescript-codegen": "^0.29.0", "prettier": "3.3.1", "prettier-plugin-organize-imports": "^3.2.4", From 61976979886d89f8d55b2e08e8083bfa83046dbd Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sat, 8 Jun 2024 05:56:22 +0200 Subject: [PATCH 5/6] dependencies: bump @axa-fr/react-oidc from 7.22.6 to 7.22.7 (#864) Bumps [@axa-fr/react-oidc](https://github.com/AxaFrance/oidc-client) from 7.22.6 to 7.22.7. - [Release notes](https://github.com/AxaFrance/oidc-client/releases) - [Changelog](https://github.com/AxaFrance/oidc-client/blob/main/CHANGELOG.md) - [Commits](https://github.com/AxaFrance/oidc-client/compare/v7.22.6...v7.22.7) --- updated-dependencies: - dependency-name: "@axa-fr/react-oidc" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 26 +++++++++++++------------- package.json | 2 +- 2 files changed, 14 insertions(+), 14 deletions(-) diff --git a/package-lock.json b/package-lock.json index 534d86d7..a06bb325 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,7 @@ "version": "1.0.13", "dependencies": { "@ant-design/icons": "^5.3.7", - "@axa-fr/react-oidc": "^7.22.6", + "@axa-fr/react-oidc": "^7.22.7", "@tanstack/react-query": "^5.40.1", "antd": "^5.18.0", "echarts": "5.5.0", @@ -172,27 +172,27 @@ } }, "node_modules/@axa-fr/oidc-client": { - "version": "7.22.6", - "resolved": "https://registry.npmjs.org/@axa-fr/oidc-client/-/oidc-client-7.22.6.tgz", - "integrity": "sha512-xDMfVjjhGYvfEiIei4iNqbjAMWDTOtgunBdxF9SNtJMZPT/m1vUUubrgZtLmRlZqIvgD3Nni/xBME8nqt8WPvw==", + "version": "7.22.7", + "resolved": "https://registry.npmjs.org/@axa-fr/oidc-client/-/oidc-client-7.22.7.tgz", + "integrity": "sha512-xiaHrnLc4q2KDooGucDRU8gmRtYMAhJpG8F4/evpYZdSRR6KqkGoEz8aEUWcyYuWRUUt0uOuuUdy8UDGjjXWyA==", "hasInstallScript": true, "dependencies": { - "@axa-fr/oidc-client-service-worker": "7.22.6" + "@axa-fr/oidc-client-service-worker": "7.22.7" } }, "node_modules/@axa-fr/oidc-client-service-worker": { - "version": "7.22.6", - "resolved": "https://registry.npmjs.org/@axa-fr/oidc-client-service-worker/-/oidc-client-service-worker-7.22.6.tgz", - "integrity": "sha512-8DcyQ7NYXjq23nS+ptvbOOEqvpjNlqrkZMJWEvtQgYDnHaZ5GVNCuqDEAOldRrfADaZU3P1wjIhC5W+Y+xoIbA==" + "version": "7.22.7", + "resolved": "https://registry.npmjs.org/@axa-fr/oidc-client-service-worker/-/oidc-client-service-worker-7.22.7.tgz", + "integrity": "sha512-2pWu4hjwdXzdEXq2jQiz8Hb+vxDLzcz9X2WhX4q0CMNXdQLmc6z7hDqjS/E385oOrioehHnGy/ONmcE0bDfpWA==" }, "node_modules/@axa-fr/react-oidc": { - "version": "7.22.6", - "resolved": "https://registry.npmjs.org/@axa-fr/react-oidc/-/react-oidc-7.22.6.tgz", - "integrity": "sha512-jiVN3DmVQ02Pmd/K0uaKQje1Zh/inykwcjxbzsCP70kwi8wyqbuB+1msVRlq/OQZw+M/PdcXFqBUDKTw/KAfXA==", + "version": "7.22.7", + "resolved": "https://registry.npmjs.org/@axa-fr/react-oidc/-/react-oidc-7.22.7.tgz", + "integrity": "sha512-1Vr38NHUo5J7DhPTrXPRg5aAvUvSjeGThnUVFCYPThiy6MbPP3VGx2gGmXjCsGtVyJeRFq39lOSh1DR70jfwZg==", "hasInstallScript": true, "dependencies": { - "@axa-fr/oidc-client": "7.22.6", - "@axa-fr/oidc-client-service-worker": "7.22.6" + "@axa-fr/oidc-client": "7.22.7", + "@axa-fr/oidc-client-service-worker": "7.22.7" }, "peerDependencies": { "react": "^17.0.0 || ^18.0.0" diff --git a/package.json b/package.json index 1eca33a8..ec8af2a7 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "type": "module", "dependencies": { "@ant-design/icons": "^5.3.7", - "@axa-fr/react-oidc": "^7.22.6", + "@axa-fr/react-oidc": "^7.22.7", "@tanstack/react-query": "^5.40.1", "antd": "^5.18.0", "echarts": "5.5.0", From 5678283587c727e5c3ba65f24543e03e47098a6f Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Sat, 8 Jun 2024 05:56:34 +0200 Subject: [PATCH 6/6] dependencies: bump vite from 5.2.12 to 5.2.13 (#865) Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 5.2.12 to 5.2.13. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v5.2.13/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v5.2.13/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 8 ++++---- package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index a06bb325..3a2d85e0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -58,7 +58,7 @@ "ts-jest": "^29.1.4", "typescript": "5.4.5", "uuid": "^9.0.1", - "vite": "^5.2.12" + "vite": "^5.2.13" } }, "node_modules/@aashutoshrathi/word-wrap": { @@ -17761,9 +17761,9 @@ } }, "node_modules/vite": { - "version": "5.2.12", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.2.12.tgz", - "integrity": "sha512-/gC8GxzxMK5ntBwb48pR32GGhENnjtY30G4A0jemunsBkiEZFw60s8InGpN8gkhHEkjnRK1aSAxeQgwvFhUHAA==", + "version": "5.2.13", + "resolved": "https://registry.npmjs.org/vite/-/vite-5.2.13.tgz", + "integrity": "sha512-SSq1noJfY9pR3I1TUENL3rQYDQCFqgD+lM6fTRAM8Nv6Lsg5hDLaXkjETVeBt+7vZBCMoibD+6IWnT2mJ+Zb/A==", "dev": true, "dependencies": { "esbuild": "^0.20.1", diff --git a/package.json b/package.json index ec8af2a7..e7e569f4 100644 --- a/package.json +++ b/package.json @@ -132,7 +132,7 @@ "ts-jest": "^29.1.4", "typescript": "5.4.5", "uuid": "^9.0.1", - "vite": "^5.2.12" + "vite": "^5.2.13" }, "overrides": { "react-scripts": {