@openshift-assisted/ui-lib 2.9.14-cim → 2.10.0-cim

package/lib/common/components/ui/EventsList.tsx

@@ -1,12 +1,10 @@
 import React from 'react';
 import { Button, ButtonVariant, Label } from '@patternfly/react-core';
 import { TableVariant, Table, TableBody, breakWord } from '@patternfly/react-table';
-import {
-  InfoCircleIcon,
-  ExclamationTriangleIcon,
-  ExclamationCircleIcon,
-  SearchIcon,
-} from '@patternfly/react-icons';
+import { InfoCircleIcon } from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
+import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
+import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
+import { SearchIcon } from '@patternfly/react-icons/dist/js/icons/search-icon';
 import { ExtraParamsType } from '@patternfly/react-table/dist/js/components/Table/base';
 import { Event, EventList } from '@openshift-assisted/types/assisted-installer-service';
 import { EmptyState } from './uiState';

package/lib/common/components/ui/ExternalLink.tsx

@@ -1,6 +1,6 @@
 import React, { ReactNode, MouseEvent } from 'react';
 import { Text } from '@patternfly/react-core';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
 
 interface ExternalLinkProps {
   href?: string;

package/lib/common/components/ui/NoPermissionsError.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { EmptyState, EmptyStateBody, EmptyStateIcon, Title } from '@patternfly/react-core';
-import { ExclamationTriangleIcon } from '@patternfly/react-icons';
-import { global_disabled_color_100 as iconColor } from '@patternfly/react-tokens';
+import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
+import { global_disabled_color_100 as iconColor } from '@patternfly/react-tokens/dist/js/global_disabled_color_100';
 
 const NoPermissionsError = () => (
   <EmptyState id="not-found">

package/lib/common/components/ui/OpenShiftVersionDropdown.tsx

@@ -7,7 +7,7 @@ import {
   FormGroup,
   DropdownSeparator,
 } from '@patternfly/react-core';
-import { CaretDownIcon } from '@patternfly/react-icons';
+import { CaretDownIcon } from '@patternfly/react-icons/dist/js/icons/caret-down-icon';
 
 import { OpenshiftVersionOptionType } from '../../types';
 import { TFunction } from 'i18next';

package/lib/common/components/ui/PopoverIcon.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import classNames from 'classnames';
 import { Button, ButtonProps, Popover } from '@patternfly/react-core';
-import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons';
+import { OutlinedQuestionCircleIcon } from '@patternfly/react-icons/dist/js/icons/outlined-question-circle-icon';
 import { PopoverProps } from '@patternfly/react-core/dist/js/components/Popover/Popover';
 import { SVGIconProps } from '@patternfly/react-icons/dist/js/createIcon';
 

package/lib/common/components/ui/PreviewBadge.tsx

@@ -1,31 +1,25 @@
 import React from 'react';
 import { Label, Popover } from '@patternfly/react-core';
-import { InfoCircleIcon } from '@patternfly/react-icons';
-import { TECH_SUPPORT_LEVEL_LINK } from '../../config/constants';
+import { InfoCircleIcon } from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import ExternalLink from './ExternalLink';
 import { WithTestID } from '../../types';
 import { useTranslation } from '../../hooks/use-translation-wrapper';
 
-export type DeveloperPreviewProps = {
-  position?: PreviewBadgePosition;
-  className?: string;
-} & WithTestID;
-
-export type TechnologyPreviewProps = DeveloperPreviewProps;
-
 export enum PreviewBadgePosition {
   default,
   inline,
   inlineRight,
 }
 
-type PreviewBadgeProps = DeveloperPreviewProps & {
+export type PreviewBadgeProps = {
+  position?: PreviewBadgePosition;
+  className?: string;
   text: string;
   externalLink?: string;
   popoverText: string;
-};
+} & WithTestID;
 
-const PreviewBadge: React.FC<PreviewBadgeProps> = ({
+export const PreviewBadge: React.FC<PreviewBadgeProps> = ({
   position = PreviewBadgePosition.inline,
   className = 'pf-u-ml-md',
   text,
@@ -55,7 +49,7 @@ const PreviewBadge: React.FC<PreviewBadgeProps> = ({
   );
   return (
     <span onClick={(e) => e.preventDefault()}>
-      <Popover bodyContent={bodyContent} position="top">
+      <Popover bodyContent={bodyContent} position="top" withFocusTrap={false}>
         <Label
           style={{ cursor: 'pointer' }}
           color="orange"
@@ -69,32 +63,4 @@ const PreviewBadge: React.FC<PreviewBadgeProps> = ({
     </span>
   );
 };
-
-export const DeveloperPreview: React.FC<DeveloperPreviewProps> = (props) => {
-  const { t } = useTranslation();
-  return (
-    <PreviewBadge
-      text={t('ai:Developer Preview')}
-      popoverText={t(
-        'ai:Developer preview features are not intended to be used in production environments. The clusters deployed with the developer preview features are considered to be development clusters and are not supported through the Red Hat Customer Portal case management system.',
-      )}
-      {...props}
-    />
-  );
-};
-DeveloperPreview.displayName = 'DeveloperPreview';
-
-export const TechnologyPreview: React.FC<TechnologyPreviewProps> = (props) => {
-  const { t } = useTranslation();
-  return (
-    <PreviewBadge
-      text={t('ai:Technology Preview')}
-      popoverText={t(
-        'ai:Technology preview features provide early access to upcoming product innovations, enabling you to test functionality and provide feedback during the development process.',
-      )}
-      externalLink={TECH_SUPPORT_LEVEL_LINK}
-      {...props}
-    />
-  );
-};
-TechnologyPreview.displayName = 'TechnologyPreview';
+PreviewBadge.displayName = 'PreviewBadge';

package/lib/common/components/ui/PrismCode.tsx

@@ -1,11 +1,9 @@
 import React from 'react';
 import Highlight, { defaultProps, Language, PrismTheme } from 'prism-react-renderer';
 import { Text, TextVariants, ClipboardCopy, clipboardCopyFunc } from '@patternfly/react-core';
-import {
-  global_Color_100,
-  global_palette_purple_400,
-  global_palette_blue_300,
-} from '@patternfly/react-tokens';
+import { global_Color_100 } from '@patternfly/react-tokens/dist/js/global_Color_100';
+import { global_palette_purple_400 } from '@patternfly/react-tokens/dist/js/global_palette_purple_400';
+import { global_palette_blue_300 } from '@patternfly/react-tokens/dist/js/global_palette_blue_300';
 import defaultTheme from 'prism-react-renderer/themes/github';
 import './PrismCode.css';
 export const SimpleAIPrismTheme = {

package/lib/common/components/ui/SimpleDropdown.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { DropdownItem, DropdownToggle, Dropdown, DropdownProps } from '@patternfly/react-core';
-import { CaretDownIcon } from '@patternfly/react-icons';
+import { CaretDownIcon } from '@patternfly/react-icons/dist/js/icons/caret-down-icon';
 import { HostRole } from '../../../common/types/hosts';
 import './SimpleDropdown.css';
 

package/lib/common/components/ui/TechnologyPreview.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { TECH_SUPPORT_LEVEL_LINK } from '../../config/constants';
+import { useTranslation } from '../../hooks/use-translation-wrapper';
+import { PreviewBadge, PreviewBadgeProps } from './PreviewBadge';
+
+export type TechnologyPreviewProps = Omit<
+  PreviewBadgeProps,
+  'text' | 'popoverText' | 'externalLink'
+>;
+
+export const TechnologyPreview: React.FC<TechnologyPreviewProps> = (props) => {
+  const { t } = useTranslation();
+
+  return (
+    <PreviewBadge
+      text={t('ai:Technology Preview')}
+      popoverText={t(
+        'ai:Technology preview features provide early access to upcoming product innovations, enabling you to test functionality and provide feedback during the development process.',
+      )}
+      externalLink={TECH_SUPPORT_LEVEL_LINK}
+      {...props}
+    />
+  );
+};
+TechnologyPreview.displayName = 'TechnologyPreview';

package/lib/common/components/ui/ViewClusterEventsButton.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { ButtonVariant } from '@patternfly/react-core';
 import { EventsModalButton } from './eventsModal';
-import { MonitoringIcon } from '@patternfly/react-icons';
+import { MonitoringIcon } from '@patternfly/react-icons/dist/js/icons/monitoring-icon';
 import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
 import { EventListFetchProps } from '../../types';
 import { useTranslation } from '../../hooks/use-translation-wrapper';

package/lib/common/components/ui/WizardNavItem.tsx

@@ -1,7 +1,7 @@
 import React, { PropsWithChildren, ReactNode } from 'react';
 import { WizardNavItem, WizardNavItemProps } from '@patternfly/react-core';
-import { ExclamationCircleIcon } from '@patternfly/react-icons';
-import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens';
+import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
+import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens/dist/js/global_danger_color_100';
 
 const getNavItemContent = (
   content: ReactNode,

package/lib/common/components/ui/eventsModal.tsx

@@ -8,8 +8,8 @@ import {
   Spinner,
   Title,
 } from '@patternfly/react-core';
-import { ExclamationTriangleIcon } from '@patternfly/react-icons';
-import { global_warning_color_100 as globalWarningColor100 } from '@patternfly/react-tokens';
+import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
+import { global_warning_color_100 as globalWarningColor100 } from '@patternfly/react-tokens/dist/js/global_warning_color_100';
 import { ToolbarButton } from './Toolbar';
 import { Cluster, Event } from '@openshift-assisted/types/assisted-installer-service';
 import { EventListFetchProps, EventsEntityKind } from '../../types';

package/lib/common/components/ui/formik/AddButton.tsx

@@ -1,5 +1,5 @@
 import { Button, ButtonProps, ButtonVariant } from '@patternfly/react-core';
-import { PlusCircleIcon } from '@patternfly/react-icons';
+import { PlusCircleIcon } from '@patternfly/react-icons/dist/js/icons/plus-circle-icon';
 import React from 'react';
 
 interface AddButtonProps {

package/lib/common/components/ui/formik/AdditionalNTPSourcesField.tsx

@@ -20,7 +20,7 @@ const AdditionalNTPSourcesField: React.FC<AdditionalNTPSourcesFieldProps> = ({
 }) => {
   const [field, , { setValue, setTouched }] = useField<string>(name);
   const formatAdditionalNtpSources = () => {
-    if (field.value) {
+    if (field.value && field.value !== '') {
       setValue(trimCommaSeparatedList(field.value));
       setTouched(true);
     }

package/lib/common/components/ui/formik/PencilEditField.tsx

@@ -1,6 +1,6 @@
 import { useField } from 'formik';
 import * as React from 'react';
-import { PencilAltIcon } from '@patternfly/react-icons';
+import { PencilAltIcon } from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
 import InputField from './InputField';
 import { Split, SplitItem } from '@patternfly/react-core';
 

package/lib/common/components/ui/formik/PullSecretField.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
 import { CLUSTER_MANAGER_SITE_LINK, PULL_SECRET_INFO_LINK } from '../../../config';
 import PopoverIcon from '../PopoverIcon';
 import TextAreaField from './TextAreaField';

package/lib/common/components/ui/formik/RemovableField.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Button, ButtonVariant, Tooltip, TooltipProps } from '@patternfly/react-core';
-import { MinusCircleIcon } from '@patternfly/react-icons';
+import { MinusCircleIcon } from '@patternfly/react-icons/dist/js/icons/minus-circle-icon';
 import './RemovableField.css';
 import classnames from 'classnames';
 

package/lib/common/components/ui/formik/RichInputField.tsx

@@ -12,13 +12,11 @@ import {
   InputGroup,
   Button,
 } from '@patternfly/react-core';
-import {
-  CheckCircleIcon,
-  CheckIcon,
-  ExclamationCircleIcon,
-  InfoCircleIcon,
-  TimesIcon,
-} from '@patternfly/react-icons';
+import { CheckCircleIcon } from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
+import { CheckIcon } from '@patternfly/react-icons/dist/js/icons/check-icon';
+import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
+import { InfoCircleIcon } from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
+import { TimesIcon } from '@patternfly/react-icons/dist/js/icons/times-icon';
 import { global_palette_green_500 as okColor } from '@patternfly/react-tokens/dist/js/global_palette_green_500';
 import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens/dist/js/global_danger_color_100';
 import { global_palette_blue_300 as blueInfoColor } from '@patternfly/react-tokens/dist/js/global_palette_blue_300';

package/lib/common/components/ui/formik/validationSchemas.ts

@@ -122,11 +122,14 @@ export const sshPublicKeyListValidationSchema = Yup.string()
       if (!value) {
         return true;
       }
-      return (
-        trimSshPublicKey(value)
-          .split('\n')
-          .find((line: string) => !line.match(SSH_PUBLIC_KEY_REGEX)) === undefined
-      );
+      return !!trimSshPublicKey(value).match(SSH_PUBLIC_KEY_REGEX);
+
+      // disable until mutliple keys are supported (https://issues.redhat.com/browse/METAL-250)
+      // return (
+      //   trimSshPublicKey(value)
+      //     .split('\n')
+      //     .find((line: string) => !line.match(SSH_PUBLIC_KEY_REGEX)) === undefined
+      // );
     },
   )
   .test('ssh-public-keys-unique', 'SSH public keys must be unique.', (value: string) => {
@@ -608,7 +611,7 @@ export const ntpSourceValidationSchema = Yup.string()
     'ntp-source-validation',
     'Provide a comma separated list of valid DNS names or IP addresses.',
     (value: string) => {
-      if (!value) {
+      if (!value || value === '') {
         return true;
       }
       return trimCommaSeparatedList(value)
@@ -620,6 +623,9 @@ export const ntpSourceValidationSchema = Yup.string()
     'ntp-source-validation-unique',
     'DNS names and IP addresses must be unique.',
     (value: string) => {
+      if (!value || value === '') {
+        return true;
+      }
       const arr = trimCommaSeparatedList(value).split(',');
       return arr.length === new Set(arr).size;
     },

package/lib/common/components/ui/index.ts

@@ -9,6 +9,8 @@ export * from './SimpleDropdown';
 export * from './DetailList';
 export * from './eventsModal';
 export * from './PreviewBadge';
+export * from './TechnologyPreview';
+export * from './DeveloperPreview';
 
 export * from './utils';
 

package/lib/common/components/ui/uiState/EmptyState.tsx

@@ -8,7 +8,7 @@ import {
   EmptyStateSecondaryActions,
   EmptyStateIconProps,
 } from '@patternfly/react-core';
-import { SearchIcon } from '@patternfly/react-icons';
+import { SearchIcon } from '@patternfly/react-icons/dist/js/icons/search-icon';
 
 type Props = {
   title?: string;

package/lib/common/components/ui/uiState/ErrorState.tsx

@@ -11,8 +11,8 @@ import {
   EmptyStateSecondaryActions,
   EmptyStateIconProps,
 } from '@patternfly/react-core';
-import { ExclamationCircleIcon } from '@patternfly/react-icons';
-import { global_danger_color_200 as globalDangerColor200 } from '@patternfly/react-tokens';
+import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
+import { global_danger_color_200 as globalDangerColor200 } from '@patternfly/react-tokens/dist/js/global_danger_color_200';
 import { useTranslation } from '../../../hooks/use-translation-wrapper';
 
 type ErrorStateProps = {

package/lib/common/config/constants.ts

@@ -387,4 +387,4 @@ export const HOW_TO_KNOW_IF_CLUSTER_SUPPORTS_MULTIPLE_CPU_ARCHS =
   'https://access.redhat.com/documentation/en-us/assisted_installer_for_openshift_container_platform/2022/html-single/assisted_installer_for_openshift_container_platform/index#checking-for-multiple-architectures_expanding-the-cluster';
 
 export const MCE_LINK =
-  'https://docs.openshift.com/container-platform/4.13/architecture/mce-overview-ocp.html';
+  'https://docs.openshift.com/container-platform/4.14/architecture/mce-overview-ocp.html';

package/lib/common/types/clusters.ts

@@ -37,9 +37,7 @@ export type NetworkConfigurationValues = Pick<
   | 'clusterNetworkHostPrefix'
   | 'serviceNetworkCidr'
   | 'apiVips'
-  | 'apiVip'
   | 'ingressVips'
-  | 'ingressVip'
   | 'sshPublicKey'
   | 'vipDhcpAllocation'
   | 'networkType'
@@ -50,6 +48,8 @@ export type NetworkConfigurationValues = Pick<
   hostSubnet?: string;
   managedNetworkingType: 'userManaged' | 'clusterManaged';
   stackType?: 'singleStack' | 'dualStack';
+  apiVip?: string;
+  ingressVip?: string;
 };
 export type HostDiscoveryValues = V2ClusterUpdateParams & {
   usePlatformIntegration: boolean;
@@ -65,9 +65,13 @@ export type OperatorsValues = V2ClusterUpdateParams & {
   useMultiClusterEngine: boolean;
 };
 
-export type SupportedPlatformType = Extract<PlatformType, 'vsphere' | 'nutanix' | 'oci'>;
+export type SupportedPlatformType = Extract<PlatformType, 'vsphere' | 'nutanix' | 'external'>;
 
-export const SupportedPlatformIntegrations: SupportedPlatformType[] = ['vsphere', 'nutanix', 'oci'];
+export const SupportedPlatformIntegrations: SupportedPlatformType[] = [
+  'vsphere',
+  'nutanix',
+  'external',
+];
 export const NonPlatformIntegrations: PlatformType[] = ['baremetal', 'none'];
 
 export type DiscoveryImageType = ImageType | 'discovery-image-ipxe';

package/lib/common/utils.ts

@@ -87,3 +87,21 @@ export const stringToJSON = <T>(jsonString: string | undefined): T | undefined =
 
   return jsObject;
 };
+
+export const downloadFile = (fileUrl?: string, dataBlob?: Blob, fileName?: string) => {
+  const link = document.createElement('a');
+  if (fileUrl && fileUrl !== '') {
+    link.setAttribute('href', fileUrl);
+  }
+  if (dataBlob) {
+    const file = new Blob([dataBlob], { type: 'octet/stream' });
+    link.setAttribute('href', URL.createObjectURL(file));
+  }
+  if (fileName) {
+    link.setAttribute('download', fileName);
+  }
+  link.style.visibility = 'hidden';
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+};

package/lib/ocm/components/AddHosts/AddHosts.tsx

@@ -12,7 +12,7 @@ import {
   Toolbar,
   ToolbarContent,
 } from '@patternfly/react-core';
-import { getApiErrorMessage, handleApiError } from '../../api';
+import { getApiErrorMessage, handleApiError } from '../../../common/api';
 import { DiscoveryImageModal } from '../clusterConfiguration/DiscoveryImageModal';
 import { ModalDialogsContextProvider } from '../hosts/ModalDialogsContext';
 import {

package/lib/ocm/components/AddHosts/day2Wizard/Day2ClusterDetails.tsx

@@ -15,7 +15,7 @@ import {
 } from '../../../../common';
 import { HostsNetworkConfigurationType, InfraEnvsService } from '../../../services';
 import { useModalDialogsContext } from '../../hosts/ModalDialogsContext';
-import { handleApiError } from '../../../api';
+import { handleApiError } from '../../../../common/api';
 import { Day2ClusterDetailValues } from '../types';
 import { useDay2WizardContext } from './Day2WizardContext';
 import Day2WizardNav from './Day2WizardNav';
@@ -29,6 +29,7 @@ import {
   InfraEnv,
   InfraEnvCreateParams,
 } from '@openshift-assisted/types/assisted-installer-service';
+import { isOciPlatformType } from '../../utils';
 
 const getDay2ClusterDetailInitialValues = async (
   clusterId: Cluster['id'],
@@ -241,9 +242,7 @@ const Day2ClusterDetails = () => {
                   </GridItem>
                 )}
                 <GridItem>
-                  <Day2HostStaticIpConfigurations
-                    isDisabled={day2Cluster.platform?.type === 'oci'}
-                  />
+                  <Day2HostStaticIpConfigurations isDisabled={isOciPlatformType(day2Cluster)} />
                 </GridItem>
               </Grid>
             </Form>

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

@@ -1,23 +1,21 @@
 import React from 'react';
 import { Provider } from 'react-redux';
 import { AssistedUILibVersion } from '../ui';
-import { AlertsContextProvider, FeatureGateContextProvider } from '../../../common';
+import { AlertsContextProvider } from '../../../common';
 import { HostsClusterDetailTabContent } from './HostsClusterDetailTabContent';
 import { HostsClusterDetailTabProps } from './types';
 import { storeDay1 } from '../../store';
 import { useFeatureDetection } from '../../hooks/use-feature-detection';
 
 const HostsClusterDetailTab = (props: HostsClusterDetailTabProps) => {
-  useFeatureDetection();
+  useFeatureDetection(props.allEnabledFeatures);
 
   return (
     <Provider store={storeDay1}>
       <AssistedUILibVersion />
-      <FeatureGateContextProvider features={props.allEnabledFeatures}>
-        <AlertsContextProvider>
-          <HostsClusterDetailTabContent {...props} />
-        </AlertsContextProvider>
-      </FeatureGateContextProvider>
+      <AlertsContextProvider>
+        <HostsClusterDetailTabContent {...props} />
+      </AlertsContextProvider>
     </Provider>
   );
 };

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

@@ -10,7 +10,7 @@ import {
 import { usePullSecret } from '../../hooks';
 import { Button, EmptyStateVariant } from '@patternfly/react-core';
 import Day2ClusterService, { getApiVipDnsName } from '../../services/Day2ClusterService';
-import { handleApiError } from '../../api';
+import { handleApiError } from '../../../common/api';
 import { isApiError } from '../../../common/api/utils';
 import { AddHosts } from '../AddHosts';
 import { HostsClusterDetailTabProps } from './types';

package/lib/ocm/components/Routes.tsx

@@ -2,7 +2,6 @@ import React 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';
@@ -17,16 +16,14 @@ export const Routes: React.FC<{ allEnabledFeatures: FeatureListType }> = ({
 
   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>
+      <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>
     </Provider>
   );
 };

package/lib/ocm/components/SentryErrorMonitorContextProvider.tsx

@@ -4,7 +4,7 @@ import {
   ErrorSeverity,
   ExceptionReporter,
 } from '../../common/components/ErrorHandling/ErrorMonitorContext';
-import { handleApiError } from '../api';
+import { handleApiError } from '../../common/api';
 import { isApiError } from '../../common/api/utils';
 import { captureException } from '../sentry';
 import * as Sentry from '@sentry/browser';

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

@@ -8,7 +8,7 @@ import {
   SplitItem,
   Tooltip,
 } from '@patternfly/react-core';
-import { CaretDownIcon } from '@patternfly/react-icons';
+import { CaretDownIcon } from '@patternfly/react-icons/dist/js/icons/caret-down-icon';
 import { useField } from 'formik';
 import {
   CpuArchitecture,
@@ -60,12 +60,17 @@ export const architectureData: Record<SupportedCpuArchitecture, CpuArchitectureI
 const INPUT_NAME = 'cpuArchitecture';
 const fieldId = getFieldId(INPUT_NAME, 'input');
 
-const isCpuArchitectureSupported = (
+const isCurrentDefaultCpuArchitecture = (
   cpuArchitectures: SupportedCpuArchitecture[],
   cpuArchitecture: SupportedCpuArchitecture,
+  day1CpuArchitecture?: SupportedCpuArchitecture,
 ): boolean => {
   const cpuArchFound = cpuArchitectures.find((cpuArch) => cpuArch === cpuArchitecture);
-  return cpuArchFound !== undefined;
+  return (
+    cpuArchFound === undefined &&
+    cpuArchitecture !== getDefaultCpuArchitecture() &&
+    day1CpuArchitecture !== CpuArchitecture.ARM
+  );
 };
 
 type CpuArchitectureDropdownProps = {
@@ -163,14 +168,13 @@ const CpuArchitectureDropdown = ({
   );
 
   React.useEffect(() => {
-    const isSelectedCpuArchitectureSupported = isCpuArchitectureSupported(
+    const isCurrentDefaultCpuArchitectureSelected = isCurrentDefaultCpuArchitecture(
       cpuArchitectures,
       selectedCpuArchitecture,
+      day1CpuArchitecture,
     );
-    if (
-      !isSelectedCpuArchitectureSupported &&
-      selectedCpuArchitecture !== getDefaultCpuArchitecture()
-    ) {
+    if (isCurrentDefaultCpuArchitectureSelected) {
+      setValue(getDefaultCpuArchitecture());
       setCurrentCpuArch(architectureData[getDefaultCpuArchitecture()].label);
       setOpen(false);
     }
@@ -178,7 +182,7 @@ const CpuArchitectureDropdown = ({
       prevVersionRef.current = openshiftVersion;
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [openshiftVersion, selectedCpuArchitecture]);
+  }, [cpuArchitectures, openshiftVersion, selectedCpuArchitecture]);
 
   const toggle = React.useMemo(
     () => (

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

@@ -2,7 +2,7 @@ import React from 'react';
 import { useDispatch } from 'react-redux';
 import Axios, { CancelTokenSource } from 'axios';
 import { FormikHelpers } from 'formik';
-import { getApiErrorMessage, handleApiError, isUnknownServerError } from '../../api';
+import { getApiErrorMessage, handleApiError, isUnknownServerError } from '../../../common/api';
 import { CpuArchitecture, ErrorState, LoadingState } from '../../../common';
 import {
   forceReload,
@@ -18,6 +18,7 @@ import {
 import { mapClusterCpuArchToInfraEnvCpuArch } from '../../services/CpuArchitectureService';
 import { usePullSecret } from '../../hooks';
 import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
+import { isOciPlatformType } from '../utils';
 
 type DiscoveryImageFormProps = {
   cluster: Cluster;
@@ -114,7 +115,7 @@ const DiscoveryImageForm = ({
           ? mapClusterCpuArchToInfraEnvCpuArch(infraEnv.cpuArchitecture)
           : mapClusterCpuArchToInfraEnvCpuArch(cpuArchitecture)
       }
-      isOracleCloudInfrastructure={cluster.platform?.type === 'oci'}
+      isOracleCloudInfrastructure={isOciPlatformType(cluster)}
     />
   );
 };