@openshift-assisted/ui-lib 2.9.5-cim → 2.9.6-cim

package/lib/ocm/components/HostsClusterDetailTab/HostsClusterDetailTab.tsx

@@ -4,17 +4,22 @@ import { AssistedUILibVersion } from '../ui';
 import { AlertsContextProvider, FeatureGateContextProvider } from '../../../common';
 import { HostsClusterDetailTabContent } from './HostsClusterDetailTabContent';
 import { HostsClusterDetailTabProps } from './types';
-import { store } from '../../store';
+import { storeDay1 } from '../../store';
+import { featureFlagsActions } from '../../store/slices/feature-flags/slice';
 
-const HostsClusterDetailTab = (props: HostsClusterDetailTabProps) => (
-  <Provider store={store}>
-    <AssistedUILibVersion />
-    <FeatureGateContextProvider features={props.allEnabledFeatures}>
-      <AlertsContextProvider>
-        <HostsClusterDetailTabContent {...props} />
-      </AlertsContextProvider>
-    </FeatureGateContextProvider>
-  </Provider>
-);
+const HostsClusterDetailTab = (props: HostsClusterDetailTabProps) => {
+  storeDay1.dispatch(featureFlagsActions.setFeatureFlags(props.allEnabledFeatures));
+
+  return (
+    <Provider store={storeDay1}>
+      <AssistedUILibVersion />
+      <FeatureGateContextProvider features={props.allEnabledFeatures}>
+        <AlertsContextProvider>
+          <HostsClusterDetailTabContent {...props} />
+        </AlertsContextProvider>
+      </FeatureGateContextProvider>
+    </Provider>
+  );
+};
 
 export default HostsClusterDetailTab;

package/lib/ocm/components/Routes.tsx

@@ -0,0 +1,34 @@
+import React, { useEffect } from 'react';
+import { Provider } from 'react-redux';
+import { Switch, Route, Redirect } from 'react-router-dom';
+import { Clusters, ClusterPage, NewClusterPage } from './clusters';
+import { FeatureGateContextProvider } from '../../common';
+import type { FeatureListType } from '../../common/features/featureGate';
+import { routeBasePath } from '../config';
+import { AssistedUILibVersion } from './ui';
+import { storeDay1 } from '../store';
+import { featureFlagsActions } from '../store/slices/feature-flags/slice';
+
+export const Routes: React.FC<{ allEnabledFeatures: FeatureListType }> = ({
+  allEnabledFeatures,
+  children,
+}) => {
+  useEffect(() => {
+    storeDay1.dispatch(featureFlagsActions.setFeatureFlags(allEnabledFeatures));
+  }, [allEnabledFeatures]);
+
+  return (
+    <Provider store={storeDay1}>
+      <FeatureGateContextProvider features={allEnabledFeatures}>
+        <AssistedUILibVersion />
+        <Switch>
+          <Route path={`${routeBasePath}/clusters/~new`} component={NewClusterPage} />
+          <Route path={`${routeBasePath}/clusters/:clusterId`} component={ClusterPage} />
+          <Route path={`${routeBasePath}/clusters`} component={Clusters} />
+          {children}
+          <Redirect to={`${routeBasePath}/clusters`} />
+        </Switch>
+      </FeatureGateContextProvider>
+    </Provider>
+  );
+};

package/lib/ocm/components/clusterConfiguration/DiscoveryImageForm.tsx

@@ -4,7 +4,11 @@ import Axios, { CancelTokenSource } from 'axios';
 import { FormikHelpers } from 'formik';
 import { getApiErrorMessage, handleApiError, isUnknownServerError } from '../../api';
 import { CpuArchitecture, ErrorState, LoadingState } from '../../../common';
