feat(hpc-managed-vcd): add storage performance data in order page

ref: MANAGER-16607

Signed-off-by: David Arsène <david.arsene.ext@ovhcloud.com>

packages/manager/apps/hpc-vmware-managed-vcd/public/translations/datacentres/order/Messages_fr_FR.json

@@ -8,6 +8,7 @@
   "managed_vcd_vdc_order_ram_value": "{{ram}} Go",
   "managed_vcd_vdc_order_vcpu_count": "Nombre de vCPU",
   "managed_vcd_vdc_order_type": "Type",
+  "managed_vcd_vdc_order_performance_class": "{{performanceClass}}/To",
   "managed_vcd_vdc_order_price": "Prix",
   "managed_vcd_vdc_order_price_detail": "Prix pour 1 mois",
   "managed_vcd_vdc_order_quantity_title": "Choisir une quantité",

packages/manager/apps/hpc-vmware-managed-vcd/src/components/datagrid/storage/StorageOrderCells.component.tsx

@@ -30,8 +30,8 @@ export const StorageOrderSelectCell = (storage: VCDOrderableStoragePriced) => {
   );
 };
 
-export const StorageOrderTypeCell = (storage: VCDOrderableStoragePriced) => (
-  <DataGridTextCell>{storage.name}</DataGridTextCell>
+export const StorageOrderTypeCell = ({ name }: VCDOrderableStoragePriced) => (
+  <DataGridTextCell>{name}</DataGridTextCell>
 );
 
 export const StorageOrderPriceCell = (storage: VCDOrderableStoragePriced) => {
@@ -45,3 +45,14 @@ export const StorageOrderPriceCell = (storage: VCDOrderableStoragePriced) => {
     </DataGridTextCell>
   );
 };
+
+export const StoragePerformanceClassCell = ({
+  performanceClass,
+}: VCDOrderableStoragePriced) => {
+  const { t } = useTranslation('datacentres/order');
+  return (
+    <DataGridTextCell>
+      {t('managed_vcd_vdc_order_performance_class', { performanceClass })}
+    </DataGridTextCell>
+  );
+};

packages/manager/apps/hpc-vmware-managed-vcd/src/pages/dashboard/datacentre/storage-order/DatacentreStorageOrder.page.tsx

@@ -8,8 +8,10 @@ import {
   StorageOrderPriceCell,
   StorageOrderSelectCell,
   StorageOrderTypeCell,
+  StoragePerformanceClassCell,
 } from '@/components/datagrid/storage/StorageOrderCells.component';
 import {
+  PERFORMANCE_CLASS_LABEL,
   STORAGE_ORDER_MAX_QUANTITY,
   STORAGE_ORDER_MIN_QUANTITY,
 } from './datacentreStorageOrder.constants';
@@ -31,6 +33,12 @@ export default function StorageOrderPage() {
       label: t('managed_vcd_vdc_order_type'),
       isSortable: false,
     },
+    {
+      id: 'performanceClass',
+      cell: StoragePerformanceClassCell,
+      label: PERFORMANCE_CLASS_LABEL,
+      isSortable: false,
+    },
     {
       id: 'price',
       cell: StorageOrderPriceCell,

packages/manager/apps/hpc-vmware-managed-vcd/src/pages/dashboard/datacentre/storage-order/DatacentreStorageOrder.spec.tsx

@@ -3,9 +3,11 @@ import userEvent from '@testing-library/user-event';
 import {
   organizationList,
   datacentreList,
+  orderableResourceData,
 } from '@ovh-ux/manager-module-vcd-api';
 import { assertTextVisibility } from '@ovh-ux/manager-core-test-utils';
 import { labels, renderTest } from '../../../../test-utils';
+import { PERFORMANCE_CLASS_LABEL } from './datacentreStorageOrder.constants';
 
 const orderCTA = labels.datacentresStorage.managed_vcd_vdc_storage_order_cta;
 const orderTitle = labels.datacentresOrder.managed_vcd_vdc_order_storage_title;
@@ -17,11 +19,32 @@ describe('Datacentre Storage Order Page', () => {
       initialRoute: `/${organizationList[0].id}/datacentres/${datacentreList[0].id}/storage`,
     });
 
+    const { name, performanceClass } = orderableResourceData.storage[0];
+
+    // checks CTA
     await assertTextVisibility(orderCTA);
     const orderButton = screen.getByText(orderCTA);
     await waitFor(() => userEvent.click(orderButton));
 
     await assertTextVisibility(orderTitle);
+
+    // check datagrid content
+    await assertTextVisibility(
+      labels.datacentresOrder.managed_vcd_vdc_order_type,
+    );
+    await assertTextVisibility(name);
+
+    await assertTextVisibility(PERFORMANCE_CLASS_LABEL);
+    await assertTextVisibility(
+      labels.datacentresOrder.managed_vcd_vdc_order_performance_class
+        .toString()
+        .replace('{{performanceClass}}', performanceClass),
+    );
+
+    await assertTextVisibility(
+      labels.datacentresOrder.managed_vcd_vdc_order_price,
+    );
+    await assertTextVisibility('80.00 €');
   });
 
   it('display an error if orderableResource service is KO', async () => {

packages/manager/apps/hpc-vmware-managed-vcd/src/pages/dashboard/datacentre/storage-order/datacentreStorageOrder.constants.ts

@@ -1,2 +1,3 @@
 export const STORAGE_ORDER_MIN_QUANTITY = 1;
 export const STORAGE_ORDER_MAX_QUANTITY = 50;
+export const PERFORMANCE_CLASS_LABEL = 'Performance class';

packages/manager/modules/vcd-api/src/mocks/vcd-datacentre/vdc-orderable-resource.mock.ts

@@ -30,6 +30,7 @@ export const orderableResourceData: VCDOrderableResourceData = {
       name: 'vcd-datastore-1000',
       profile: 'vcd-datastore-1000',
       type: 'storage',
+      performanceClass: '250',
     },
   ],
 };

packages/manager/modules/vcd-api/src/types/vcd-orderable-resource.type.ts

@@ -5,7 +5,9 @@ import { VCDCatalogProductPricing } from './vcd-catalog.type';
 export type VCDOrderableVHost = Omit<VCDComputeState, 'billingType'> & {
   vCPUSpeed: number;
 };
-export type VCDOrderableStorage = Omit<VCDStorageState, 'billingType'>;
+export type VCDOrderableStorage = Omit<VCDStorageState, 'billingType'> & {
+  performanceClass: string;
+};
 
 type WithPricing<T> = T & { pricing: VCDCatalogProductPricing };