@openshift-assisted/ui-lib 2.39.0 → 2.39.2

package/lib/ocm/components/clusterConfiguration/operators/CnvCheckbox.tsx

@@ -1,103 +0,0 @@
-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 {
-  ClusterOperatorProps,
-  CNV_LINK,
-  getFieldId,
-  OperatorsValues,
-  PopoverIcon,
-} from '../../../../common';
-import CnvHostRequirements from './CnvHostRequirements';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/assisted-installer-service';
-import { useFormikContext } from 'formik';
-import { useNewFeatureSupportLevel } from '../../../../common/components/newFeatureSupportLevels';
-
-const CNV_FIELD_NAME = 'useContainerNativeVirtualization';
-
-type CnvLabelProps = {
-  clusterId: string;
-  disabledReason?: string;
-  isVersionEqualsOrMajorThan4_15: boolean;
-  supportLevel?: SupportLevel;
-};
-
-const CnvLabel = ({
-  clusterId,
-  disabledReason,
-  isVersionEqualsOrMajorThan4_15,
-  supportLevel,
-}: CnvLabelProps) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>OpenShift Virtualization </span>
-      </Tooltip>
-      <PopoverIcon
-        component={'a'}
-        headerContent="Additional requirements"
-        bodyContent={
-          <CnvHostRequirements
-            clusterId={clusterId}
-            isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
-          />
-        }
-      />
-      <NewFeatureSupportLevelBadge featureId="CNV" supportLevel={supportLevel} />
-    </>
-  );
-};
-
-const CnvHelperText = () => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Run virtual machines alongside containers on one platform.{' '}
-        <a href={CNV_LINK} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const CnvCheckbox = ({
-  clusterId,
-  isVersionEqualsOrMajorThan4_15,
-  disabledReason,
-  supportLevel,
-}: {
-  clusterId: ClusterOperatorProps['clusterId'];
-  isVersionEqualsOrMajorThan4_15: boolean;
-  disabledReason?: string;
-  supportLevel?: SupportLevel | undefined;
-}) => {
-  const featureSupportLevelData = useNewFeatureSupportLevel();
-  const { setFieldValue } = useFormikContext<OperatorsValues>();
-  const fieldId = getFieldId(CNV_FIELD_NAME, 'input');
-  const selectOperatorsNeeded = (checked: boolean) => {
-    if (featureSupportLevelData.isFeatureSupported('LSO')) setFieldValue('useLso', checked);
-  };
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={CNV_FIELD_NAME}
-        label={
-          <CnvLabel
-            clusterId={clusterId}
-            disabledReason={disabledReason}
-            isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
-            supportLevel={supportLevel}
-          />
-        }
-        helperText={<CnvHelperText />}
-        isDisabled={!!disabledReason}
-        onChange={selectOperatorsNeeded}
-      />
-    </FormGroup>
-  );
-};
-
-export default CnvCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/CnvHostRequirements.tsx

@@ -1,64 +0,0 @@
-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_CNV, 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 CnvHostRequirements = ({
-  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 cnvRequirements = preflightRequirements?.operators?.find(
-    (operatorRequirements) => operatorRequirements.operatorName === OPERATOR_NAME_CNV,
-  );
-
-  const workerRequirements = cnvRequirements?.requirements?.worker?.quantitative;
-  const masterRequirements = cnvRequirements?.requirements?.master?.quantitative;
-  const odfLvmsText = getOdfLvmsText(isSingleNode, isVersionEqualsOrMajorThan4_15);
-  return (
-    <>
-      <List>
-        <ListItem>
-          Enabled CPU virtualization support in BIOS (Intel-VT / AMD-V) on all nodes
-        </ListItem>
-        <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 CnvHostRequirements;

package/lib/ocm/components/clusterConfiguration/operators/FenceAgentsRemediationCheckbox.tsx

@@ -1,71 +0,0 @@
-import React from 'react';
-import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
-import { getFieldId, FENCE_AGENTS_REMEDIATION_LINK } from '../../../../common';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/./assisted-installer-service';
-
-const FENCE_AGENTS_REMEDIATION_FIELD_NAME = 'useFenceAgentsRemediation';
-const FENCE_AGENTS_REMEDIATION_FEATURE_ID = 'FENCE_AGENTS_REMEDIATION';
-
-const FenceAgentsRemediationLabel = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel;
-}) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>Fence Agents Remediation </span>
-      </Tooltip>
-      <NewFeatureSupportLevelBadge
-        featureId={FENCE_AGENTS_REMEDIATION_FEATURE_ID}
-        supportLevel={supportLevel}
-      />
-    </>
-  );
-};
-
-const FenceAgentsRemediationHelperText = () => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Externally fences failed nodes using power controllers.{' '}
-        <a href={FENCE_AGENTS_REMEDIATION_LINK} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const FenceAgentsRemediationCheckbox = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel | undefined;
-}) => {
-  const fieldId = getFieldId(FENCE_AGENTS_REMEDIATION_FIELD_NAME, 'input');
-
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={FENCE_AGENTS_REMEDIATION_FIELD_NAME}
-        label={
-          <FenceAgentsRemediationLabel
-            disabledReason={disabledReason}
-            supportLevel={supportLevel}
-          />
-        }
-        helperText={<FenceAgentsRemediationHelperText />}
-        isDisabled={!!disabledReason}
-      />
-    </FormGroup>
-  );
-};
-
-export default FenceAgentsRemediationCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/KmmCheckbox.tsx

