feat(generator): delete component loading and error

ref: MANAGER-14535

Signed-off-by: Alex Boungnaseng <[email protected]>

packages/manager-react-components/src/components/breadcrumb/breadcrumb.component.tsx

@@ -16,9 +16,8 @@ export const Breadcrumb: React.FC<BreadcrumbProps> = ({
   rootLabel,
   appName,
 }) => {
-  const label = rootLabel;
   const breadcrumbItems = useBreadcrumb({
-    rootLabel: label,
+    rootLabel,
     appName,
   });
   return (

packages/manager-react-components/src/components/templates/error/error.component.tsx

@@ -35,7 +35,6 @@ export const ErrorBanner = ({
     env?.then((response) => {
       const { applicationName } = response;
       const name = `errors::${getTrackingTypology(error)}::${applicationName}`;
-      // to confirm with the tracking team
       shell?.tracking?.trackPage({
         name,
         level2: '81',

packages/manager/core/generator/app/conditional-templates/listing/v2/index.tsx.hbs

@@ -2,20 +2,18 @@ import React, { useState, useEffect, } from 'react';
 import { useTranslation } from 'react-i18next';
 import { {{#if isPCI }}useParams, {{/if}} useNavigate, useLocation } from 'react-router-dom';
 
-import { OdsButton } from '@ovhcloud/ods-components/react';
+import { OdsButton, OdsSpinner } from '@ovhcloud/ods-components/react';
 import { ODS_BUTTON_VARIANT } from '@ovhcloud/ods-components';
 
 import {
   BaseLayout,
   Breadcrumb,
   Datagrid,
   DataGridTextCell,
+  ErrorBanner,
   useResourcesIcebergV2,
 } from '@ovh-ux/manager-react-components';
 
-import Loading from '@/components/Loading/Loading';
-import ErrorBanner from '@/components/Error/Error';
-
 import appConfig from '@/{{appName}}.config';
 import { urls } from '@/routes/routes.constant';
 
@@ -83,11 +81,21 @@ export default function Listing() {
   }, [data]);
 
   if (isError) {
-    return <ErrorBanner error={error} />;
+    const { response }: any = error;
+    const errorObj = {
+      data: error,
+      headers: response.headers,
+      status: response.status,
+    };
+    return (<ErrorBanner error={errorObj} />);
   }
 
   if (isLoading && !flattenData) {
-    return (<div data-testid="listing-page-spinner"><Loading/></div>)
+    return (
+      <div className="flex justify-center"  data-testid="listing-page-spinner">
+        <OdsSpinner />
+      </div>
+    );
   }
 
   const header = {

packages/manager/core/generator/app/conditional-templates/listing/v6/index.tsx.hbs

@@ -2,21 +2,19 @@ import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { {{#if isPCI }} useParams, {{/if}} useNavigate, useLocation } from 'react-router-dom';
 
-import { OdsButton } from '@ovhcloud/ods-components/react';
+import { OdsButton, OdsSpinner } from '@ovhcloud/ods-components/react';
 import { ODS_BUTTON_VARIANT } from '@ovhcloud/ods-components';
 
 import {
   Breadcrumb,
   Datagrid,
   DataGridTextCell,
+  ErrorBanner,
   useResourcesIcebergV6,
   dataType,
   BaseLayout
 } from '@ovh-ux/manager-react-components';
 
-import Loading from '@/components/Loading/Loading';
-import ErrorBanner from '@/components/Error/Error';
-
 import appConfig from '@/{{appName}}.config';
 
 export default function Listing() {
@@ -84,11 +82,25 @@ export default function Listing() {
   }, [flattenData]);
 
   if (isError) {
-    return <ErrorBanner error={error.message} />;
+    const { response }: any = error;
+    const errorObj = {
+      data: error,
+      headers: response.headers,
+      status: response.status,
+    };
+    return (
+      <ErrorBanner
+        error={errorObj}
+      />
+    );
   }
 
   if (isLoading && pageIndex === 1) {
-    return (<div data-testid="listing-page-spinner"><Loading/></div>)
+    return (
+      <div className="flex justify-center" data-testid="listing-page-spinner">
+        <OdsSpinner />
+      </div>
+    );
   }
 
   const header = {