From b8e488efa4066487cca0ee6caf8fcff93e22c18e Mon Sep 17 00:00:00 2001
From: Yaacov Zamir <kobi.zamir@gmail.com>
Date: Wed, 14 Feb 2024 09:51:01 +0200
Subject: [PATCH] Refactor plan details suspend

Signed-off-by: Yaacov Zamir <kobi.zamir@gmail.com>
---
 .../Plans/views/details/PlanDetailsPage.tsx     | 17 ++++++++++-------
 .../views/details/tabs/Details/PlanDetails.tsx  |  9 +++------
 .../views/details/tabs/Hooks/PlanHooks.tsx      |  6 ++----
 .../details/tabs/Mappings/PlanMappings.tsx      |  6 ++----
 .../VirtualMachines/PlanVirtualMachines.tsx     |  6 ++----
 .../Plans/views/details/tabs/YAML/PlanYAML.tsx  | 16 +---------------
 6 files changed, 20 insertions(+), 40 deletions(-)

diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.tsx
index 259e76fe3..547d70995 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/PlanDetailsPage.tsx
@@ -9,6 +9,7 @@ import {
   useK8sWatchResource,
 } from '@openshift-console/dynamic-plugin-sdk';
 
+import { Suspend } from './components';
 import { PlanDetails, PlanHooks, PlanMappings, PlanVirtualMachines, PlanYAML } from './tabs';
 
 import './PlanDetailsPage.style.css';
@@ -94,13 +95,15 @@ export const PlanDetailsPage: React.FC<PlanDetailsPageProps> = ({ name, namespac
   });
 
   return (
-    <MemoPlanDetailsPage
-      name={name}
-      namespace={namespace}
-      obj={plan}
-      loaded={loaded}
-      loadError={error}
-    />
+    <Suspend obj={plan} loaded={loaded} loadError={error}>
+      <MemoPlanDetailsPage
+        name={name}
+        namespace={namespace}
+        obj={plan}
+        loaded={loaded}
+        loadError={error}
+      />
+    </Suspend>
   );
 };
 PlanDetailsPage.displayName = 'PlanDetailsPage';
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Details/PlanDetails.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Details/PlanDetails.tsx
index 53bed3fba..fa0821f71 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Details/PlanDetails.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Details/PlanDetails.tsx
@@ -3,17 +3,14 @@ import { useForkliftTranslation } from 'src/utils/i18n';
 
 import { PageSection, Title } from '@patternfly/react-core';
 
-import { Suspend } from '../../components';
 import { PlanDetailsTabProps } from '../../PlanDetailsPage';
 
 export const PlanDetails: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadError }) => {
   const { t } = useForkliftTranslation();
 
   return (
-    <Suspend obj={plan} loaded={loaded} loadError={loadError}>
-      <PageSection variant="light" className="forklift-page-section--info">
-        <Title headingLevel={'h1'}>{t('Details')}</Title>
-      </PageSection>
-    </Suspend>
+    <PageSection variant="light" className="forklift-page-section--info">
+      <Title headingLevel={'h1'}>{t('Details')}</Title>
+    </PageSection>
   );
 };
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Hooks/PlanHooks.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Hooks/PlanHooks.tsx
index 00ba1dc10..41f6e68f0 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Hooks/PlanHooks.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Hooks/PlanHooks.tsx
@@ -5,18 +5,16 @@ import { HookModelGroupVersionKind } from '@kubev2v/types';
 import { ResourceLink } from '@openshift-console/dynamic-plugin-sdk';
 import { PageSection, Title } from '@patternfly/react-core';
 