@@ -1,69 +0,0 @@
-import React, { useState } from 'react';
-import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
-import { getFieldId, KMM_LINK } from '../../../../common';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import { useNewFeatureSupportLevel } from '../../../../common/components/newFeatureSupportLevels';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/./assisted-installer-service';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-
-const KMM_FIELD_NAME = 'useKmm';
-
-const KmmLabel = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel;
-}) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>Kernel Module Management </span>
-      </Tooltip>
-      <NewFeatureSupportLevelBadge featureId="KMM" supportLevel={supportLevel} />
-    </>
-  );
-};
-
-const KmmHelperText = () => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Management of kernel modules.{' '}
-        <a href={KMM_LINK} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const KmmCheckbox = ({ disabledReason }: { disabledReason?: string }) => {
-  const fieldId = getFieldId(KMM_FIELD_NAME, 'input');
-  const featureSupportLevel = useNewFeatureSupportLevel();
-  const [disabledReasonKmm, setDisabledReason] = useState<string | undefined>();
-
-  React.useEffect(() => {
-    const reason = featureSupportLevel.getFeatureDisabledReason('KMM');
-    setDisabledReason(reason);
-  }, [featureSupportLevel]);
-
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={KMM_FIELD_NAME}
-        label={
-          <KmmLabel
-            disabledReason={disabledReason ? disabledReason : disabledReasonKmm}
-            supportLevel={featureSupportLevel.getFeatureSupportLevel('KMM')}
-          />
-        }
-        helperText={<KmmHelperText />}
-        isDisabled={!!disabledReason || !!disabledReasonKmm}
-      />
-    </FormGroup>
-  );
-};
-
-export default KmmCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/KubeDeschedulerCheckbox.tsx

@@ -1,66 +0,0 @@
-import React from 'react';
-import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
-import { getFieldId, NODE_HEALTHCHECK_LINK } from '../../../../common';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/./assisted-installer-service';
-
-const KUBE_DESCHEDULER_FIELD_NAME = 'useKubeDescheduler';
-const KUBE_DESCHEDULER_FEATURE_ID = 'KUBE_DESCHEDULER';
-
-const KubeDeschedulerLabel = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel;
-}) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>Kube Descheduler </span>
-      </Tooltip>
-      <NewFeatureSupportLevelBadge
-        featureId={KUBE_DESCHEDULER_FEATURE_ID}
-        supportLevel={supportLevel}
-      />
-    </>
-  );
-};
-
-const KubeDeschedulerHelperText = () => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Evicts pods to reschedule them onto more suitable nodes.{' '}
-        <a href={NODE_HEALTHCHECK_LINK} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const KubeDeschedulerCheckbox = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel | undefined;
-}) => {
-  const fieldId = getFieldId(KUBE_DESCHEDULER_FIELD_NAME, 'input');
-
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={KUBE_DESCHEDULER_FIELD_NAME}
-        label={<KubeDeschedulerLabel disabledReason={disabledReason} supportLevel={supportLevel} />}
-        helperText={<KubeDeschedulerHelperText />}
-        isDisabled={!!disabledReason}
-      />
-    </FormGroup>
-  );
-};
-
-export default KubeDeschedulerCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/LsoCheckbox.tsx