-import { forceReload, setServerUpdateError, updateCluster } from '../../reducers/clusters';
+import {
+  forceReload,
+  setServerUpdateError,
+  updateCluster,
+} from '../../store/slices/current-cluster/slice';
 import useInfraEnv from '../../hooks/useInfraEnv';
 import { DiscoveryImageFormService } from '../../services';
 import {

package/lib/ocm/components/clusterConfiguration/HostInventory.tsx

@@ -22,7 +22,7 @@ import HostsDiscoveryTable from '../hosts/HostsDiscoveryTable';
 import { DiscoveryImageModalButton } from './DiscoveryImageModal';
 import InformationAndAlerts from './InformationAndAlerts';
 import { OcmSwitchField } from '../ui/OcmFormFields';
-import { selectCurrentClusterPermissionsState } from '../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../store/slices/current-cluster/selectors';
 import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
 
 const schedulableMastersTooltip =

package/lib/ocm/components/clusterConfiguration/OcmBaseDomainField.tsx

@@ -106,6 +106,4 @@ export const OcmBaseDomainField = ({ managedDomains }: { managedDomains: Managed
       </FormGroup>
     </>
   );
-
-  return <></>;
 };

package/lib/ocm/components/clusterConfiguration/OcmClusterDetailsFormFields.tsx

@@ -30,12 +30,11 @@ import OcmSNOControlGroup from './OcmSNOControlGroup';
 import useSupportLevelsAPI from '../../hooks/useSupportLevelsAPI';
 import { useOpenshiftVersions } from '../../hooks';
 import { ExternalPlatformDropdown } from './platformIntegration/ExternalPlatformDropdown';
-import { useOracleDropdownItemState } from '../../hooks/useOracleDropdownItemState';
-import { useClusterWizardContext } from '../clusterWizard/ClusterWizardContext';
 import { HostsNetworkConfigurationType } from '../../services/types';
 import { useNewFeatureSupportLevel } from '../../../common/components/newFeatureSupportLevels';
 import { ExternalPlatformLabels } from './platformIntegration/constants';
 import { ManagedDomain, PlatformType } from '@openshift-assisted/types/assisted-installer-service';
+import { useClusterWizardContext } from '../clusterWizard/ClusterWizardContext';
 
 export type OcmClusterDetailsFormFieldsProps = {
   forceOpenshiftVersion?: string;
@@ -84,11 +83,7 @@ export const OcmClusterDetailsFormFields = ({
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-ignore
   const cpuArchitecture = (architectureData[values.cpuArchitecture] as CpuArchitectureItem).label;
-  const oracleDropdownItemState = useOracleDropdownItemState(
-    clusterExists,
-    featureSupportLevelData,
-    values.cpuArchitecture,
-  );
+
   const featureSupportLevelContext = useNewFeatureSupportLevel();
 
   React.useEffect(() => {
@@ -175,10 +170,11 @@ export const OcmClusterDetailsFormFields = ({
         </StaticTextField>
       ) : (
         <ExternalPlatformDropdown
-          showOciOption={isOracleCloudPlatformIntegrationEnabled}
-          disabledOciTooltipContent={oracleDropdownItemState?.disabledReason}
-          isOciDisabled={oracleDropdownItemState?.isDisabled || false}
           onChange={handleExternalPartnerIntegrationsChange}
+          cpuArchitecture={values.cpuArchitecture}
+          showOciOption={isOracleCloudPlatformIntegrationEnabled}
+          featureSupportLevelData={featureSupportLevelData}
+          isSNO={isSNO({ highAvailabilityMode })}
         />
       )}
 

package/lib/ocm/components/clusterConfiguration/OcmSingleNodeCheckbox.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useField, useFormikContext } from 'formik';
 import { Checkbox, FormGroup, Tooltip } from '@patternfly/react-core';
-import { getFieldId, HelperText, useFeature } from '../../../common';
+import { getFieldId, HelperText } from '../../../common';
 import { useNewFeatureSupportLevel } from '../../../common/components/newFeatureSupportLevels';
 import { CheckboxFieldProps } from '../../../common/components/ui/formik/types';
 import NewFeatureSupportLevelBadge from '../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';
@@ -28,7 +28,6 @@ const OcmSingleNodeCheckbox: React.FC<OcmCheckboxProps> = ({
   const {
     values: { openshiftVersion },
   } = useFormikContext<ClusterCreateParams>();
-  const isSingleNodeOpenshiftEnabled = useFeature('ASSISTED_INSTALLER_SNO_FEATURE');
   const [field, meta, helpers] = useField<'None' | 'Full'>({ name: props.name, validate });
   const featureSupportLevelContext = useNewFeatureSupportLevel();
   const prevVersionRef = React.useRef(openshiftVersion);
@@ -61,7 +60,7 @@ const OcmSingleNodeCheckbox: React.FC<OcmCheckboxProps> = ({
     prevIsDisabled.current = props.isDisabled;
   }, [props.isDisabled, setValue, onChanged]);
 
-  if (isSingleNodeOpenshiftEnabled && isSupportedVersionAvailable) {
+  if (isSupportedVersionAvailable) {
     return (
       <FormGroup id={`form-control__${fieldId}`} isInline fieldId={fieldId}>
         <Tooltip hidden={!disabledReason} content={disabledReason}>

package/lib/ocm/components/clusterConfiguration/manifestsConfiguration/components/CustomManifestsArray.tsx

@@ -6,12 +6,12 @@ import { FieldArrayRenderProps, useField } from 'formik';
 import cloneDeep from 'lodash-es/cloneDeep.js';
 import { LoadingState, useAlerts } from '../../../../../common';
 import ConfirmationModal from '../../../../../common/components/ui/ConfirmationModal';
-import { selectCurrentClusterPermissionsState } from '../../../../selectors';
 import { ClustersAPI } from '../../../../services/apis';
 import { getApiErrorMessage, handleApiError } from '../../../../api';
 import { CustomManifest } from './CustomManifest';
 import { getEmptyFormViewManifest, getManifestName } from './utils';
 import { CustomManifestValues } from '../data/dataTypes';
+import { selectCurrentClusterPermissionsState } from '../../../../store/slices/current-cluster/selectors';
 
 const fieldName = 'manifests';
 

package/lib/ocm/components/clusterConfiguration/manifestsConfiguration/components/CustomManifestsForm.tsx

@@ -13,7 +13,6 @@ import {
 } from 'formik';
 import isEqual from 'lodash-es/isEqual.js';
 import { ErrorState, LoadingState, useAlerts, useFormikAutoSave } from '../../../../../common';
-import { selectCurrentClusterPermissionsState } from '../../../../selectors';
 import { CustomManifestsFormProps } from './propTypes';
 import {
   CustomManifestValues,
@@ -27,6 +26,7 @@ import useClusterCustomManifests from '../../../../hooks/useClusterCustomManifes
 import { ClustersService } from '../../../../services';
 import { CustomManifestsArray } from './CustomManifestsArray';
 import { getManifestFakeId } from './utils';
+import { selectCurrentClusterPermissionsState } from '../../../../store/slices/current-cluster/selectors';
 
 const fieldName = 'manifests';
 

package/lib/ocm/components/clusterConfiguration/networkConfiguration/AvailableSubnetsControl.tsx

@@ -10,7 +10,7 @@ import {
   DUAL_STACK,
   NO_SUBNET_SET,
 } from '../../../../common';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import { SubnetsDropdown } from './SubnetsDropdown';
 import { Cluster, MachineNetwork } from '@openshift-assisted/types/assisted-installer-service';
 

package/lib/ocm/components/clusterConfiguration/networkConfiguration/NetworkConfiguration.tsx

@@ -24,7 +24,7 @@ import { StackTypeControlGroup } from './StackTypeControl';
 import { AvailableSubnetsControl } from './AvailableSubnetsControl';
 import AdvancedNetworkFields from './AdvancedNetworkFields';
 import { useTranslation } from '../../../../common/hooks/use-translation-wrapper';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import { OcmCheckbox } from '../../ui/OcmFormFields';
 import { NetworkTypeControlGroup } from '../../../../common/components/clusterWizard/networkingSteps/NetworkTypeControlGroup';
 import { useClusterSupportedPlatforms } from '../../../hooks';

package/lib/ocm/components/clusterConfiguration/networkConfiguration/NetworkConfigurationForm.tsx

@@ -26,7 +26,7 @@ import { canNextNetwork } from '../../clusterWizard/wizardTransition';
 import ClusterWizardNavigation from '../../clusterWizard/ClusterWizardNavigation';
 import NetworkConfigurationTable from './NetworkConfigurationTable';
 import useInfraEnv from '../../../hooks/useInfraEnv';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import {
   getNetworkConfigurationValidationSchema,
   getNetworkInitialValues,
@@ -34,7 +34,10 @@ import {
 import NetworkConfiguration from './NetworkConfiguration';
 import { captureException } from '../../../sentry';
 import { ClustersService } from '../../../services';
-import { setServerUpdateError, updateClusterBase } from '../../../reducers/clusters';
+import {
+  setServerUpdateError,
+  updateClusterBase,
+} from '../../../store/slices/current-cluster/slice';
 import { isUnknownServerError, getApiErrorMessage, handleApiError } from '../../../api';
 import { useClusterSupportedPlatforms, usePullSecret } from '../../../hooks';
 import {

package/lib/ocm/components/clusterConfiguration/networkConfiguration/StackTypeControl.tsx

@@ -16,7 +16,7 @@ import {
 } from '../../../../common';
 import { ConfirmationModal, PopoverIcon } from '../../../../common/components/ui';
 import { useDefaultConfiguration } from '../ClusterDefaultConfigurationContext';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import { OcmRadioField } from '../../ui/OcmFormFields';
 import {
   Cluster,

package/lib/ocm/components/clusterConfiguration/networkConfiguration/VirtualIPControlGroup.tsx

@@ -21,7 +21,7 @@ import {
   selectApiVip,
   selectIngressVip,
 } from '../../../../common';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import { OcmCheckboxField, OcmInputField } from '../../ui/OcmFormFields';
 import { useTranslation } from '../../../../common/hooks/use-translation-wrapper';
 import NewFeatureSupportLevelBadge from '../../../../common/components/newFeatureSupportLevels/NewFeatureSupportLevelBadge';

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

@@ -3,8 +3,8 @@ 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 { selectIsCurrentClusterSNO } from '../../../selectors';
 import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
+import { selectIsCurrentClusterSNO } from '../../../store/slices/current-cluster/selectors';
 
 const CnvHostRequirements = ({ clusterId }: { clusterId: Cluster['id'] }) => {
   const { preflightRequirements, error, isLoading } = useClusterPreflightRequirements(clusterId);

package/lib/ocm/components/clusterConfiguration/platformIntegration/ExternalPlatformDropdown.tsx

@@ -8,35 +8,72 @@ import {
   FormGroup,
   Split,
   SplitItem,
+  Tooltip,
 } from '@patternfly/react-core';
 import { CaretDownIcon } from '@patternfly/react-icons';
 import { useField } from 'formik';
-import { getFieldId } from '../../../../common';
+import { CpuArchitecture, DeveloperPreview, FeatureId, getFieldId } from '../../../../common';
+
 import {
+  ExternalPlaformIds,
   ExternalPlatformLabels,
   ExternalPlatformLinks,
   ExternalPlatformTooltips,
 } from './constants';
 import { PlatformType } from '@openshift-assisted/types/assisted-installer-service';
+import {
+  NewFeatureSupportLevelData,
+  NewFeatureSupportLevelMap,
+  useNewFeatureSupportLevel,
+} from '../../../../common/components/newFeatureSupportLevels';
 
 const INPUT_NAME = 'platform';
 const fieldId = getFieldId(INPUT_NAME, 'input');
 
 type ExternalPlatformDropdownProps = {
   showOciOption: boolean;
-  disabledOciTooltipContent: React.ReactNode;
-  isOciDisabled: boolean;
   onChange: (selectedPlatform: PlatformType) => void;
+  cpuArchitecture?: string;
+  featureSupportLevelData: NewFeatureSupportLevelMap | null;
+  isSNO: boolean;
 };
 
 export type ExternalPlatformInfo = {
   label: string;
   href?: string;
   tooltip?: string;
+  disabledReason?: string;
+};
+
+const getDisabledReasonForExternalPlatform = (
+  isSNO: boolean,
+  newFeatureSupportLevelContext: NewFeatureSupportLevelData,
+  platform: PlatformType,
+  featureSupportLevelData?: NewFeatureSupportLevelMap | null,
+  cpuArchitecture?: string,
+): string | undefined => {
+  if (!isSNO) {
+    return newFeatureSupportLevelContext.getFeatureDisabledReason(
+      ExternalPlaformIds[platform] as FeatureId,
+      featureSupportLevelData ?? undefined,
+      cpuArchitecture,
+    );
+  } else if (platform === 'nutanix' || platform === 'vsphere') {
+    return `${ExternalPlatformLabels[platform]} integration is not supported for Single-Node OpenShift.`;
+  } else if (
+    cpuArchitecture === CpuArchitecture.ppc64le ||
+    cpuArchitecture === CpuArchitecture.s390x
+  ) {
+    return `Plaform integration is not supported for Single-Node OpenShift with the selected CPU architecture.`;
+  }
 };
 
 const getExternalPlatformTypes = (
   showOciOption: boolean,
+  isSNO: boolean,
+  newFeatureSupportLevelContext: NewFeatureSupportLevelData,
+  featureSupportLevelData?: NewFeatureSupportLevelMap | null,
+  cpuArchitecture?: string,
 ): Partial<{ [key in PlatformType]: ExternalPlatformInfo }> => {
   const platforms = ['none', 'nutanix', showOciOption && 'oci', 'vsphere'] as PlatformType[];
 
@@ -47,43 +84,102 @@ const getExternalPlatformTypes = (
         label: ExternalPlatformLabels[platform],
         href: ExternalPlatformLinks[platform],
         tooltip: ExternalPlatformTooltips[platform],
+        disabledReason: getDisabledReasonForExternalPlatform(
+          isSNO,
+          newFeatureSupportLevelContext,
+          platform,
+          featureSupportLevelData ?? undefined,
+          cpuArchitecture,
+        ),
       },
     }),
     {},
   );
 };
 
+export const areAllExternalPlatformIntegrationDisabled = (
+  externalPlatformTypes: Partial<{ [key in PlatformType]: ExternalPlatformInfo }>,
+): boolean => {
+  return Object.values(externalPlatformTypes)
+    .filter((info) => info.label !== 'No platform integration')
+    .every((info) => info.disabledReason !== undefined);
+};
+
 export const ExternalPlatformDropdown = ({
   showOciOption,
-  disabledOciTooltipContent,
-  isOciDisabled,
   onChange,
+  cpuArchitecture,
+  featureSupportLevelData,
+  isSNO,
 }: ExternalPlatformDropdownProps) => {
-  const [field, { value, initialValue }, { setValue }] = useField<string>(INPUT_NAME);
+  const [field, , { setValue }] = useField<string>(INPUT_NAME);
   const [isOpen, setOpen] = React.useState(false);
+  const [externalPlatformTypes, setExternalPlatformTypes] = React.useState<
+    Partial<{ [key in PlatformType]: ExternalPlatformInfo }>
+  >({});
+
+  const tooltipDropdownDisabled = `Platform integration is not supported when ${
+    cpuArchitecture || ''
+  } is selected`;
+
   const handleClick = (event: MouseEvent<HTMLButtonElement>, href: string) => {
     event.stopPropagation(); // Stop event propagation here
     window.open(href, '_blank');
   };
+  const newFeatureSupportLevelContext = useNewFeatureSupportLevel();
+  React.useEffect(() => {
+    // Calculate updated externalPlatformTypes based on the dependencies
+    const updatedExternalPlatformTypes = getExternalPlatformTypes(
+      showOciOption,
+      isSNO,
+      newFeatureSupportLevelContext,
+      featureSupportLevelData,
+      cpuArchitecture,
+    );
 
-  const externalPlatformTypes = getExternalPlatformTypes(showOciOption);
+    // Update the state with the new externalPlatformTypes
+    setExternalPlatformTypes(updatedExternalPlatformTypes);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [featureSupportLevelData, cpuArchitecture, isSNO]);
+
+  const dropdownIsDisabled = React.useMemo(() => {
+    return areAllExternalPlatformIntegrationDisabled(externalPlatformTypes);
+  }, [externalPlatformTypes]);
+
+  React.useEffect(() => {
+    let isCurrentValueDisabled = false;
+
+    if (field.value !== 'none') {
+      isCurrentValueDisabled =
+        externalPlatformTypes[field.value as PlatformType]?.disabledReason !== undefined;
+    }
+    if (dropdownIsDisabled || isCurrentValueDisabled) {
+      setValue('none');
+      onChange('none');
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [dropdownIsDisabled, externalPlatformTypes]);
 
   const enabledItems = Object.keys(externalPlatformTypes).map((platform) => {
-    const isOracleDisabled = platform === 'oci' && isOciDisabled;
-    const { label, href, tooltip } = externalPlatformTypes[
+    const { label, href, tooltip, disabledReason } = externalPlatformTypes[
       platform as PlatformType
     ] as ExternalPlatformInfo;
-
     return (
-      <DropdownItem
-        key={platform}
-        id={platform}
-        tooltip={isOracleDisabled ? disabledOciTooltipContent : tooltip}
-        isAriaDisabled={isOracleDisabled}
-        tooltipProps={{ position: 'top-start' }}
-      >
+      <DropdownItem key={platform} id={platform} isAriaDisabled={disabledReason !== undefined}>
         <Split>
-          <SplitItem>{label}</SplitItem>
+          <SplitItem>
+            <Tooltip
+              hidden={disabledReason === undefined && tooltip === undefined}
+              content={disabledReason !== undefined ? disabledReason : tooltip}
+              position="top"
+            >
+              <div>
+                {label}
+                {platform === 'oci' && <DeveloperPreview testId={'oci-support-level`'} />}
+              </div>
+            </Tooltip>
+          </SplitItem>
           {!!href && (
             <>
               <SplitItem isFilled />
@@ -114,12 +210,6 @@ export const ExternalPlatformDropdown = ({
     [setOpen, setValue, onChange],
   );
 
-  React.useEffect(() => {
-    if (value === 'oci' && isOciDisabled) {
-      setValue('none');
-    }
-  }, [initialValue, isOciDisabled, setValue, value]);
-
   const toggle = React.useMemo(
     () => (
       <DropdownToggle
@@ -127,11 +217,12 @@ export const ExternalPlatformDropdown = ({
         toggleIndicator={CaretDownIcon}
         isText
         className="pf-u-w-100"
+        isDisabled={dropdownIsDisabled}
       >
-        {externalPlatformTypes[value as PlatformType]?.label}
+        {externalPlatformTypes[field.value as PlatformType]?.label}
       </DropdownToggle>
     ),
-    [externalPlatformTypes, value],
+    [externalPlatformTypes, field, dropdownIsDisabled],
   );
 
   return (
@@ -140,15 +231,23 @@ export const ExternalPlatformDropdown = ({
       fieldId={fieldId}
       label={'Integrate with external partner platforms'}
     >
-      <Dropdown
-        {...field}
-        id={fieldId}
-        dropdownItems={enabledItems}
-        toggle={toggle}
-        isOpen={isOpen}
-        className="pf-u-w-100"
-        onSelect={onSelect}
-      />
+      <Tooltip
+        content={tooltipDropdownDisabled}
+        hidden={!dropdownIsDisabled}
+        position="top"
+        distance={7}
+      >
+        <Dropdown
+          {...field}
+          id={fieldId}
+          dropdownItems={enabledItems}
+          toggle={toggle}
+          isOpen={isOpen}
+          className="pf-u-w-100"
+          onSelect={onSelect}
+          disabled={dropdownIsDisabled}
+        />
+      </Tooltip>
     </FormGroup>
   );
 };

package/lib/ocm/components/clusterConfiguration/platformIntegration/PlatformIntegrationNote.tsx

@@ -10,14 +10,16 @@ const PlatformIntegrationNote = ({ platformType }: { platformType: SupportedPlat
     <p>
       <ExclamationTriangleIcon color={warningColor.value} size="sm" /> You will need to modify your
       platform configuration after cluster installation is completed.{' '}
-      <a
-        href={integrationPlatformLink || ''}
-        target="_blank"
-        rel="noopener noreferrer"
-        data-ouia-component-id="vm-integration-kb-page"
-      >
-        Learn more <i className="fas fa-external-link-alt" />
-      </a>
+      {!!integrationPlatformLink && (
+        <a
+          href={integrationPlatformLink || ''}
+          target="_blank"
+          rel="noopener noreferrer"
+          data-ouia-component-id="vm-integration-kb-page"
+        >
+          Learn more <i className="fas fa-external-link-alt" />
+        </a>
+      )}
     </p>
   );
 };

package/lib/ocm/components/clusterConfiguration/platformIntegration/constants.tsx

@@ -17,3 +17,11 @@ export const ExternalPlatformLinks: Partial<{ [key in PlatformType]: string }> =
 export const ExternalPlatformTooltips: Partial<{ [key in PlatformType]: string }> = {
   oci: "To integrate with an external partner (for example, Oracle Cloud), you'll need to provide a custom manifest.",
 };
+
+export const ExternalPlaformIds: { [key in PlatformType]: string } = {
+  baremetal: '',
+  none: '',
+  nutanix: 'NUTANIX_INTEGRATION',
+  oci: 'EXTERNAL_PLATFORM_OCI',
+  vsphere: 'VSPHERE_INTEGRATION',
+};

package/lib/ocm/components/clusterConfiguration/review/ReviewStep.tsx

@@ -4,12 +4,12 @@ import { ActionListItem, Button, ButtonVariant, Grid, GridItem } from '@patternf
 import { ClusterWizardStepHeader, useAlerts, ClusterWizardStep } from '../../../../common';
 import { useClusterWizardContext } from '../../clusterWizard/ClusterWizardContext';
 import { getApiErrorMessage, handleApiError } from '../../../api';
-import { updateCluster } from '../../../reducers/clusters';
+import { updateCluster } from '../../../store/slices/current-cluster/slice';
 import ClusterWizardFooter from '../../clusterWizard/ClusterWizardFooter';
 import ClusterWizardNavigation from '../../clusterWizard/ClusterWizardNavigation';
 import { ClustersService } from '../../../services';
 import { useStateSafely } from '../../../../common/hooks';
-import { selectCurrentClusterPermissionsState } from '../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../store/slices/current-cluster/selectors';
 import ReviewPreflightChecks from './ReviewPreflightChecks';
 import ReviewSummary from './ReviewSummary';
 import './ReviewCluster.css';

package/lib/ocm/components/clusterConfiguration/staticIp/components/StaticIpForm.tsx

@@ -7,7 +7,7 @@ import { useAlerts, useFormikAutoSave } from '../../../../../common';
 import { useErrorMonitor } from '../../../../../common/components/ErrorHandling/ErrorMonitorContext';
 import { getApiErrorMessage } from '../../../../api';
 import { StaticIpFormProps } from './propTypes';
-import { selectCurrentClusterPermissionsState } from '../../../../selectors';
+import { selectCurrentClusterPermissionsState } from '../../../../store/slices/current-cluster/selectors';
 
 const AutosaveWithParentUpdate = <StaticIpFormValues extends object>({
   onFormStateChange,

package/lib/ocm/components/clusterConfiguration/staticIp/components/StaticIpHostsArray.tsx

@@ -16,11 +16,11 @@ import { FieldArray, FieldArrayRenderProps, useField } from 'formik';
 import cloneDeep from 'lodash-es/cloneDeep.js';
 import { getFormikArrayItemFieldName, LoadingState } from '../../../../../common';
 import ConfirmationModal from '../../../../../common/components/ui/ConfirmationModal';
+import { HostStaticNetworkConfig } from '@openshift-assisted/types/assisted-installer-service';
 import {
-  selectIsCurrentClusterSNO,
   selectCurrentClusterPermissionsState,
-} from '../../../../selectors';
-import { HostStaticNetworkConfig } from '@openshift-assisted/types/assisted-installer-service';
+  selectIsCurrentClusterSNO,
+} from '../../../../store/slices/current-cluster/selectors';
 
 const fieldName = 'hosts';
 

package/lib/ocm/components/clusterConfiguration/staticIp/components/YamlView/MacIpMapping.tsx

@@ -5,8 +5,8 @@ import { PlusCircleIcon } from '@patternfly/react-icons';
 import { getFormikArrayItemFieldName, RemovableField } from '../../../../../../common';
 import { OcmInputField } from '../../../../ui/OcmFormFields';
 import { useSelector } from 'react-redux';
-import { selectCurrentClusterPermissionsState } from '../../../../../selectors';
 import { MacInterfaceMap } from '@openshift-assisted/types/assisted-installer-service';
+import { selectCurrentClusterPermissionsState } from '../../../../../store/slices/current-cluster/selectors';
 
 const AddMapping: React.FC<{
   onPush: ArrayHelpers['push'];