-import { Suspend } from '../../components';
 import { PlanDetailsTabProps } from '../../PlanDetailsPage';
 
 export const PlanHooks: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadError }) => {
   const { t } = useForkliftTranslation();
 
   return (
-    <Suspend obj={plan} loaded={loaded} loadError={loadError}>
+    <>
       <PageSection variant="light" className="forklift-page-section--info">
         <Title headingLevel={'h1'}>{t('Hooks')}</Title>
       </PageSection>
-
       <PageSection variant="light" className="forklift-page-section--info">
         {plan?.spec?.vms?.[0]?.hooks?.[0]?.hook && (
           <ResourceLink
@@ -26,6 +24,6 @@ export const PlanHooks: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadErr
           />
         )}
       </PageSection>
-    </Suspend>
+    </>
   );
 };
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Mappings/PlanMappings.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Mappings/PlanMappings.tsx
index c9f92806d..0f0135b79 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Mappings/PlanMappings.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/Mappings/PlanMappings.tsx
@@ -5,18 +5,16 @@ import { NetworkMapModelGroupVersionKind, StorageMapModelGroupVersionKind } from
 import { ResourceLink } from '@openshift-console/dynamic-plugin-sdk';
 import { PageSection, Title } from '@patternfly/react-core';
 
-import { Suspend } from '../../components';
 import { PlanDetailsTabProps } from '../../PlanDetailsPage';
 
 export const PlanMappings: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadError }) => {
   const { t } = useForkliftTranslation();
 
   return (
-    <Suspend obj={plan} loaded={loaded} loadError={loadError}>
+    <>
       <PageSection variant="light" className="forklift-page-section--info">
         <Title headingLevel={'h1'}>{t('Mappings')}</Title>
       </PageSection>
-
       <PageSection variant="light" className="forklift-page-section--info">
         <ResourceLink
           groupVersionKind={NetworkMapModelGroupVersionKind}
@@ -29,6 +27,6 @@ export const PlanMappings: React.FC<PlanDetailsTabProps> = ({ plan, loaded, load
           namespace={plan.spec.map.storage.namespace}
         />
       </PageSection>
-    </Suspend>
+    </>
   );
 };
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/PlanVirtualMachines.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/PlanVirtualMachines.tsx
index 8119e9b0a..539c0aa2b 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/PlanVirtualMachines.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/VirtualMachines/PlanVirtualMachines.tsx
@@ -3,18 +3,16 @@ import { useForkliftTranslation } from 'src/utils/i18n';
 
 import { PageSection, Title } from '@patternfly/react-core';
 
-import { Suspend } from '../../components';
 import { PlanDetailsTabProps } from '../../PlanDetailsPage';
 
 export const PlanVirtualMachines: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadError }) => {
   const { t } = useForkliftTranslation();
 
   return (
-    <Suspend obj={plan} loaded={loaded} loadError={loadError}>
+    <>
       <PageSection variant="light" className="forklift-page-section--info">
         <Title headingLevel={'h1'}>{t('Virtual machines')}</Title>
       </PageSection>
-
       <PageSection variant="light" className="forklift-page-section--info">
         <ol>
           {plan.spec.vms.map((vm) => (
@@ -22,6 +20,6 @@ export const PlanVirtualMachines: React.FC<PlanDetailsTabProps> = ({ plan, loade
           ))}
         </ol>
       </PageSection>
-    </Suspend>
+    </>
   );
 };
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/YAML/PlanYAML.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/YAML/PlanYAML.tsx
index 601f4704d..dfdb9f65c 100644
--- a/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/YAML/PlanYAML.tsx
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/details/tabs/YAML/PlanYAML.tsx
@@ -2,25 +2,11 @@ import React from 'react';
 import { useForkliftTranslation } from 'src/utils/i18n';
 
 import { ResourceYAMLEditor } from '@openshift-console/dynamic-plugin-sdk';
-import { Bullseye } from '@patternfly/react-core';
 
-import { Loading } from '../../components';
 import { PlanDetailsTabProps } from '../../PlanDetailsPage';
 
 export const PlanYAML: React.FC<PlanDetailsTabProps> = ({ plan, loaded, loadError }) => {
   const { t } = useForkliftTranslation();
 
-  return (
-    <React.Suspense
-      fallback={
-        <Bullseye>
-          <Loading />
-        </Bullseye>
-      }
-    >
-      {plan && loaded && !loadError && (
-        <ResourceYAMLEditor header={t('Provider YAML')} initialResource={plan} />
-      )}
-    </React.Suspense>
-  );
+  return <ResourceYAMLEditor header={t('Provider YAML')} initialResource={plan} />;
 };