feat(vrack-services): refactor codebase to follow best practices

packages/manager/apps/vrack-services/mocks/vrack/association.ts

@@ -1,6 +1,6 @@
 import { PathParams } from 'msw';
-import { AllowedServicesResponse, Status, Task } from '../../src/data/api.type';
 import vrackServicesList from '../vrack-services/get-vrack-services.json';
+import { AllowedServicesResponse, Status, Task } from '@/types';
 
 export const getAllowedServicesResponse = (
   nbEligibleVrackServices: number,

packages/manager/apps/vrack-services/src/components/CreateVrack.component.tsx

@@ -16,7 +16,6 @@ import {
   OsdsMessage,
 } from '@ovhcloud/ods-components/react';
 import {
-  CreateCartResult,
   OrderDescription,
   getDeliveringOrderQueryKey,
   useOrderPollingStatus,
@@ -29,14 +28,13 @@ import {
 } from '@ovh-ux/manager-react-shell-client';
 import { useNavigate } from 'react-router-dom';
 import { handleClick } from '@ovh-ux/manager-react-components';
-import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { ApiError } from '@ovh-ux/manager-core-api';
-import { getVrackListQueryKey } from '@/data';
+import { useQueryClient } from '@tanstack/react-query';
+import { getVrackListQueryKey } from '@/data/api';
 import { DeliveringMessages } from '@/components/DeliveringMessages.component';
 import { MessagesContext } from './feedback-messages/Messages.context';
 import { LoadingText } from './LoadingText.component';
 import { OrderSubmitModalContent } from './OrderSubmitModalContent.component';
-import { createVrackOnlyCart } from '@/utils/cart';
+import { useCreateCartWithVrack } from '@/data/hooks';
 
 const trackingParams = {
   location: PageLocation.popup,
@@ -55,12 +53,13 @@ export const CreateVrack: React.FC<CreateVrackProps> = ({ closeModal }) => {
   const { trackClick } = useOvhTracking();
   const navigate = useNavigate();
 
-  const { mutate: createCart, data, error, isError, isPending } = useMutation<
-    CreateCartResult,
-    ApiError
-  >({
-    mutationFn: () => createVrackOnlyCart(environment.user.ovhSubsidiary),
-  });
+  const {
+    createCart,
+    data,
+    error,
+    isError,
+    isPending,
+  } = useCreateCartWithVrack(environment.user.ovhSubsidiary);
 
   const {
     data: vrackDeliveringOrders,

packages/manager/apps/vrack-services/src/components/OrderSubmitModalContent.component.tsx

@@ -26,14 +26,10 @@ import {
   PageLocation,
   useOvhTracking,
 } from '@ovh-ux/manager-react-shell-client';
-import {
-  Contract,
-  Order,
-  postOrderCartCartIdCheckout,
-} from '@ovh-ux/manager-module-order';
-import { useMutation } from '@tanstack/react-query';
+import { Contract, Order } from '@ovh-ux/manager-module-order';
 import { ApiError, ApiResponse } from '@ovh-ux/manager-core-api';
 import { LoadingText } from '@/components/LoadingText.component';
+import { useSendOrder } from '@/data/hooks';
 
 export type OrderSubmitModalContentProps = {
   submitButtonLabel: string;
@@ -53,38 +49,7 @@ export const OrderSubmitModalContent: React.FC<OrderSubmitModalContentProps> = (
   const { t } = useTranslation('vrack-services');
   const { trackClick } = useOvhTracking();
   const [isContractAccepted, setIsContractAccepted] = React.useState(false);
-  const { mutate: sendOrder, isPending, error, isError } = useMutation<
-    ApiResponse<Order>,
-    ApiError
-  >({
-    mutationFn: () =>
-      postOrderCartCartIdCheckout({
-        cartId,
-        autoPayWithPreferredPaymentMethod: true,
-        waiveRetractationPeriod: true,
-      }),
-    onSuccess,
-    onError: async (response) => {
-      const {
-        request: { status },
-      } = response;
-
-      if (status === 400) {
-        try {
-          const { data } = await postOrderCartCartIdCheckout({
-            cartId,
-            autoPayWithPreferredPaymentMethod: false,
-            waiveRetractationPeriod: true,
-          });
-          window.top.location.href = data.url;
-        } catch (err) {
-          onError(response);
-        }
-      } else {
-        onError(response);
-      }
-    },
-  });
+  const { sendOrder, isPending, error, isError } = useSendOrder();
 
   return (
     <>
@@ -157,7 +122,7 @@ export const OrderSubmitModalContent: React.FC<OrderSubmitModalContentProps> = (
             buttonType: ButtonType.button,
             actions: ['order', 'confirm'],
           });
-          sendOrder();
+          sendOrder({ cartId, onSuccess, onError });
         })}
       >
         {submitButtonLabel}

packages/manager/apps/vrack-services/src/components/ProductStatusChip.component.tsx

@@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next';
 import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming';
 import { ODS_SPINNER_SIZE } from '@ovhcloud/ods-components';
 import { OsdsSpinner, OsdsChip } from '@ovhcloud/ods-components/react';
-import { ProductStatus } from '@/data';
+import { ProductStatus } from '@/types';
 
 const colorByProductStatus = {
   [ProductStatus.ACTIVE]: ODS_THEME_COLOR_INTENT.success,

packages/manager/apps/vrack-services/src/components/ProductStatusChip.spec.tsx

@@ -6,7 +6,7 @@ import {
   ProductStatusChip,
   ProductStatusChipProps,
 } from './ProductStatusChip.component';
-import { ProductStatus } from '@/data';
+import { ProductStatus } from '@/types';
 
 const renderComponent = ({ productStatus }: ProductStatusChipProps) => {
   return render(<ProductStatusChip productStatus={productStatus} />);

packages/manager/apps/vrack-services/src/components/display-name/DisplayName.component.tsx

@@ -8,9 +8,10 @@ import { useNavigate } from 'react-router-dom';
 import { OsdsLink } from '@ovhcloud/ods-components/react';
 import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming';
 import { EditButton } from './EditButton.component';
-import { VrackServicesWithIAM, getDisplayName, isEditable } from '@/data';
 import { urls } from '@/routes/routes.constants';
 import { InfoIcon } from './InfoIcon.component';
+import { isEditable, getDisplayName } from '@/utils/vrack-services';
+import { VrackServicesWithIAM } from '@/types';
 
 export type DisplayNameProps = {
   isListing?: boolean;

packages/manager/apps/vrack-services/src/components/display-name/DisplayName.spec.tsx

@@ -6,8 +6,8 @@ import { describe, expect, it } from 'vitest';
 import { render } from '@testing-library/react';
 import { DisplayName } from '@/components/display-name/DisplayName.component';
 import vrackServicesList from '../../../mocks/vrack-services/get-vrack-services.json';
-import { VrackServicesWithIAM } from '@/data';
 import '@testing-library/jest-dom';
+import { VrackServicesWithIAM } from '@/types';
 
 const defaultVs = vrackServicesList[0] as VrackServicesWithIAM;
 

packages/manager/apps/vrack-services/src/components/display-name/InfoIcon.component.tsx

@@ -13,7 +13,8 @@ import {
   ODS_SPINNER_SIZE,
 } from '@ovhcloud/ods-components';
 import { useTranslation } from 'react-i18next';
-import { ResourceStatus, VrackServicesWithIAM, getDisplayName } from '@/data';
+import { ResourceStatus, VrackServicesWithIAM } from '@/types';
+import { getDisplayName } from '@/utils/vrack-services';
 
 export type InfoInconProps = {
   className?: string;

packages/manager/apps/vrack-services/src/components/feedback-messages/OperationMessages.component.tsx

@@ -7,12 +7,9 @@ import {
 } from '@ovhcloud/ods-components';
 import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming';
 import { useTranslation } from 'react-i18next';
-import {
-  useVrackServicesList,
-  ResourceStatus,
-  VrackServicesWithIAM,
-  getDisplayName,
-} from '@/data';
+import { useVrackServicesList } from '@/data/hooks';
+import { ResourceStatus, VrackServicesWithIAM } from '@/types';
+import { getDisplayName } from '@/utils/vrack-services';
 
 const shouldDisplayMessage = (vs: VrackServicesWithIAM) =>
   vs.resourceStatus !== ResourceStatus.READY;

packages/manager/apps/vrack-services/src/components/feedback-messages/OperationMessages.spec.tsx

@@ -5,7 +5,8 @@ import { ApiError, ApiResponse } from '@ovh-ux/manager-core-api';
 import { UseQueryResult } from '@tanstack/react-query';
 import { OperationMessages } from './OperationMessages.component';
 import vrackServicesList from '../../../mocks/vrack-services/get-vrack-services.json';
-import { VrackServicesWithIAM, useVrackServicesList } from '@/data';
+import { useVrackServicesList } from '@/data/hooks';
+import { VrackServicesWithIAM } from '@/types';
 
 /** Render */
 
@@ -16,8 +17,8 @@ const renderComponent = ({ id }: { id?: string }) => {
 /** END RENDER */
 
 /** MOCKS */
-vi.mock('@/data', async (importOriginal) => {
-  const original: typeof import('@/data') = await importOriginal();
+vi.mock('@/data/hooks', async (importOriginal) => {
+  const original: typeof import('@/data/hooks') = await importOriginal();
   return {
     ...original,
     useVrackServicesList: vi.fn(),

packages/manager/apps/vrack-services/src/components/feedback-messages/SuccessMessage.component.tsx

@@ -12,7 +12,7 @@ import {
 import { OdsHTMLAnchorElementTarget } from '@ovhcloud/ods-common-core';
 import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming';
 import { MessageData, MessagesContext } from './Messages.context';
-import { useVrackServicesList } from '@/data';
+import { useVrackServicesList } from '@/data/hooks';
 
 export const SuccessMessage: React.FC<Partial<MessageData>> = ({
   id,

packages/manager/apps/vrack-services/src/components/feedback-messages/SuccessMessage.spec.tsx

@@ -4,9 +4,10 @@ import { render, waitFor } from '@testing-library/react';
 import { ApiError, ApiResponse } from '@ovh-ux/manager-core-api';
 import { UseQueryResult } from '@tanstack/react-query';
 import vrackServicesList from '../../../mocks/vrack-services/get-vrack-services.json';
-import { VrackServicesWithIAM, useVrackServicesList } from '@/data';
+import { useVrackServicesList } from '@/data/hooks';
 import { SuccessMessages } from './SuccessMessage.component';
 import { MessagesContext, MessagesContextType } from './Messages.context';
+import { VrackServicesWithIAM } from '@/types';
 
 /** Render */
 const mockContextMessage = {
@@ -33,8 +34,8 @@ const renderComponent = ({ id }: { id?: string }) => {
 /** END RENDER */
 
 /** MOCKS */
-vi.mock('@/data', async (importOriginal) => {
-  const original: typeof import('@/data') = await importOriginal();
+vi.mock('@/data/hooks', async (importOriginal) => {
+  const original: typeof import('@/data/hooks') = await importOriginal();
   return {
     ...original,
     useVrackServicesList: vi.fn(),

packages/manager/apps/vrack-services/src/components/layout-helpers/DashboardLayout.spec.tsx

@@ -15,13 +15,14 @@ import {
   DashboardLayout,
   DashboardLayoutProps,
 } from './DashboardLayout.component';
-import { VrackServicesWithIAM, useVrackServicesList } from '@/data';
+import { useVrackServicesList } from '@/data/hooks';
 import vrackServicesList from '../../../mocks/vrack-services/get-vrack-services.json';
+import { VrackServicesWithIAM } from '@/types';
 
 const queryClient = new QueryClient();
 
-vi.mock('@/data', async (importOriginal) => {
-  const original: typeof import('@/data') = await importOriginal();
+vi.mock('@/data/hooks', async (importOriginal) => {
+  const original: typeof import('@/data/hooks') = await importOriginal();
   return {
     ...original,
     useVrackServicesList: vi.fn(),

packages/manager/apps/vrack-services/src/components/vrack-id/VrackId.component.tsx

@@ -3,8 +3,9 @@ import { ODS_THEME_COLOR_INTENT } from '@ovhcloud/ods-common-theming';
 import { OsdsLink } from '@ovhcloud/ods-components/react';
 import { ActionMenu, DataGridTextCell } from '@ovh-ux/manager-react-components';
 import { ShellContext } from '@ovh-ux/manager-react-shell-client';
-import { VrackServicesWithIAM, isEditable } from '@/data';
 import { useVrackMenuItems } from './useVrackMenuItems.hook';
+import { VrackServicesWithIAM } from '@/types';
+import { isEditable } from '@/utils/vrack-services';
 
 export type VrackIdProps = { isListing?: boolean } & VrackServicesWithIAM;
 

packages/manager/apps/vrack-services/src/components/vrack-id/VrackId.spec.tsx

@@ -9,8 +9,8 @@ import {
   ShellContextType,
 } from '@ovh-ux/manager-react-shell-client';
 import { VrackId } from './VrackId.component';
-import { VrackServicesWithIAM } from '@/data';
 import vrackServicesList from '../../../mocks/vrack-services/get-vrack-services.json';
+import { VrackServicesWithIAM } from '@/types';
 
 const defaultVs = vrackServicesList[5] as VrackServicesWithIAM;
 const vsWithoutVrack = vrackServicesList[0] as VrackServicesWithIAM;

packages/manager/apps/vrack-services/src/components/vrack-id/useVrackMenuItems.hook.ts

@@ -6,8 +6,9 @@ import {
   useOvhTracking,
 } from '@ovh-ux/manager-react-shell-client';
 import { useNavigate } from 'react-router-dom';
-import { VrackServicesWithIAM, isEditable } from '@/data';
 import { urls } from '@/routes/routes.constants';
+import { VrackServicesWithIAM } from '@/types';
+import { isEditable } from '@/utils/vrack-services';
 
 export type UseVrackMenuItemsParams = {
   vs: VrackServicesWithIAM;

packages/manager/apps/vrack-services/src/data/vrack/delete.ts → packages/manager/apps/vrack-services/src/data/api/delete/dissociateVrackServicesFromVrack.ts

@@ -1,5 +1,5 @@
 import { apiClient } from '@ovh-ux/manager-core-api';
-import { VrackTask } from './vrack.type';
+import { VrackTask } from '@/types';
 
 export type DissociateVrackServicesParams = {
   /** The internal name of your vrack */

packages/manager/apps/vrack-services/src/data/api/delete/index.ts

@@ -0,0 +1 @@
+export * from './dissociateVrackServicesFromVrack';

packages/manager/apps/vrack-services/src/data/api/get/elegibleManagedServiceList.ts

@@ -0,0 +1,14 @@
+import { apiClient } from '@ovh-ux/manager-core-api';
+import { EligibleManagedService } from '@/types';
+
+export const getEligibleManagedServiceListQueryKey = (
+  vrackServicesId: string,
+) => [`get/vrackServices/resource/${vrackServicesId}/eligibleManagedService`];
+
+/**
+ * List all managed services eligible to the requested vRack Services
+ */
+export const getEligibleManagedServiceList = async (vrackServicesId: string) =>
+  apiClient.v2.get<EligibleManagedService[]>(
+    `/vrackServices/resource/${vrackServicesId}/eligibleManagedService`,
+  );

packages/manager/apps/vrack-services/src/data/iam/get.ts → packages/manager/apps/vrack-services/src/data/api/get/iamResource.ts

@@ -1,5 +1,5 @@
 import { apiClient } from '@ovh-ux/manager-core-api';
-import { IAMResource } from './iam.type';
+import { IAMResource } from '@/types';
 
 export const getIamResourceQueryKey = (resourceURNList: string[]) => [
   `get/iam/resource/${resourceURNList.join(',')}`,

packages/manager/apps/vrack-services/src/data/api/get/index.ts

@@ -0,0 +1,7 @@
+export * from './vrackServicesResource';
+export * from './vrackServicesResourceList';
+export * from './iamResource';
+export * from './elegibleManagedServiceList';
+export * from './vrackList';
+export * from './vrackAllowedServices';
+export * from './vrackServicesReferenceRegionList';

packages/manager/apps/vrack-services/src/data/api/get/vrackAllowedServices.ts

@@ -0,0 +1,25 @@
+import { apiClient } from '@ovh-ux/manager-core-api';
+import {
+  AllowedServicesResponse,
+  GetVrackAllowedServicesParams,
+} from '@/types';
+
+export const getVrackAllowedServicesQueryKey = ({
+  vrack,
+  serviceFamily,
+}: GetVrackAllowedServicesParams) => [
+  `get/vrack/${vrack}/allowedServices${serviceFamily || ''}`,
+];
+
+/**
+ * allowedServices operations : List all services allowed in this vrack
+ */
+export const getVrackAllowedServices = async ({
+  vrack,
+  serviceFamily,
+}: GetVrackAllowedServicesParams) =>
+  apiClient.v6.get<AllowedServicesResponse>(
+    `/vrack/${vrack}/allowedServices${
+      serviceFamily ? `?serviceFamily=${serviceFamily}` : ''
+    }`,
+  );

packages/manager/apps/vrack-services/src/data/api/get/vrackList.ts

@@ -0,0 +1,5 @@
+import { apiClient } from '@ovh-ux/manager-core-api';
+
+export const getVrackListQueryKey = ['get/vrack'];
+
+export const getVrackList = () => apiClient.v6.get<string[]>('/vrack');

packages/manager/apps/vrack-services/src/data/api/get/vrackServicesReferenceRegionList.ts

@@ -0,0 +1,12 @@
+import { apiClient } from '@ovh-ux/manager-core-api';
+import { Region } from '@/types';
+
+export const getvrackServicesReferenceRegionListQueryKey = [
+  'get/vrackServices/reference/region',
+];
+
+/**
+ * List all vRack Services regions
+ */
+export const getvrackServicesReferenceRegionList = () =>
+  apiClient.v2.get<Region[]>('/vrackServices/reference/region');

packages/manager/apps/vrack-services/src/data/api/get/vrackServicesResource.ts

@@ -0,0 +1,14 @@
+import { apiClient } from '@ovh-ux/manager-core-api';
+import { VrackServicesWithIAM } from '@/types';
+
+export const getVrackServicesResourceQueryKey = (vrackServicesId: string) => [
+  `get/vrackServices/resource/${vrackServicesId}`,
+];
+
+/**
+ * Get the vRack Services
+ */
+export const getVrackServicesResource = async (vrackServicesId: string) =>
+  apiClient.v2.get<VrackServicesWithIAM>(
+    `/vrackServices/resource/${vrackServicesId}`,
+  );