@@ -1,64 +0,0 @@
-import React from 'react';
-import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
-import { getFieldId, getLsoLink } from '../../../../common';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/./assisted-installer-service';
-import ExternalLinkAltIcon from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
-
-const LSO_FIELD_NAME = 'useLso';
-
-const LsoLabel = ({
-  disabledReason,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel;
-}) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>Local Storage Operator </span>
-      </Tooltip>
-      <NewFeatureSupportLevelBadge featureId="LSO" supportLevel={supportLevel} />
-    </>
-  );
-};
-
-const LsoHelperText = ({ openshiftVersion }: { openshiftVersion?: string }) => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Allows provisioning of persistent storage by using local volumes.{' '}
-        <a href={getLsoLink(openshiftVersion)} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const LsoCheckbox = ({
-  disabledReason,
-  supportLevel,
-  openshiftVersion,
-}: {
-  disabledReason?: string;
-  supportLevel?: SupportLevel | undefined;
-  openshiftVersion?: string;
-}) => {
-  const fieldId = getFieldId(LSO_FIELD_NAME, 'input');
-
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={LSO_FIELD_NAME}
-        label={<LsoLabel disabledReason={disabledReason} supportLevel={supportLevel} />}
-        helperText={<LsoHelperText openshiftVersion={openshiftVersion || '4.17'} />}
-        isDisabled={!!disabledReason}
-      />
-    </FormGroup>
-  );
-};
-
-export default LsoCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/LvmCheckbox.tsx

@@ -1,112 +0,0 @@
-import React from 'react';
-import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
-import {
-  ClusterOperatorProps,
-  getFieldId,
-  PopoverIcon,
-  operatorLabels,
-  OPERATOR_NAME_LVM,
-  ExposedOperatorName,
-  ExternalLink,
-  OPERATOR_NAME_LVMS,
-  getLvmsDocsLink,
-} from '../../../../common';
-import LvmHostRequirements from './LvmHostRequirements';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import { useTranslation } from '../../../../common/hooks/use-translation-wrapper';
-import { useNewFeatureSupportLevel } from '../../../../common/components/newFeatureSupportLevels';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/assisted-installer-service';
-
-const LVM_FIELD_NAME = 'useOdfLogicalVolumeManager';
-
-type LvmLabelProps = ClusterOperatorProps & {
-  disabledReason?: string;
-  operatorLabel: string;
-  supportLevel?: SupportLevel;
-};
-
-const LvmHelperText = ({
-  operatorName,
-  docsVersion,
-}: {
-  operatorName: ExposedOperatorName;
-  docsVersion: string;
-}) => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Storage virtualization that offers a more flexible approach for disk space management.{' '}
-        {operatorName === OPERATOR_NAME_LVMS && (
-          <ExternalLink href={getLvmsDocsLink(docsVersion)}>Learn more</ExternalLink>
-        )}
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const LvmLabel = ({ clusterId, operatorLabel, disabledReason, supportLevel }: LvmLabelProps) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>{operatorLabel} </span>
-      </Tooltip>
-      <PopoverIcon
-        component={'a'}
-        headerContent="Additional requirements"
-        bodyContent={<LvmHostRequirements clusterId={clusterId} />}
-      />
-      <NewFeatureSupportLevelBadge featureId="LVM" supportLevel={supportLevel} />
-    </>
-  );
-};
-
-const LvmCheckbox = ({
-  clusterId,
-  openshiftVersion,
-  disabledReason,
-  supportLevel,
-}: {
-  clusterId: ClusterOperatorProps['clusterId'];
-  openshiftVersion?: ClusterOperatorProps['openshiftVersion'];
-  disabledReason?: string;
-  supportLevel?: SupportLevel | undefined;
-}) => {
-  const fieldId = getFieldId(LVM_FIELD_NAME, 'input');
-
-  const featureSupportLevel = useNewFeatureSupportLevel();
-  const { t } = useTranslation();
-
-  const operatorInfo = React.useMemo(() => {
-    const operatorLabel = operatorLabels(t, featureSupportLevel)[OPERATOR_NAME_LVM];
-    return {
-      operatorLabel,
-      operatorName: supportLevel === 'supported' ? OPERATOR_NAME_LVMS : OPERATOR_NAME_LVM,
-    };
-  }, [featureSupportLevel, supportLevel, t]);
-
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={LVM_FIELD_NAME}
-        label={
-          <LvmLabel
-            clusterId={clusterId}
-            operatorLabel={operatorInfo.operatorLabel}
-            disabledReason={disabledReason}
-            supportLevel={supportLevel}
-          />
-        }
-        helperText={
-          <LvmHelperText
-            operatorName={operatorInfo.operatorName}
-            docsVersion={openshiftVersion || ''}
-          />
-        }
-        isDisabled={!!disabledReason}
-      />
-    </FormGroup>
-  );
-};
-
-export default LvmCheckbox;

