@openshift-assisted/ui-lib 2.16.3-cim → 2.16.4-cim

package/lib/cim/components/InfraEnv/EnvironmentDetails.tsx

@@ -8,17 +8,16 @@ import {
   Grid,
   GridItem,
   Spinner,
-  Text,
-  TextContent,
-  TextVariants,
+  Content,
+  ContentVariants,
   Title,
   TitleSizes,
 } from '@patternfly/react-core';
 import { CheckCircleIcon } from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
 import { PencilAltIcon } from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
-import { global_palette_green_500 as okColor } from '@patternfly/react-tokens/dist/js/global_palette_green_500';
-import { global_warning_color_100 as warningColor } from '@patternfly/react-tokens/dist/js/global_warning_color_100';
+import { t_global_color_status_success_default as okColor } from '@patternfly/react-tokens/dist/js/t_global_color_status_success_default';
+import { t_global_icon_color_status_warning_default as warningColor } from '@patternfly/react-tokens/dist/js/t_global_icon_color_status_warning_default';
 
 import { architectureData, LabelValue } from '../../../common';
 import { InfraEnvK8sResource, SecretK8sResource } from '../../types';
@@ -48,9 +47,7 @@ const EditItem: React.FC<EditItemProps> = ({ title, onEdit, isLoading, isWarning
   const btn = (
     <>
       {title}&nbsp;
-      <Button variant="plain" onClick={onEdit}>
-        <PencilAltIcon />
-      </Button>
+      <Button icon={<PencilAltIcon />} variant="plain" onClick={onEdit} />
     </>
   );
   return noIcon ? (
@@ -66,11 +63,7 @@ const EditItem: React.FC<EditItemProps> = ({ title, onEdit, isLoading, isWarning
 
 const NotConfigured = () => {
   const { t } = useTranslation();
-  return (
-    <TextContent>
-      <Text component={TextVariants.small}>{t('ai:Not configured')}</Text>
-    </TextContent>
-  );
+  return <Content component={ContentVariants.small}>{t('ai:Not configured')}</Content>;
 };
 
 type EnvironmentDetailsProps = {

package/lib/cim/components/InfraEnv/EnvironmentErrors.tsx

@@ -2,7 +2,8 @@ import * as React from 'react';
 import { getFailingResourceConditions } from '../helpers';
 import { InfraEnvK8sResource } from '../../types';
 import { SingleResourceAlerts } from '../common/ResourceAlerts';
-import { Alert, AlertVariant, ModalBoxBody } from '@patternfly/react-core';
+import { Alert, AlertVariant } from '@patternfly/react-core';
+import { ModalBoxBody } from '@patternfly/react-core/deprecated';
 import { getInfraEnvDocs } from '../common/constants';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 

package/lib/cim/components/InfraEnv/InfraEnvFormPage.tsx

@@ -166,7 +166,7 @@ const InfraEnvForm: React.FC<InfraEnvFormProps> = ({
           <FormGroup
             fieldId="network-type"
             label={t('ai:Network type')}
-            labelIcon={
+            labelHelp={
               <PopoverIcon
                 noVerticalAlign
                 bodyContent={

package/lib/cim/components/InfraEnv/InfraEnvHostsTabAgentsWarning.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
-import { global_warning_color_100 as warningColor } from '@patternfly/react-tokens/dist/js/global_warning_color_100';
+import { t_global_icon_color_status_warning_default as warningColor } from '@patternfly/react-tokens/dist/js/t_global_icon_color_status_warning_default';
 import { getAgentStatus, getBMHStatus } from '../helpers';
 import { AgentK8sResource, BareMetalHostK8sResource } from '../../types';
 import { AGENT_BMH_NAME_LABEL_KEY } from '../common';

package/lib/cim/components/InfraEnv/InfraEnvOpenShiftVersionDropdown.tsx

@@ -65,15 +65,17 @@ const InfraEnvOpenShiftVersionDropdown = ({ osImages }: { osImages: OsImage[] })
           onOpenChange={() => setOsImageOpen(!osImageOpen)}
         >
           <DropdownList>
-            {filteredImages.map((image) => (
-              <DropdownItem
-                key={image.openshiftVersion}
-                id={image.openshiftVersion}
-                value={image.openshiftVersion}
-              >
-                {`OpenShift ${image.openshiftVersion}`}
-              </DropdownItem>
-            ))}
+            {filteredImages
+              .sort((a, b) => b.openshiftVersion.localeCompare(a.openshiftVersion))
+              .map((image) => (
+                <DropdownItem
+                  key={image.openshiftVersion}
+                  id={image.openshiftVersion}
+                  value={image.openshiftVersion}
+                >
+                  {`OpenShift ${image.openshiftVersion}`}
+                </DropdownItem>
+              ))}
           </DropdownList>
         </Dropdown>
       </Tooltip>

package/lib/cim/components/InfraEnv/InfraTableToolbar.tsx

@@ -125,9 +125,9 @@ const InfraTableToolbar: React.FC<InfraTableToolbarProps> = ({
       </ToolbarItem>
       <ToolbarItem>
         <ToolbarFilter
-          chips={statusFilter}
-          deleteChip={(_, chip) => setStatusFilter(statusFilter?.filter((f) => f !== chip))}
-          deleteChipGroup={() => setStatusFilter([])}
+          labels={statusFilter}
+          deleteLabel={(_, label) => setStatusFilter(statusFilter?.filter((f) => f !== label))}
+          deleteLabelGroup={() => setStatusFilter([])}
           categoryName="Status"
         >
           <Dropdown

package/lib/cim/components/InfraEnv/infra-env.css

@@ -1,7 +1,7 @@
 .infra-env__form {
-  padding-right: var(--pf-v5-c-wizard__main-body--PaddingRight);
+  padding-right: var(--pf-v6-c-wizard__main-body--PaddingRight);
 }
 
 .infra-env-hosts-tab-title__icon {
-  margin-left: var(--pf-v5-global--spacer--xs);
+  margin-left: var(--pf-v6-global--spacer--xs);
 }

package/lib/cim/components/common/CpuArchitectureDropdown.tsx

@@ -86,7 +86,7 @@ const CpuArchitectureDropdown = ({
             id={fieldId}
             ref={toggleRef}
             onClick={() => setCpuArchOpen(!cpuArchOpen)}
-            className="pf-v5-u-w-100"
+            className="pf-v6-u-w-100"
           >
             {value ? architectureData[value].label : t('ai:CPU architecture')}
           </MenuToggle>

package/lib/cim/components/common/ResourceAlerts.css

@@ -1,5 +1,5 @@
 .cim-resource-alerts {
-  margin-bottom: var(--pf-v5-global--spacer--sm);
+  margin-bottom: var(--pf-v6-global--spacer--sm);
 }
 
 .cim-resource-alerts--noul ul {

package/lib/cim/components/common/ResourceAlerts.tsx

@@ -1,13 +1,5 @@
 import React from 'react';
-import {
-  Alert,
-  AlertVariant,
-  TextContent,
-  TextList,
-  TextListItem,
-  TextListItemVariants,
-  TextListVariants,
-} from '@patternfly/react-core';
+import { Alert, AlertVariant, Content, ContentVariants } from '@patternfly/react-core';
 import { StatusCondition } from '../../types';
 
 import './ResourceAlerts.css';
@@ -27,36 +19,34 @@ export const SingleResourceAlerts: React.FC<{
       isInline
       className="cim-resource-alerts cim-resource-alerts--noul"
     >
-      <TextContent>
-        <TextList component={TextListVariants.ul}>
-          {conditions.map((c) => {
-            if (c.message) {
-              const [title, ...messages] = c.message.split(/:|\.,/);
-              return (
-                <React.Fragment key={c.type}>
-                  <TextListItem component={TextListItemVariants.li}>
-                    <strong>{title}</strong>
-                  </TextListItem>
-                  {messages.map((m) => (
-                    <TextListItem key={m} component={TextListItemVariants.li}>
-                      {m}
-                    </TextListItem>
-                  ))}
-                </React.Fragment>
-              );
-            } else {
-              return (
-                <React.Fragment key={c.type}>
-                  <TextListItem component={TextListItemVariants.li}>
-                    <strong>{c.type}</strong>
-                  </TextListItem>
-                  <TextListItem component={TextListItemVariants.li}>{c.reason || ''}</TextListItem>
-                </React.Fragment>
-              );
-            }
-          })}
-        </TextList>
-      </TextContent>
+      <Content component={ContentVariants.ul}>
+        {conditions.map((c) => {
+          if (c.message) {
+            const [title, ...messages] = c.message.split(/:|\.,/);
+            return (
+              <React.Fragment key={c.type}>
+                <Content component={ContentVariants.li}>
+                  <strong>{title}</strong>
+                </Content>
+                {messages.map((m) => (
+                  <Content key={m} component={ContentVariants.li}>
+                    {m}
+                  </Content>
+                ))}
+              </React.Fragment>
+            );
+          } else {
+            return (
+              <React.Fragment key={c.type}>
+                <Content component={ContentVariants.li}>
+                  <strong>{c.type}</strong>
+                </Content>
+                <Content component={ContentVariants.li}>{c.reason || ''}</Content>
+              </React.Fragment>
+            );
+          }
+        })}
+      </Content>
     </Alert>
   );
 };

package/lib/cim/components/helpers/agentClusterInstall.ts

@@ -4,10 +4,6 @@ import { getClusterNameOfAgent } from './agents';
 export const getIsSNOCluster = (agentClusterInstall?: AgentClusterInstallK8sResource) =>
   agentClusterInstall?.spec?.provisionRequirements?.controlPlaneAgents === 1;
 
-export const getIsTNACluster = (agentClusterInstall?: AgentClusterInstallK8sResource) =>
-  agentClusterInstall?.spec?.provisionRequirements.arbiterAgents === 1 &&
-  agentClusterInstall.spec.provisionRequirements.controlPlaneAgents === 2;
-
 export const getAgentClusterInstallOfAgent = (
   agentClusterInstalls: AgentClusterInstallK8sResource[],
   agent?: AgentK8sResource,

package/lib/cim/components/helpers/agentStatus.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ConnectedIcon } from '@patternfly/react-icons/dist/js/icons/connected-icon';
 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';
+import { t_global_icon_color_status_danger_default as dangerColor } from '@patternfly/react-tokens/dist/js/t_global_icon_color_status_danger_default';
 import { hostStatus } from '../../../common';
 import { HostStatus } from '../../../common/components/hosts/types';
 import { TFunction } from 'i18next';

package/lib/cim/components/helpers/toAssisted.ts

@@ -1,11 +1,6 @@
 import cloneDeep from 'lodash-es/cloneDeep.js';
 import { AgentK8sResource } from '../../types/k8s/agent';
-import {
-  Cluster,
-  Host,
-  Inventory,
-  PlatformType,
-} from '@openshift-assisted/types/assisted-installer-service';
+import { Cluster, Host, Inventory } from '@openshift-assisted/types/assisted-installer-service';
 import { ClusterDeploymentK8sResource } from '../../types/k8s/cluster-deployment';
 import { AgentClusterInstallK8sResource } from '../../types/k8s/agent-cluster-install';
 import { getAgentStatusKey, getClusterStatus } from './status';
@@ -117,18 +112,6 @@ export const getAIHosts = (
   return [...hosts, ...restBmhs];
 };
 
-const extractVersionFromImageSetRef = (imageSetRefName?: string): string | undefined => {
-  if (!imageSetRefName) {
-    return undefined;
-  }
-  // Match pattern like "4.19.18" or "4.19" in strings like "img4.19.18-multi-appsub"
-  const versionMatch = imageSetRefName.match(/(\d+\.\d+)(?:\.\d+)?/);
-  if (versionMatch && versionMatch[1]) {
-    return versionMatch[1];
-  }
-  return undefined;
-};
-
 export const getAICluster = ({
   clusterDeployment,
   agentClusterInstall,
@@ -140,13 +123,9 @@ export const getAICluster = ({
   agents?: AgentK8sResource[];
   infraEnv?: InfraEnvK8sResource;
 }): Cluster => {
-  const imageSetRefName = agentClusterInstall?.spec?.imageSetRef?.name;
-  const extractedVersion = extractVersionFromImageSetRef(imageSetRefName);
-
   const installVersion =
     clusterDeployment.status?.installVersion ||
-    clusterDeployment.metadata?.labels?.[OCP_VERSION_MAJOR_MINOR] ||
-    extractedVersion;
+    clusterDeployment.metadata?.labels?.[OCP_VERSION_MAJOR_MINOR];
   const [status, statusInfo] = getClusterStatus(agentClusterInstall);
   const aiCluster: Cluster = {
     id: clusterDeployment.metadata?.uid || '',
@@ -195,9 +174,6 @@ export const getAICluster = ({
     cpuArchitecture: getClusterDeploymentCpuArchitecture(clusterDeployment, infraEnv),
     networkType: agentClusterInstall?.spec?.networking.networkType,
     controlPlaneCount: agentClusterInstall?.spec?.provisionRequirements.controlPlaneAgents || 3,
-    platform: {
-      type: (agentClusterInstall?.spec?.platformType?.toLowerCase() || 'baremetal') as PlatformType,
-    },
   };
   /*
   aiCluster.agentSelectorMasterLabels =

package/lib/cim/components/helpers/versions.ts

@@ -8,7 +8,7 @@ import {
 } from '../../types';
 import { CpuArchitecture, OpenshiftVersionOptionType } from '../../../common';
 import { OpenshiftVersion } from '@openshift-assisted/types/assisted-installer-service';
-import { getComparableVersionInt } from '../../../common/utils';
+import { isMajorMinorVersionEqualOrGreater } from '../../../common/utils';
 
 export const getVersionFromReleaseImage = (releaseImage = '') => {
   const match = /.+:(\d+\.\d+(?:\.\d+)?(?:-\w+)?)/gm.exec(releaseImage);
@@ -123,9 +123,5 @@ export const getCurrentClusterVersion = (cv?: ClusterVersionK8sResource): string
 
 export const getNetworkType = (
   ocpVersion: OpenshiftVersionOptionType | undefined,
-): 'OVNKubernetes' | 'OpenShiftSDN' => {
-  const checkVersionNum = getComparableVersionInt(ocpVersion?.version || '');
-  const toVersionNum = getComparableVersionInt('4.12');
-
-  return !checkVersionNum || checkVersionNum >= toVersionNum ? 'OVNKubernetes' : 'OpenShiftSDN';
-};
+): 'OVNKubernetes' | 'OpenShiftSDN' =>
+  isMajorMinorVersionEqualOrGreater(ocpVersion?.version, '4.12') ? 'OVNKubernetes' : 'OpenShiftSDN';

package/lib/cim/components/modals/AddBmcHostModal.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Modal, ModalVariant } from '@patternfly/react-core';
+import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
 import BMCForm from '../Agent/BMCForm';
 import { AddBmcHostModalProps } from './types';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';

package/lib/cim/components/modals/AddBmcHostYamlForm.css

@@ -1,5 +1,5 @@
 .ai-bmc-yaml__error {
   display: block;
-  font-size: var(--pf-v5-global--FontSize--md);
+  font-size: var(--pf-v6-global--FontSize--md);
   color: red;
 }

package/lib/cim/components/modals/AddBmcHostYamlForm.tsx

@@ -7,15 +7,12 @@ import {
   ButtonVariant,
   EmptyState,
   EmptyStateBody,
-  EmptyStateHeader,
-  EmptyStateIcon,
   EmptyStateVariant,
-  ModalBoxBody,
-  ModalBoxFooter,
   Spinner,
   Stack,
   StackItem,
 } from '@patternfly/react-core';
+import { ModalBoxBody, ModalBoxFooter } from '@patternfly/react-core/deprecated';
 import { ErrorCircleOIcon } from '@patternfly/react-icons/dist/js/icons/error-circle-o-icon';
 import { UploadIcon } from '@patternfly/react-icons/dist/js/icons/upload-icon';
 import jsYaml from 'js-yaml';
@@ -132,12 +129,12 @@ const AddBmcHostYamlForm: React.FC<
       <ModalBoxBody>
         <Stack hasGutter>
           <StackItem>
-            <EmptyState variant={EmptyStateVariant.lg}>
-              <EmptyStateHeader
-                titleText={<>{t('ai:Upload a YAML file')}</>}
-                icon={<EmptyStateIcon icon={UploadIcon} />}
-                headingLevel="h4"
-              />
+            <EmptyState
+              headingLevel="h4"
+              icon={UploadIcon}
+              titleText={<>{t('ai:Upload a YAML file')}</>}
+              variant={EmptyStateVariant.lg}
+            >
               <EmptyStateBody>
                 <p>
                   {t(

package/lib/cim/components/modals/AddBmcHostYamlModal.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Modal, ModalVariant } from '@patternfly/react-core';
+import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
 import { UploadActionModalProps } from './types';
 import AddBmcHostYamlForm from './AddBmcHostYamlForm';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';

package/lib/cim/components/modals/AddHostModal.tsx

@@ -1,14 +1,7 @@
 import * as React from 'react';
 import { FormikHelpers } from 'formik';
-import {
-  EmptyState,
-  EmptyStateBody,
-  EmptyStateHeader,
-  EmptyStateIcon,
-  Modal,
-  ModalVariant,
-  Spinner,
-} from '@patternfly/react-core';
+import { EmptyState, EmptyStateBody, Spinner } from '@patternfly/react-core';
+import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
 import { DownloadIso, DiscoveryImageConfigForm, DiscoveryImageFormValues } from '../../../common';
 import { AddHostModalProps } from './types';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
@@ -124,8 +117,7 @@ const GeneratingIsoDownload = ({
       docVersion={docVersion}
     />
   ) : (
-    <EmptyState>
-      <EmptyStateHeader icon={<EmptyStateIcon icon={Spinner} />} />
+    <EmptyState icon={Spinner}>
       <EmptyStateBody>{t('ai:Generating discovery ISO')}</EmptyStateBody>
     </EmptyState>
   );
@@ -148,8 +140,7 @@ const GeneratingIPXEDownload = ({
       onReset={onReset}
     />
   ) : (
-    <EmptyState>
-      <EmptyStateHeader icon={<EmptyStateIcon icon={Spinner} />} />
+    <EmptyState icon={Spinner}>
       <EmptyStateBody>{t('ai:Generating iPXE script')}</EmptyStateBody>
     </EmptyState>
   );

package/lib/cim/components/modals/CimConfiguration/CimConfigProgressAlert.tsx

@@ -65,12 +65,13 @@ export const CimConfigProgressAlert: React.FC<CimConfigProgressAlertProps> = ({
 
   const assistedServiceDeploymentLink = (
     <Button
+      icon={<ExternalLinkAltIcon />}
       variant={ButtonVariant.link}
       isInline
       key="assisted-service-deployment"
       onClick={() => navigate(assistedServiceDeploymentUrl)}
     >
-      {t('ai:Troubleshoot in the assisted service deployment')} <ExternalLinkAltIcon />
+      {t('ai:Troubleshoot in the assisted service deployment')}
     </Button>
   );
 

package/lib/cim/components/modals/CimConfiguration/CimConfigurationForm.css

@@ -1,4 +1,4 @@
-.cim-config-form-title .pf-v5-c-form__label-text {
+.cim-config-form-title .pf-v6-c-form__label-text {
   font-size: larger;
 }
 
@@ -11,13 +11,13 @@
 }
 
 .cim-config-form-aws {
-  margin-bottom: var(--pf-v5-global--spacer--md);
+  margin-bottom: var(--pf-v6-global--spacer--md);
 }
 
 .cim-config-form-volume input {
   width: 10rem;
 }
 
-.cim-config-modal .pf-v5-c-modal-box__body {
+.cim-config-modal .pf-v6-c-modal-box__body {
   overflow: hidden;
 }

package/lib/cim/components/modals/CimConfiguration/CimConfigurationForm.tsx

@@ -69,7 +69,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
         aria-label={t('ai:More info for load balancer on Amazon web services')}
         aria-describedby="cim-config-form-aws-title"
         onClick={(e) => e.preventDefault()}
-        className="pf-v5-c-form__group-label-help"
+        className="pf-v6-c-form__group-label-help"
       >
         <Icon>
           <HelpIcon />
@@ -84,7 +84,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
         fieldId="cim-config-form-storage-title"
         label={t('ai:Storage sizes')}
         className="cim-config-form-title"
-        labelIcon={
+        labelHelp={
           <Popover
             bodyContent={t(
               'ai:The storage sizes will be used to store different files and data for cluster creation.',
@@ -102,7 +102,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
               aria-label={t('ai:More info for configure storage sizes')}
               aria-describedby="cim-config-form-storage-title"
               onClick={(e) => e.preventDefault()}
-              className="pf-v5-c-form__group-label-help"
+              className="pf-v6-c-form__group-label-help"
             >
               <Icon>
                 <HelpIcon />
@@ -118,7 +118,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
           <FormGroup
             label={t('ai:Database storage')}
             fieldId="cim-config-form-storage-db"
-            labelIcon={
+            labelHelp={
               <Popover
                 bodyContent={t(
                   'ai:Specify how much storage is allocated for storing files such as database tables and database views for the clusters. Recommended is 10Gi or more. The value can not be updated later.',
@@ -129,7 +129,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
                   aria-label={t('ai:More info for database storage')}
                   aria-describedby="cim-config-form-storage-db"
                   onClick={(e) => e.preventDefault()}
-                  className="pf-v5-c-form__group-label-help"
+                  className="pf-v6-c-form__group-label-help"
                 >
                   <Icon>
                     <HelpIcon />
@@ -168,7 +168,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
           <FormGroup
             label={t('ai:System storage')}
             fieldId="cim-config-form-storage-sys"
-            labelIcon={
+            labelHelp={
               <Popover
                 bodyContent={t(
                   'ai:Specify how much storage is allocated for storing logs, manifests and "kubeconfig" files for the clusters. Recommended is 100Gi or more. The value can not be updated later.',
@@ -179,7 +179,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
                   aria-label={t('ai:More info for system storage')}
                   aria-describedby="cim-config-form-storage-sys"
                   onClick={(e) => e.preventDefault()}
-                  className="pf-v5-c-form__group-label-help"
+                  className="pf-v6-c-form__group-label-help"
                 >
                   <Icon>
                     <HelpIcon />
@@ -218,7 +218,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
           <FormGroup
             label={t('ai:Image storage')}
             fieldId="cim-config-form-storage-img"
-            labelIcon={
+            labelHelp={
               <Popover
                 bodyContent={t(
                   'ai:Specify how much storage to allocate for the images of the clusters. There must be 1G of image storage for each instance of Red Hat Enterprise Linux CoreOS that is running. Recommended is 50Gi or more. The value can not be updated later.',
@@ -229,7 +229,7 @@ export const CimConfigurationForm: React.FC<CimConfigurationFormProps> = ({
                   aria-label={t('ai:More info for image storage')}
                   aria-describedby="cim-config-form-storage-img"
                   onClick={(e) => e.preventDefault()}
-                  className="pf-v5-c-form__group-label-help"
+                  className="pf-v6-c-form__group-label-help"
                 >
                   <Icon>
                     <HelpIcon />

package/lib/cim/components/modals/CimConfiguration/CimConfigurationModal.css

@@ -1,3 +1,3 @@
-.cim-config-modal .pf-v5-c-alert {
-  margin-bottom: var(--pf-v5-global--spacer--md);
+.cim-config-modal .pf-v6-c-alert {
+  margin-bottom: var(--pf-v6-global--spacer--md);
 }

package/lib/cim/components/modals/CimConfiguration/CimConfigurationModal.tsx

@@ -1,12 +1,6 @@
 import * as React from 'react';
-import {
-  Alert,
-  AlertVariant,
-  Button,
-  ButtonVariant,
-  Modal,
-  ModalVariant,
-} from '@patternfly/react-core';
+import { Alert, AlertVariant, Button, ButtonVariant } from '@patternfly/react-core';
+import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
 
 import { useTranslation } from '../../../../common/hooks/use-translation-wrapper';
 import { getStorageSizeGiB } from '../../helpers';

package/lib/cim/components/modals/EditBMHModal.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Modal, ModalVariant } from '@patternfly/react-core';
+import { Modal, ModalVariant } from '@patternfly/react-core/deprecated';
 import BMCForm from '../Agent/BMCForm';
 import { SecretK8sResource } from '../../types';
 import { LoadingState } from '../../../common';

package/lib/cim/components/modals/EditNtpSourcesModal.tsx

@@ -1,16 +1,11 @@
 import * as React from 'react';
+import { Alert, Button, ButtonVariant, Form, Stack, StackItem } from '@patternfly/react-core';
 import {
-  Alert,
-  Button,
-  ButtonVariant,
-  Form,
   Modal,
   ModalBoxBody,
   ModalBoxFooter,
   ModalVariant,
-  Stack,
-  StackItem,
-} from '@patternfly/react-core';
+} from '@patternfly/react-core/deprecated';
 import { Formik, FormikProps } from 'formik';
 import { InfraEnvK8sResource } from '../../types';
 import { RadioField, AdditionalNTPSourcesField } from '../../../common';

package/lib/cim/components/modals/EditProxyModal.tsx

@@ -1,17 +1,12 @@
 import * as React from 'react';
 import * as Yup from 'yup';
+import { Alert, Button, ButtonVariant, Form, Stack, StackItem } from '@patternfly/react-core';
 import {
-  Alert,
-  Button,
-  ButtonVariant,
-  Form,
   Modal,
   ModalBoxBody,
   ModalBoxFooter,
   ModalVariant,
-  Stack,
-  StackItem,
-} from '@patternfly/react-core';
+} from '@patternfly/react-core/deprecated';
 import { EditProxyModalProps } from './types';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import { ProxyInputFields } from '../../../common/components/clusterConfiguration/ProxyFields';
@@ -111,7 +106,7 @@ const EditProxyModal: React.FC<EditProxyModalProps> = ({
                 <Form>
                   <ProxyInputFields />
                   {error && (
-                    <Alert variant="danger" title={t('ai:An error occurred')} isInline>
+                    <Alert variant="danger" title={t('ai:An error occured')} isInline>
                       {error}
                     </Alert>
                   )}