@openshift-assisted/ui-lib 2.17.1-cim → 2.17.4-cim

package/lib/cim/components/Hypershift/utils/status.tsx

@@ -1,14 +1,13 @@
+import React from 'react';
+import { TFunction } from 'i18next';
+import { Icon } from '@patternfly/react-core';
 import { CheckCircleIcon } from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
 import { InProgressIcon } from '@patternfly/react-icons/dist/js/icons/in-progress-icon';
-import React from 'react';
-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_danger_default as dangerColor } from '@patternfly/react-tokens/dist/js/t_global_icon_color_status_danger_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 { NodePoolK8sResource } from '../types';
 import { AgentK8sResource } from '../../../types';
 import { getAgentStatus } from '../../helpers';
-import { NodePoolK8sResource } from '../types';
-import { TFunction } from 'i18next';
 import { agentStatus } from '../../helpers/agentStatus';
 
 export type NodePoolStatus = {
@@ -40,7 +39,11 @@ export const getNodePoolStatus = (
   if (hasErrorAgents) {
     return {
       type: 'error',
-      icon: <ExclamationCircleIcon color={dangerColor.value} />,
+      icon: (
+        <Icon status="danger">
+          <ExclamationCircleIcon />
+        </Icon>
+      ),
       text: t('ai:Error'),
     };
   }
@@ -58,7 +61,11 @@ export const getNodePoolStatus = (
   if (hasWarningAgents) {
     return {
       type: 'warning',
-      icon: <ExclamationCircleIcon color={warningColor.value} />,
+      icon: (
+        <Icon status="warning">
+          <ExclamationCircleIcon />
+        </Icon>
+      ),
       text: t('ai:Warning'),
     };
   }
@@ -66,7 +73,11 @@ export const getNodePoolStatus = (
   return nodePool.status?.conditions?.find(({ type }) => type === 'Ready')?.status === 'True'
     ? {
         type: 'ok',
-        icon: <CheckCircleIcon color={okColor.value} />,
+        icon: (
+          <Icon status="success">
+            <CheckCircleIcon />
+          </Icon>
+        ),
         text: t('ai:Ready'),
       }
     : {

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

@@ -13,12 +13,11 @@ import {
   Title,
   TitleSizes,
   Label,
+  Icon,
 } 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 { 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 } from '../../../common';
 import { InfraEnvK8sResource, SecretK8sResource } from '../../types';
@@ -39,11 +38,19 @@ type EditItemProps = {
 };
 
 const EditItem: React.FC<EditItemProps> = ({ title, onEdit, isLoading, isWarning, noIcon }) => {
-  let icon = <CheckCircleIcon color={okColor.value} />;
+  let icon = (
+    <Icon status="success">
+      <CheckCircleIcon />
+    </Icon>
+  );
   if (isLoading) {
     icon = <Spinner size="md" />;
   } else if (isWarning) {
-    icon = <ExclamationTriangleIcon color={warningColor.value} />;
+    icon = (
+      <Icon status="warning">
+        <ExclamationTriangleIcon />
+      </Icon>
+    );
   }
   const btn = (
     <>

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

@@ -76,32 +76,34 @@ const validationSchema = (usedNames: string[], t: TFunction) =>
   Yup.lazy((values: EnvironmentStepFormValues) =>
     Yup.object<EnvironmentStepFormValues>().shape({
       name: richNameValidationSchema(t, usedNames),
-      location: locationValidationSchema(t).required(t('ai:Location is a required field.')),
-      pullSecret: pullSecretValidationSchema.required(t('ai:Pull secret is a required field.')),
-      sshPublicKey: sshPublicKeyValidationSchema,
+      location: locationValidationSchema(t),
+      pullSecret: pullSecretValidationSchema(t).required(t('ai:Required field')),
+      sshPublicKey: sshPublicKeyValidationSchema(t),
       httpProxy: httpProxyValidationSchema({
         values,
         pairValueName: 'httpsProxy',
         allowEmpty: true,
+        t,
       }),
       httpsProxy: httpProxyValidationSchema({
         values,
         pairValueName: 'httpProxy',
         allowEmpty: true,
+        t,
       }), // share the schema, httpS is currently not supported
-      noProxy: noProxyValidationSchema,
+      noProxy: noProxyValidationSchema(t),
       labels: Yup.array()
         .of(Yup.string())
         .test(
           'label-equals-validation',
-          'Label selector needs to be in a `key=value` form',
+          t('ai:Label needs to be in a `key=value` form'),
           (values) =>
             (values as string[]).every((value) => {
               const parts = value.split('=');
               return parts.length === 2;
             }),
         ),
-      additionalNtpSources: ntpSourceValidationSchema,
+      additionalNtpSources: ntpSourceValidationSchema(t),
     }),
   );
 

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

@@ -1,10 +1,9 @@
 import * as React from 'react';
+import { Icon, Tooltip } from '@patternfly/react-core';
 import { ExclamationTriangleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
-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';
-import { Tooltip } from '@patternfly/react-core';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import { agentStatus, bmhStatus } from '../helpers/agentStatus';
 
@@ -51,10 +50,9 @@ const InfraEnvHostsTabAgentsWarning: React.FC<InfraEnvHostsTabAgentsWarning> = (
   if (hostsWithProblemsCount) {
     return (
       <Tooltip content={t('ai:{{count}} host has problems', { count: hostsWithProblemsCount })}>
-        <ExclamationTriangleIcon
-          color={warningColor.value}
-          className="infra-env-hosts-tab-title__icon"
-        />
+        <Icon status="warning">
+          <ExclamationTriangleIcon className="infra-env-hosts-tab-title__icon" />
+        </Icon>
       </Tooltip>
     );
   }

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

@@ -1,10 +1,10 @@
 import * as React from 'react';
+import { TFunction } from 'i18next';
+import { Icon } from '@patternfly/react-core';
 import { ConnectedIcon } from '@patternfly/react-icons/dist/js/icons/connected-icon';
 import { ExclamationCircleIcon } from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
-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';
 
 export const bmhStatus = (t: TFunction): HostStatus<string> => ({
   'bmh-error': {
@@ -68,7 +68,11 @@ export const agentStatus = (t: TFunction): HostStatus<string> => ({
   specSyncErr: {
     key: 'specSyncErr',
     title: t('ai:Sync error'),
-    icon: <ExclamationCircleIcon color={dangerColor.value} />,
+    icon: (
+      <Icon status="danger">
+        <ExclamationCircleIcon />
+      </Icon>
+    ),
     category: 'Discovery related',
   },
 });

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

@@ -61,48 +61,65 @@ export const isValidImageSet = (
   );
 };
 
+// Extracts major.minor version, strips any non-numeric prefix (e.g., "img4.18.55" → "4.18")
+const extractMajorMinor = (version: string): string => {
+  const versionWithoutPrefix = version.replace(/^[^\d]*/, '');
+  return versionWithoutPrefix.split('.').slice(0, 2).join('.');
+};
+
+// Converts a ClusterImageSet to an OpenshiftVersionOptionType
+const toVersionOption = (
+  clusterImageSet: ClusterImageSetK8sResource,
+): OpenshiftVersionOptionType => {
+  const version =
+    getVersionFromReleaseImage(clusterImageSet.spec?.releaseImage) ||
+    clusterImageSet.metadata?.name ||
+    '';
+  const cpuArch = getCPUArchFromReleaseImage(clusterImageSet.spec?.releaseImage);
+  return {
+    label: `OpenShift ${version}`,
+    version,
+    value: clusterImageSet.metadata?.name as string,
+    default: false,
+    // (rawagner) ACM does not have the warning so changing to 'production'
+    // supportLevel : getSupportLevelFromChannel(clusterImageSet.metadata?.labels?.channel)
+    supportLevel: 'production',
+    cpuArchitectures: cpuArch ? [cpuArch as CpuArchitecture] : undefined,
+  };
+};
+
+/**
+ * In case there are osImages specified on the AgentServiceConfig, we want to limit
+ * the availability in the dropdown to only versions that are listed there.
+ * Otherwise the installation fails.
+ */
+const hasMatchingOsImage = (
+  version: OpenshiftVersionOptionType,
+  osImageVersions: (string | undefined)[],
+): boolean => {
+  if (!osImageVersions.length) return true;
+  return osImageVersions.includes(extractMajorMinor(version.version));
+};
+
 export const getOCPVersions = (
   clusterImageSets: ClusterImageSetK8sResource[],
-  isNutanix?: boolean | undefined,
+  isNutanix?: boolean,
   osImages?: OsImage[],
   extended?: boolean,
 ): OpenshiftVersionOptionType[] => {
-  const ocpImageVersions = Array.from(
-    new Set(osImages?.map((osImage) => osImage.openshiftVersion)),
-  );
+  const architectures = isNutanix ? supportedNutanixPlatforms : undefined;
+  const osImageVersions = [...new Set(osImages?.map((img) => img.openshiftVersion))];
 
   const versions = clusterImageSets
-    .filter((clusterImageSet) =>
-      isValidImageSet(clusterImageSet, isNutanix ? supportedNutanixPlatforms : undefined, extended),
-    )
-    .map((clusterImageSet): OpenshiftVersionOptionType => {
-      const version = getVersionFromReleaseImage(clusterImageSet.spec?.releaseImage);
-      const cpuArch = getCPUArchFromReleaseImage(clusterImageSet.spec?.releaseImage);
-      return {
-        label: `OpenShift ${version ? version : (clusterImageSet.metadata?.name as string)}`,
-        version: version || clusterImageSet.metadata?.name || '',
-        value: clusterImageSet.metadata?.name as string,
-        default: false,
-        // (rawagner) ACM does not have the warning so changing to 'production'
-        supportLevel: 'production', // getSupportLevelFromChannel(clusterImageSet.metadata?.labels?.channel),
-        cpuArchitectures: cpuArch ? [cpuArch as CpuArchitecture] : undefined,
-      };
-    })
-    .filter((ocpVersion) => {
-      const ver = ocpVersion.version.split('.').slice(0, 2).join('.');
-      return !!ocpImageVersions.length ? ocpImageVersions.includes(ver) : true;
-    })
-    .sort(
-      (versionA, versionB) => /* descending */ -1 * versionA.label.localeCompare(versionB.label),
-    );
-
-  if (versions.length) {
-    // make sure that the pre-selected one is the first-one after sorting
-    versions[0].default = true;
-  }
+    .filter((clusterImageSet) => isValidImageSet(clusterImageSet, architectures, extended))
+    .map(toVersionOption)
+    .filter((v) => hasMatchingOsImage(v, osImageVersions))
+    .sort((a, b) => b.label.localeCompare(a.label));
+
+  // Mark first version as the default selection
+  versions[0] && (versions[0].default = true);
 
-  const deduped = uniqBy(versions, (v) => v.version);
-  return deduped;
+  return uniqBy(versions, (v) => v.version);
 };
 
 export const getSelectedVersion = (

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

@@ -33,7 +33,6 @@ export const CimConfigurationFormFields = ({
   setConfigureLoadBalancerInitial,
 }: CimConfigurationFormFieldsProps) => {
   const { t } = useTranslation();
-
   const { setFieldValue, values } = useFormikContext<CimConfigurationValues>();
 
   React.useEffect(
@@ -223,8 +222,7 @@ export const CimConfigurationFormFields = ({
 
         <StackItem>
           <CheckboxField
-            name={'addCiscoIntersightUrl'}
-            isDisabled={isEdit}
+            name={'addCiscoIntersightURL'}
             label={
               <>
                 {t('ai:Configure custom URL for Cisco Intersight')}{' '}
@@ -240,14 +238,18 @@ export const CimConfigurationFormFields = ({
                 </PopoverIcon>
               </>
             }
+            onChange={(checked) => {
+              if (!checked) {
+                setFieldValue('ciscoIntersightURL', '', false);
+              }
+            }}
           />
 
-          {values.addCiscoIntersightUrl && (
+          {values.addCiscoIntersightURL && (
             <InputField
               name={'ciscoIntersightURL'}
               label={t('ai:Cisco Intersight URL')}
               isRequired
-              isDisabled={isEdit}
               placeholder="https://www.intersight.com/an/workflow/workflow-definitions/execute/AddServersFromISO"
               helperText={t('ai:Provide the complete URL, including the protocol and parameters.')}
             />

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

@@ -62,7 +62,7 @@ export const CimConfigurationModal: React.FC<CimConfigurationModalProps> = ({
         fsVolSizeGiB: values.fsVolSize,
         imgVolSizeGiB: values.imgVolSize,
         configureLoadBalancer: values.configureLoadBalancer,
-        ciscoIntersightURL: values.addCiscoIntersightUrl ? values.ciscoIntersightURL : undefined,
+        ciscoIntersightURL: values.addCiscoIntersightURL ? values.ciscoIntersightURL : undefined,
       })
     ) {
       // successfully persisted
@@ -95,16 +95,23 @@ export const CimConfigurationModal: React.FC<CimConfigurationModalProps> = ({
       agentServiceConfig?.spec?.imageStorage?.resources?.requests?.storage,
     ),
     configureLoadBalancer: platform === 'AWS',
-    addCiscoIntersightUrl: !!agentServiceConfig?.metadata?.annotations?.['ciscoIntersightURL'],
+    addCiscoIntersightURL: !!agentServiceConfig?.metadata?.annotations?.['ciscoIntersightURL'],
     ciscoIntersightURL: agentServiceConfig?.metadata?.annotations?.['ciscoIntersightURL'] || '',
   };
 
   const validationSchema = Yup.object<CimConfigurationValues>({
-    dbVolSize: Yup.number().min(MIN_DB_VOL_SIZE, t('ai:Minimal value is 1Gi')).required(),
-    fsVolSize: Yup.number().min(MIN_FS_VOL_SIZE, t('ai:Minimal value is 1Gi')).required(),
-    imgVolSize: Yup.number().min(MIN_IMG_VOL_SIZE, t('ai:Minimal value is 10Gi')).required(),
+    dbVolSize: Yup.number()
+      .min(MIN_DB_VOL_SIZE, t('ai:Minimal value is 1Gi'))
+      .required(t('ai:Required field')),
+    fsVolSize: Yup.number()
+      .min(MIN_FS_VOL_SIZE, t('ai:Minimal value is 1Gi'))
+      .required(t('ai:Required field')),
+    imgVolSize: Yup.number()
+      .min(MIN_IMG_VOL_SIZE, t('ai:Minimal value is 10Gi'))
+      .required(t('ai:Required field')),
     configureLoadBalancer: Yup.boolean(),
-    ciscoIntersightURL: Yup.string().when('addCiscoIntersightUrl', {
+    addCiscoIntersightURL: Yup.boolean(),
+    ciscoIntersightURL: Yup.string().when('addCiscoIntersightURL', {
       is: true,
       then: (schema) =>
         schema

package/lib/cim/components/modals/CimConfiguration/persist.ts

@@ -13,11 +13,13 @@ import {
   AgentServiceConfigK8sResource,
   AgentServiceConfigModel,
   IngressControllerModel,
+  K8sPatch,
   ProvisioningModel,
   RouteK8sResource,
   RouteModel,
 } from '../../../types';
 import { LOCAL_STORAGE_ID_LAST_UPDATE_TIMESTAMP } from './utils';
+import { appendPatch } from '../../../utils';
 
 export type SetErrorFuncType = ({
   title,
@@ -352,6 +354,15 @@ export const onEnableCIM = async ({
     ) {
       return false;
     }
+  } else {
+    const patches = [] as K8sPatch;
+    appendPatch(
+      patches,
+      '/metadata/annotations/ciscoIntersightURL',
+      ciscoIntersightURL,
+      agentServiceConfig.metadata?.annotations?.['ciscoIntersightURL'],
+    );
+    await k8sPatch({ model: AgentServiceConfigModel, resource: agentServiceConfig, data: patches });
   }
 
   // see isCIMConfigProgressing()

package/lib/cim/components/modals/CimConfiguration/types.ts

@@ -5,7 +5,7 @@ export type CimConfigurationValues = {
   fsVolSize: number;
   imgVolSize: number;
   configureLoadBalancer: boolean;
-  addCiscoIntersightUrl: boolean;
+  addCiscoIntersightURL: boolean;
   ciscoIntersightURL: string;
 };
 

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

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as Yup from 'yup';
+import { TFunction } from 'i18next';
 import {
   Alert,
   Button,
@@ -25,20 +26,22 @@ import {
 import { getErrorMessage } from '../../../common/utils';
 import { getWarningMessage } from './utils';
 
-const validationSchema = () =>
+const validationSchema = (t: TFunction) =>
   Yup.lazy((values: ProxyFieldsType) =>
     Yup.object<ProxyFieldsType>().shape({
       httpProxy: httpProxyValidationSchema({
         values,
         pairValueName: 'httpsProxy',
         allowEmpty: true,
+        t,
       }),
       httpsProxy: httpProxyValidationSchema({
         values,
         pairValueName: 'httpProxy',
         allowEmpty: true,
+        t,
       }),
-      noProxy: noProxyValidationSchema,
+      noProxy: noProxyValidationSchema(t),
     }),
   );
 
@@ -91,7 +94,7 @@ const EditProxyModal: React.FC<EditProxyModalProps> = ({
           noProxy: infraEnv.spec?.proxy?.noProxy,
           enableProxy,
         }}
-        validationSchema={validationSchema}
+        validationSchema={validationSchema(t)}
         onSubmit={async (values: ProxyFieldsType) => {
           setError(undefined);
           try {

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

@@ -23,7 +23,7 @@ import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 
 const validationSchema = (t: TFunction) =>
   Yup.object({
-    pullSecret: pullSecretValidationSchema.required(t('ai:Pull secret is a required field.')),
+    pullSecret: pullSecretValidationSchema(t).required(t('ai:Pull secret is a required field.')),
   });
 
 type EditPullSecretFormProps = {

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

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as Yup from 'yup';
+import { TFunction } from 'i18next';
 import {
   Alert,
   Button,
@@ -20,11 +21,12 @@ import { EditSSHKeyFormikValues } from './types';
 import { getWarningMessage } from './utils';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 
-const validationSchema = Yup.object({
-  sshPublicKey: sshPublicKeyValidationSchema.required(
-    'An SSH key is required to debug hosts as they register.',
-  ),
-});
+const validationSchema = (t: TFunction) =>
+  Yup.object({
+    sshPublicKey: sshPublicKeyValidationSchema(t).required(
+      t('ai:An SSH key is required to debug hosts as they register.'),
+    ),
+  });
 
 export type EditSSHKeyModalProps = {
   isOpen: boolean;
@@ -61,7 +63,7 @@ const EditSSHKeyModal: React.FC<EditSSHKeyModalProps> = ({
         initialValues={{
           sshPublicKey: infraEnv.spec?.sshAuthorizedKey || '',
         }}
-        validationSchema={validationSchema}
+        validationSchema={validationSchema(t)}
         onSubmit={async (values) => {
           try {
             await onSubmit(values, infraEnv);

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

@@ -1,8 +1,10 @@
 import * as React from 'react';
-import { Button, Flex, FlexItem, Popover } from '@patternfly/react-core';
+import { TFunction } from 'i18next';
+import { Button, Flex, FlexItem, Icon, Popover } from '@patternfly/react-core';
 import { InfoCircleIcon } from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import { Link } from 'react-router-dom-v5-compat';
-import { t_global_icon_color_status_info_default as blueInfoColor } from '@patternfly/react-tokens/dist/js/t_global_icon_color_status_info_default';
+
+import { Host } from '@openshift-assisted/types/assisted-installer-service';
 import {
   getHostname,
   getInventory,
@@ -23,8 +25,6 @@ import BMHStatus from '../Agent/BMHStatus';
 import { getBMHStatus, getAgentStatus } from '../helpers';
 import { usePagination } from '../../../common/components/hosts/usePagination';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
-import { TFunction } from 'i18next';
-import { Host } from '@openshift-assisted/types/assisted-installer-service';
 import { agentStatus, bmhStatus } from '../helpers/agentStatus';
 
 const hostnameColumn = (agents: AgentK8sResource[], t: TFunction): TableRow<Host> => {
@@ -99,7 +99,14 @@ const statusColumn = (
                   </Link>
                 }
               >
-                <Button variant="link" icon={<InfoCircleIcon color={blueInfoColor.value} />}>
+                <Button
+                  variant="link"
+                  icon={
+                    <Icon status="info">
+                      <InfoCircleIcon />
+                    </Icon>
+                  }
+                >
                   {t('ai:Cannot be deleted')}
                 </Button>
               </Popover>

package/lib/common/components/clusterConfiguration/DiscoveryImageConfigForm.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import * as Yup from 'yup';
+import { TFunction } from 'i18next';
 import {
   Button,
   Form,
@@ -17,12 +18,12 @@ import {
   ImageType,
   Proxy,
 } from '@openshift-assisted/types/assisted-installer-service';
+import { AlertFormikError } from '../../../common/components/ui';
 import {
-  AlertFormikError,
   httpProxyValidationSchema,
   noProxyValidationSchema,
   sshPublicKeyValidationSchema,
-} from '../../../common/components/ui';
+} from '../../validationSchemas';
 import { ProxyFieldsType, StatusErrorType } from '../../types';
 import ProxyFields from './ProxyFields';
 import UploadSSH from './UploadSSH';
@@ -55,13 +56,13 @@ export const StaticIPInfo = ({ docVersion }: { docVersion?: string }) => {
 
 export type DiscoveryImageFormValues = ImageCreateParams & ProxyFieldsType;
 
-const getValidationSchema = (allowEmpty: boolean) =>
+const getValidationSchema = (allowEmpty: boolean, t: TFunction) =>
   Yup.lazy((values: DiscoveryImageFormValues) =>
     Yup.object<DiscoveryImageFormValues>().shape({
-      sshPublicKey: sshPublicKeyValidationSchema,
-      httpProxy: httpProxyValidationSchema({ values, pairValueName: 'httpsProxy', allowEmpty }),
-      httpsProxy: httpProxyValidationSchema({ values, pairValueName: 'httpProxy', allowEmpty }), // share the schema, httpS is currently not supported
-      noProxy: noProxyValidationSchema,
+      sshPublicKey: sshPublicKeyValidationSchema(t),
+      httpProxy: httpProxyValidationSchema({ values, pairValueName: 'httpsProxy', allowEmpty, t }),
+      httpsProxy: httpProxyValidationSchema({ values, pairValueName: 'httpProxy', allowEmpty, t }), // share the schema, httpS is currently not supported
+      noProxy: noProxyValidationSchema(t),
     }),
   );
 
@@ -108,7 +109,7 @@ export const DiscoveryImageConfigForm: React.FC<DiscoveryImageConfigFormProps> =
     <Formik
       initialValues={initialValues}
       initialStatus={{ error: null }}
-      validationSchema={getValidationSchema(!!allowEmpty)}
+      validationSchema={getValidationSchema(!!allowEmpty, t)}
       onSubmit={handleSubmit}
     >
       {({ submitForm, isSubmitting, status }) => {

package/lib/common/components/clusterConfiguration/DiscoveryTroubleshootingModal.tsx

@@ -14,9 +14,10 @@ import {
   ModalHeader,
   ModalFooter,
   ModalBody,
+  Icon,
 } from '@patternfly/react-core';
 import { InfoCircleIcon } from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
-import { PrismCode, UiIcon } from '../ui';
+import { PrismCode } from '../ui';
 import { useTranslation } from '../../hooks/use-translation-wrapper';
 import { Trans } from 'react-i18next';
 import { saveAs } from 'file-saver';
@@ -207,7 +208,9 @@ export const HostsNotShowingLink = ({
     <Button variant={ButtonVariant.link} onClick={() => setDiscoveryHintModalOpen(true)} isInline>
       {!isInline && (
         <>
-          <UiIcon size="sm" icon={<InfoCircleIcon />} />
+          <Icon size="sm">
+            <InfoCircleIcon />
+          </Icon>
           &nbsp;
         </>
       )}