package/lib/ocm/components/clusterConfiguration/operators/LvmHostRequirements.tsx

@@ -1,38 +0,0 @@
-import React from 'react';
-import { List, ListItem } from '@patternfly/react-core';
-import { useClusterPreflightRequirements } from '../../../hooks';
-import {
-  ClusterOperatorProps,
-  ErrorState,
-  LoadingState,
-  OPERATOR_NAME_LVM,
-} from '../../../../common';
-import { HostTypeHardwareRequirements } from '@openshift-assisted/types/assisted-installer-service';
-
-const LvmHostRequirements = ({ clusterId }: { clusterId: ClusterOperatorProps['clusterId'] }) => {
-  const { preflightRequirements, error, isLoading } = useClusterPreflightRequirements(clusterId);
-
-  if (isLoading) {
-    return <LoadingState content="Loading hardware requirements ..." />;
-  }
-  if (error) {
-    return <ErrorState />;
-  }
-
-  const lvmRequirements = preflightRequirements?.operators?.find(
-    (operatorRequirements) => operatorRequirements.operatorName === OPERATOR_NAME_LVM,
-  );
-
-  const { qualitative = [] } = lvmRequirements?.requirements
-    ?.master as HostTypeHardwareRequirements;
-
-  return (
-    <List>
-      {qualitative.map((qualitativeItem, index) => (
-        <ListItem key={index}>{qualitativeItem}</ListItem>
-      ))}
-    </List>
-  );
-};
-
-export default LvmHostRequirements;

package/lib/ocm/components/clusterConfiguration/operators/MceCheckbox.tsx

@@ -1,90 +0,0 @@
-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, ClusterOperatorProps } from '../../../../common';
-import { OcmCheckboxField } from '../../ui/OcmFormFields';
-import MceRequirements from './MceRequirements';
-import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
-import { SupportLevel } from '@openshift-assisted/types/./assisted-installer-service';
-
-const MCE_FIELD_NAME = 'useMultiClusterEngine';
-
-const MceLabel = ({
-  disabledReason,
-  isVersionEqualsOrMajorThan4_15,
-  clusterId,
-  supportLevel,
-}: {
-  disabledReason?: string;
-  isVersionEqualsOrMajorThan4_15: boolean;
-  clusterId: ClusterOperatorProps['clusterId'];
-  supportLevel?: SupportLevel;
-}) => {
-  return (
-    <>
-      <Tooltip hidden={!disabledReason} content={disabledReason}>
-        <span>Multicluster engine </span>
-      </Tooltip>
-      <PopoverIcon
-        id={MCE_FIELD_NAME}
-        component={'a'}
-        headerContent="Additional requirements"
-        bodyContent={
-          <MceRequirements
-            clusterId={clusterId}
-            isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
-          />
-        }
-      />
-      <NewFeatureSupportLevelBadge featureId="MCE" supportLevel={supportLevel} />
-    </>
-  );
-};
-
-const MceHelperText = ({ docsVersion }: { docsVersion: string }) => {
-  return (
-    <HelperText>
-      <HelperTextItem variant="indeterminate">
-        Create, import, and manage multiple clusters from this cluster.{' '}
-        <a href={getMceDocsLink(docsVersion)} target="_blank" rel="noopener noreferrer">
-          {'Learn more'} <ExternalLinkAltIcon />
-        </a>
-      </HelperTextItem>
-    </HelperText>
-  );
-};
-
-const MceCheckbox = ({
-  clusterId,
-  isVersionEqualsOrMajorThan4_15,
-  openshiftVersion,
-  supportLevel,
-  disabledReason,
-}: {
-  isVersionEqualsOrMajorThan4_15: boolean;
-  openshiftVersion?: string;
-  clusterId: ClusterOperatorProps['clusterId'];
-  supportLevel?: SupportLevel | undefined;
-  disabledReason?: string;
-}) => {
-  const fieldId = getFieldId(MCE_FIELD_NAME, 'input');
-  return (
-    <FormGroup isInline fieldId={fieldId}>
-      <OcmCheckboxField
-        name={MCE_FIELD_NAME}
-        label={
-          <MceLabel
-            disabledReason={disabledReason}
-            isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
-            clusterId={clusterId}
-            supportLevel={supportLevel}
-          />
-        }
-        isDisabled={!!disabledReason}
-        helperText={<MceHelperText docsVersion={openshiftVersion || ''} />}
-      />
-    </FormGroup>
-  );
-};
-
-export default MceCheckbox;