MGMT-17123: Add CPU and RAM requirements for MCE operator (#2599) (#2601

) * Add CPU and RAM requirements for MCE operator * mend
openshift-assisted · Jun 12, 2024 · 8aa0fe2 · 8aa0fe2
1 parent 89c39fc
commit 8aa0fe2
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 10 deletions.
diff --git a/libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/MceCheckbox.tsx b/libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/MceCheckbox.tsx
@@ -1,25 +1,22 @@
 import React from 'react';
 import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-import { getFieldId, PopoverIcon, getMceDocsLink } from '../../../../common';
+import { getFieldId, PopoverIcon, getMceDocsLink, ClusterOperatorProps } from '../../../../common';
 import { OcmCheckboxField } from '../../ui/OcmFormFields';
 import { useNewFeatureSupportLevel } from '../../../../common/components/newFeatureSupportLevels';
-import { useSelector } from 'react-redux';
-import { selectIsCurrentClusterSNO } from '../../../store/slices/current-cluster/selectors';
-import { getOdfLvmsText } from './utils';
+import MceRequirements from './MceRequirements';
 
 const MCE_FIELD_NAME = 'useMultiClusterEngine';
 
 const MceLabel = ({
   disabledReason,
   isVersionEqualsOrMajorThan4_15,
-  isSNO,
+  clusterId,
 }: {
   disabledReason?: string;
   isVersionEqualsOrMajorThan4_15: boolean;
-  isSNO: boolean;
+  clusterId: ClusterOperatorProps['clusterId'];
 }) => {
-  const odfLvmsText = getOdfLvmsText(isSNO, isVersionEqualsOrMajorThan4_15);
   return (
     <>
       <Tooltip hidden={!disabledReason} content={disabledReason}>
@@ -29,7 +26,12 @@ const MceLabel = ({
         id={MCE_FIELD_NAME}
         component={'a'}
         headerContent="Additional requirements"
-        bodyContent={<>{odfLvmsText}</>}
+        bodyContent={
+          <MceRequirements
+            clusterId={clusterId}
+            isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
+          />
+        }
       />
     </>
   );
@@ -49,13 +51,14 @@ const MceHelperText = ({ docsVersion }: { docsVersion: string }) => {
 };
 
 const MceCheckbox = ({
+  clusterId,
   isVersionEqualsOrMajorThan4_15,
   openshiftVersion,
 }: {
   isVersionEqualsOrMajorThan4_15: boolean;
   openshiftVersion?: string;
+  clusterId: ClusterOperatorProps['clusterId'];
 }) => {
-  const isSNO = useSelector(selectIsCurrentClusterSNO);
   const featureSupportLevelContext = useNewFeatureSupportLevel();
   const fieldId = getFieldId(MCE_FIELD_NAME, 'input');
   const disabledReason = featureSupportLevelContext.getFeatureDisabledReason('MCE');
@@ -67,7 +70,7 @@ const MceCheckbox = ({
           <MceLabel
             disabledReason={disabledReason}
             isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
-            isSNO={isSNO}
+            clusterId={clusterId}
           />
         }
         isDisabled={!!disabledReason}

diff --git a/libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/MceRequirements.tsx b/libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/MceRequirements.tsx
@@ -0,0 +1,61 @@
+import React from 'react';
+import { useSelector } from 'react-redux';
+import { List, ListItem } from '@patternfly/react-core';
+import { useClusterPreflightRequirements } from '../../../hooks';
+import { ErrorState, LoadingState, OPERATOR_NAME_MCE, RenderIf } from '../../../../common';
+import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
+import { selectIsCurrentClusterSNO } from '../../../store/slices/current-cluster/selectors';
+import { getOdfLvmsText } from './utils';
+
+const MceRequirements = ({
+  clusterId,
+  isVersionEqualsOrMajorThan4_15,
+}: {
+  clusterId: Cluster['id'];
+  isVersionEqualsOrMajorThan4_15: boolean;
+}) => {
+  const { preflightRequirements, error, isLoading } = useClusterPreflightRequirements(clusterId);
+  const isSingleNode = useSelector(selectIsCurrentClusterSNO);
+
+  if (isLoading) {
+    return <LoadingState content="Loading hardware requirements ..." />;
+  }
+  if (error) {
+    return <ErrorState />;
+  }
+
+  const mceRequirements = preflightRequirements?.operators?.find(
+    (operatorRequirements) => operatorRequirements.operatorName === OPERATOR_NAME_MCE,
+  );
+
+  const workerRequirements = mceRequirements?.requirements?.worker?.quantitative;
+  const masterRequirements = mceRequirements?.requirements?.master?.quantitative;
+  const odfLvmsText = getOdfLvmsText(isSingleNode, isVersionEqualsOrMajorThan4_15);
+  return (
+    <>
+      <List>
+        <RenderIf condition={!isSingleNode}>
+          <ListItem>
+            Each worker node requires an additional {workerRequirements?.ramMib || 360} MiB of
+            memory {workerRequirements?.diskSizeGb ? ',' : ' and'}{' '}
+            {workerRequirements?.cpuCores || 2} CPUs
+            {workerRequirements?.diskSizeGb
+              ? ` and ${workerRequirements?.diskSizeGb} storage space`
+              : ''}
+          </ListItem>
+        </RenderIf>
+        <ListItem>
+          Each control plane node requires an additional {masterRequirements?.ramMib || 150} MiB of
+          memory {masterRequirements?.diskSizeGb ? ',' : ' and'} {masterRequirements?.cpuCores || 4}{' '}
+          CPUs
+          {masterRequirements?.diskSizeGb
+            ? ` and ${masterRequirements?.diskSizeGb} storage space`
+            : ''}
+        </ListItem>
+        <ListItem>{odfLvmsText}</ListItem>
+      </List>
+    </>
+  );
+};
+
+export default MceRequirements;
diff --git a/libs/ui-lib/lib/ocm/components/clusterWizard/OperatorsStep.tsx b/libs/ui-lib/lib/ocm/components/clusterWizard/OperatorsStep.tsx
@@ -25,6 +25,7 @@ export const OperatorsStep = (props: ClusterOperatorProps) => {
       </StackItem>
       <StackItem>
         <MceCheckbox
+          clusterId={props.clusterId}
           isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
           openshiftVersion={props.openshiftVersion}
         />