@openshift-assisted/ui-lib 2.38.5 → 2.39.0

package/lib/cim/components/ClusterDeployment/index.ts

@@ -4,17 +4,15 @@ export * from './AdditionalNTPSourcesDialogToggle';
 export * from './LogsDownloadButton';
 export * from './wizardTransition';
 export * from './networkConfigurationValidation';
+export * from './ClusterDeploymentWizard';
 
 export { default as ClusterDeploymentValidationsOverview } from './ClusterDeploymentValidationsOverview';
 export { default as ClusterDeploymentDetails } from './ClusterDeploymentDetails';
 export { default as ClusterDeploymentProgress } from './ClusterDeploymentProgress';
 export { default as ClusterDeploymentCredentials } from './ClusterDeploymentCredentials';
 export { default as ClusterDeploymentKubeconfigDownload } from './ClusterDeploymentKubeconfigDownload';
-export { default as ClusterDeploymentWizard } from './ClusterDeploymentWizard';
 export { default as ClusterInstallationError } from './ClusterInstallationError';
 export { default as NetworkConfiguration } from './NetworkConfiguration';
-
 export { default as ACMClusterDeploymentDetailsStep } from './ACMClusterDeploymentDetailsStep';
 
-export { default as ClusterDeploymentCreateProgress } from './ClusterDeploymentCreateProgress';
 export { getTotalCompute } from './ShortCapacitySummary';

package/lib/cim/components/ClusterDeployment/networkConfigurationValidation.ts

@@ -1,17 +1,8 @@
-import * as Yup from 'yup';
 import {
   Cluster,
   ClusterDefaultConfig,
 } from '@openshift-assisted/types/assisted-installer-service';
-import { HostSubnets, NetworkConfigurationValues } from '../../../common/types/clusters';
-import {
-  hostPrefixValidationSchema,
-  hostSubnetValidationSchema,
-  ipBlockValidationSchema,
-  sshPublicKeyValidationSchema,
-  vipValidationSchema,
-} from '../../../common/components/ui';
-
+import { NetworkConfigurationValues } from '../../../common/types/clusters';
 import {
   getSubnetFromMachineNetworkCidr,
   getHostSubnets,
@@ -63,19 +54,3 @@ export const getNetworkInitialValues = (
     networkType: cluster.networkType || NETWORK_TYPE_OVN,
   };
 };
-
-export const getNetworkConfigurationValidationSchema = (
-  initialValues: NetworkConfigurationValues,
-  hostSubnets: HostSubnets,
-) =>
-  Yup.lazy((values: NetworkConfigurationValues) =>
-    Yup.object<NetworkConfigurationValues>().shape({
-      clusterNetworkHostPrefix: hostPrefixValidationSchema(values.clusterNetworkCidr),
-      clusterNetworkCidr: ipBlockValidationSchema(values.serviceNetworkCidr),
-      serviceNetworkCidr: ipBlockValidationSchema(values.clusterNetworkCidr),
-      apiVip: vipValidationSchema(hostSubnets, values, initialValues.apiVip),
-      ingressVip: vipValidationSchema(hostSubnets, values, initialValues.ingressVip),
-      sshPublicKey: sshPublicKeyValidationSchema,
-      hostSubnet: hostSubnetValidationSchema,
-    }),
-  );

package/lib/cim/components/ClusterDeployment/types.ts

@@ -17,14 +17,13 @@ import { BMCFormProps } from '../Agent/types';
 import { AgentMachineK8sResource } from '../Hypershift/types';
 import { AddHostDropdownProps, ProvisioningConfigResult } from '../InfraEnv/types';
 import { AddHostModalProps, EditBMHModalProps, UploadActionModalProps } from '../modals/types';
+import { Host } from '@openshift-assisted/types/assisted-installer-service';
 
 export type EditAgentModalProps = {
-  agent: AgentK8sResource | undefined;
-  isOpen: boolean;
+  agent: AgentK8sResource;
   usedHostnames: string[] | undefined;
   onClose: () => void;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  onSave: (agent: AgentK8sResource, hostname: string) => Promise<any>;
+  onSave: (host: Host, hostname: string) => Promise<unknown>;
 };
 
 export type AgentTableActions = {
@@ -85,7 +84,6 @@ export type ScaleUpFormValues = Omit<
 
 export type ClusterDeploymentDetailsStepProps = ClusterDeploymentDetailsProps & {
   onSaveDetails: (values: ClusterDeploymentDetailsValues) => Promise<unknown>;
-  onClose: () => void;
   isPreviewOpen: boolean;
   isNutanix: boolean;
 };
@@ -98,7 +96,6 @@ export type ClusterDeploymentDetailsNetworkingProps = Pick<
   agentClusterInstall: AgentClusterInstallK8sResource;
   agents: AgentK8sResource[];
   onSaveNetworking: (values: ClusterDeploymentNetworkingValues) => Promise<string | void>;
-  onClose: () => void;
   fetchInfraEnv: (name: string, namespace: string) => Promise<InfraEnvK8sResource>;
   isPreviewOpen: boolean;
   isNutanix: boolean;
@@ -115,7 +112,6 @@ export type ClusterDeploymentHostSelectionStepProps = Omit<
   'onHostSelect' | 'onAutoSelectChange'
 > & {
   onSaveHostsSelection: (values: ClusterDeploymentHostsSelectionValues) => Promise<string | void>;
-  onClose: () => void;
 };
 
 export type ClusterDeploymentHostsDiscoveryStepProps = Omit<
@@ -123,7 +119,6 @@ export type ClusterDeploymentHostsDiscoveryStepProps = Omit<
   'usedHostnames'
 > & {
   onSaveHostsDiscovery: () => Promise<void>;
-  onClose: () => void;
 };
 
 export type ClusterDeploymentWizardProps = {
@@ -146,6 +141,7 @@ export type ClusterDeploymentWizardProps = {
   clusterDeployment: ClusterDeploymentK8sResource;
   agentClusterInstall: AgentClusterInstallK8sResource;
   agents: AgentK8sResource[];
+  bareMetalHosts: BareMetalHostK8sResource[];
   aiConfigMap?: ConfigMapK8sResource;
   infraEnv?: InfraEnvK8sResource;
   infraNMStates: NMStateK8sResource[];
@@ -155,7 +151,8 @@ export type ClusterDeploymentWizardProps = {
   setPreviewOpen: (open: boolean) => void;
   fetchManagedClusters: () => Promise<K8sResourceCommon[]>;
   fetchKlusterletAddonConfig: () => Promise<K8sResourceCommon[]>;
-  onSaveAgent: EditAgentModalProps['onSave'];
+  onChangeHostname: ClusterDeploymentHostsDiscoveryStepProps['onChangeHostname'];
+  onChangeBMHHostname: ClusterDeploymentHostsDiscoveryStepProps['onChangeBMHHostname'];
   onSaveBMH: EditBMHModalProps['onEdit'];
   onSaveISOParams?: AddHostModalProps['onSaveISOParams'];
   onSaveHostsDiscovery: ClusterDeploymentHostsDiscoveryStepProps['onSaveHostsDiscovery'];
@@ -225,7 +222,7 @@ export type ClusterDeploymentHostsDiscoveryProps = AddHostDropdownProps & {
   aiConfigMap?: ConfigMapK8sResource;
   infraNMStates: NMStateK8sResource[];
 
-  onSaveAgent: EditAgentModalProps['onSave'];
+  onChangeHostname: InfraEnvAgentTableProps['onChangeHostname'];
   onEditRole: ClusterDeploymentHostDiscoveryTableProps['onEditRole'];
   onSetInstallationDiskId: AgentTableActions['onSetInstallationDiskId'];
   onSaveBMH: EditBMHModalProps['onEdit'];

package/lib/cim/components/ClusterDeployment/use-networking-formik.ts

@@ -17,7 +17,7 @@ import {
   HostSubnets,
   hostPrefixValidationSchema,
   ipBlockValidationSchema,
-  vipValidationSchema,
+  vipArrayValidationSchema,
   sshPublicKeyValidationSchema,
   hostSubnetValidationSchema,
   httpProxyValidationSchema,
@@ -50,8 +50,8 @@ const getNetworkConfigurationValidationSchema = (
       clusterNetworkHostPrefix: hostPrefixValidationSchema(values.clusterNetworkCidr),
       clusterNetworkCidr: ipBlockValidationSchema(values.serviceNetworkCidr),
       serviceNetworkCidr: ipBlockValidationSchema(values.clusterNetworkCidr),
-      apiVip: vipValidationSchema(hostSubnets, values, initialValues.apiVip),
-      ingressVip: vipValidationSchema(hostSubnets, values, initialValues.ingressVip),
+      apiVips: vipArrayValidationSchema(hostSubnets, values, initialValues.apiVips),
+      ingressVips: vipArrayValidationSchema(hostSubnets, values, initialValues.ingressVips),
       sshPublicKey: sshPublicKeyValidationSchema,
       hostSubnet: hostSubnetValidationSchema,
       httpProxy: httpProxyValidationSchema({ values, pairValueName: 'httpsProxy' }),

package/lib/cim/components/Hypershift/DetailsPage/HypershiftKubeconfigDownload.tsx

@@ -15,8 +15,10 @@ const HypershiftKubeconfigDownload = ({
   fetchSecret,
 }: HypershiftKubeconfigDownloadProps) => {
   const { t } = useTranslation();
+  const kubeconfigSecretName = hostedCluster.status?.customKubeconfig
+    ? hostedCluster.status.customKubeconfig?.name
+    : hostedCluster.status?.kubeconfig?.name;
   const handleKubeconfigDownload = async () => {
-    const kubeconfigSecretName = hostedCluster.status?.kubeconfig?.name;
     const kubeconfigSecretNamespace = hostedCluster.metadata?.namespace;
 
     if (kubeconfigSecretName && kubeconfigSecretNamespace) {
@@ -41,7 +43,7 @@ const HypershiftKubeconfigDownload = ({
       variant={ButtonVariant.secondary}
       // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onClick={handleKubeconfigDownload}
-      isDisabled={!hostedCluster.status?.kubeconfig?.name}
+      isDisabled={!kubeconfigSecretName}
     >
       {t('ai:Download kubeconfig')}
     </Button>

package/lib/cim/components/Hypershift/types.ts

@@ -133,11 +133,11 @@ export type HostedClusterK8sResource = K8sResourceCommon & {
         endpointAccess: 'Public';
         kubeCloudControllerCreds: { name?: string };
         nodePoolManagementCreds: { name?: string };
-        region: 'us-west-2';
+        region: string;
         resourceTags: [
           {
-            key: 'kubernetes.io/cluster/feng-hs-scale-74zxh';
-            value: 'owned';
+            key: string;
+            value: string;
           },
         ];
       };
@@ -157,6 +157,9 @@ export type HostedClusterK8sResource = K8sResourceCommon & {
     kubeconfig?: {
       name: string;
     };
+    customKubeconfig?: {
+      name: string;
+    };
     kubeadminPassword?: {
       name: string;
     };

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

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { Button, Stack, StackItem } from '@patternfly/react-core';
 import { DropdownItem } from '@patternfly/react-core/deprecated';
-import noop from 'lodash-es/noop.js';
 
 import { Host } from '@openshift-assisted/types/assisted-installer-service';
 import {
@@ -33,12 +32,12 @@ import {
 } from '../../../common';
 import { InfraEnvAgentTableProps } from '../ClusterDeployment/types';
 import { MassApproveAgentModal, MassDeleteAgentModal } from '../modals';
-import { MassChangeHostnameModalProps } from '../../../common/components/hosts/MassChangeHostnameModal';
 import MassApproveAction from '../modals/MassApproveAction';
 import { usePagination } from '../../../common/components/hosts/usePagination';
 import InfraTableToolbar from './InfraTableToolbar';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import { agentStatus, bmhStatus } from '../helpers/agentStatus';
+import { onAgentChangeHostname } from '../helpers';
 
 type NoFilterMatchStateProps = {
   onClearFilters: VoidFunction;
@@ -205,19 +204,6 @@ const InfraEnvAgentTable: React.FC<InfraEnvAgentTableProps> = ({
     <DeleteHostAction key="delete" onDeleteHost={() => setMassDeleteOpen(!isMassDeleteOpen)} />,
   ];
 
-  const onAgentChangeHostname: MassChangeHostnameModalProps['onChangeHostname'] = async (
-    host,
-    hostname,
-  ) => {
-    const agent = agents.find((a) => a.metadata?.uid === host.id);
-    if (agent) {
-      return onChangeHostname(agent, hostname);
-    } else {
-      const bmh = bareMetalHosts.find((bmh) => bmh.metadata?.uid === host.id);
-      return bmh ? onChangeBMHHostname(bmh, hostname) : noop;
-    }
-  };
-
   const paginationProps = usePagination(hosts.length);
 
   return (
@@ -272,7 +258,12 @@ const InfraEnvAgentTable: React.FC<InfraEnvAgentTableProps> = ({
           isOpen={isMassChangeHostOpen}
           hosts={hosts}
           selectedHostIDs={selectedHostIDs}
-          onChangeHostname={onAgentChangeHostname}
+          onChangeHostname={onAgentChangeHostname(
+            agents,
+            bareMetalHosts,
+            onChangeHostname,
+            onChangeBMHHostname,
+          )}
           onClose={() => setMassChangeHostOpen(false)}
           canChangeHostname={canChangeHostname(agents, agentStatuses, bareMetalHosts, t)}
         />

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

@@ -49,7 +49,7 @@ import { getErrorMessage } from '../../../common/utils';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import { TFunction } from 'i18next';
 import CpuArchitectureDropdown from '../common/CpuArchitectureDropdown';
-import OpenshiftVersionDropdown from './OpenshiftVersionDropdown';
+import InfraEnvOpenShiftVersionDropdown from './InfraEnvOpenShiftVersionDropdown';
 import { OsImage } from '../../types';
 
 export type EnvironmentStepFormValues = {
@@ -228,7 +228,7 @@ const InfraEnvForm: React.FC<InfraEnvFormProps> = ({
             </Flex>
           </FormGroup>
           <CpuArchitectureDropdown />
-          {!!osImages && <OpenshiftVersionDropdown osImages={osImages} />}
+          {!!osImages && <InfraEnvOpenShiftVersionDropdown osImages={osImages} />}
           <RichInputField
             label={t('ai:Location')}
             name="location"

package/lib/cim/components/InfraEnv/{OpenshiftVersionDropdown.tsx → InfraEnvOpenShiftVersionDropdown.tsx}

@@ -6,7 +6,7 @@ import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import { architectureData, getFieldId, SupportedCpuArchitecture } from '../../../common';
 import { OsImage } from '../../types';
 
-const OpenshiftVersionDropdown = ({ osImages }: { osImages: OsImage[] }) => {
+const InfraEnvOpenShiftVersionDropdown = ({ osImages }: { osImages: OsImage[] }) => {
   const { t } = useTranslation();
   const [{ name, value }, , { setValue }] = useField<string>('osImageVersion');
   const [{ value: cpuArchitecture }] = useField<string>('cpuArchitecture');
@@ -69,4 +69,4 @@ const OpenshiftVersionDropdown = ({ osImages }: { osImages: OsImage[] }) => {
   );
 };
 
-export default OpenshiftVersionDropdown;
+export default InfraEnvOpenShiftVersionDropdown;

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

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { FormGroup } from '@patternfly/react-core';
-import { Dropdown, DropdownItem, DropdownToggle } from '@patternfly/react-core/deprecated';
+import { Dropdown, DropdownItem, FormGroup, MenuToggle } from '@patternfly/react-core';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
 import {
   architectureData,
@@ -12,30 +11,18 @@ import {
 import { useField } from 'formik';
 import { useFormikHelpers } from '../../../common/hooks/useFormikHelpers';
 
-const allDropdownItems = {
-  [CpuArchitecture.x86]: (
-    <DropdownItem key={'x86_64'} id="x86_64" description={architectureData['x86_64'].description}>
-      {architectureData['x86_64'].label}
-    </DropdownItem>
-  ),
-  [CpuArchitecture.ARM]: (
-    <DropdownItem key={'arm64'} id="arm64" description={architectureData['arm64'].description}>
-      {architectureData['arm64'].label}
-    </DropdownItem>
-  ),
-  [CpuArchitecture.s390x]: (
-    <DropdownItem key={'s390x'} id="s390x" description={architectureData['s390x'].description}>
-      {architectureData['s390x'].label}
-    </DropdownItem>
-  ),
-};
+const cimCpuArchitectures = [
+  CpuArchitecture.x86,
+  CpuArchitecture.ARM,
+  CpuArchitecture.s390x,
+] as SupportedCpuArchitecture[];
 
 const CpuArchitectureDropdown = ({
   isDisabled = false,
   cpuArchitectures,
 }: {
   isDisabled?: boolean;
-  cpuArchitectures?: string[];
+  cpuArchitectures?: SupportedCpuArchitecture[];
 }) => {
   const { t } = useTranslation();
   const [{ name, value }, , { setValue }] = useField<SupportedCpuArchitecture | ''>(
@@ -45,7 +32,7 @@ const CpuArchitectureDropdown = ({
   const fieldId = getFieldId(name, 'input');
   const { setValue: setUserManagedNetworking } = useFormikHelpers<boolean>('userManagedNetworking');
 
-  const onCpuArchSelect = (e?: React.SyntheticEvent<HTMLDivElement>) => {
+  const onCpuArchSelect = (e?: React.MouseEvent<Element, MouseEvent>) => {
     const val = e?.currentTarget.id as SupportedCpuArchitecture;
     setValue(val);
     setUserManagedNetworking(val === CpuArchitecture.s390x);
@@ -53,36 +40,60 @@ const CpuArchitectureDropdown = ({
     setCpuArchOpen(false);
   };
 
-  const dropdownItems = React.useMemo(() => {
-    if (!cpuArchitectures) {
-      return Object.values(allDropdownItems);
-    } else {
-      return Object.entries(allDropdownItems)
-        .filter(([key, _]) => cpuArchitectures.includes(key))
-        .map(([_, val]) => val);
-    }
-  }, [cpuArchitectures]);
+  const dropdownItems = React.useMemo(
+    () =>
+      cimCpuArchitectures.map((arch) => {
+        const isItemEnabled = !cpuArchitectures || cpuArchitectures.includes(arch);
+        const disabledReason = t(
+          'ai:This option is not available with the selected OpenShift version',
+        );
+        return (
+          <DropdownItem
+            key={arch}
+            id={arch}
+            isAriaDisabled={!isItemEnabled}
+            selected={arch === value}
+            description={architectureData[arch].description}
+            tooltipProps={{ content: disabledReason, position: 'top' }}
+            onClick={(e: React.MouseEvent) => e.preventDefault()}
+          >
+            {architectureData[arch].label}
+          </DropdownItem>
+        );
+      }),
+    [cpuArchitectures, t, value],
+  );
 
   React.useEffect(() => {
     if (!isDisabled && value !== '' && cpuArchitectures && !cpuArchitectures?.includes(value)) {
-      setValue('');
+      const defaultVal = cpuArchitectures?.[0] || CpuArchitecture.x86;
+      setValue(defaultVal);
     }
   }, [cpuArchitectures, isDisabled, setValue, value]);
 
   return !isDisabled ? (
-    <FormGroup isInline fieldId={fieldId} label={t('ai:CPU architecture')} isRequired>
+    <FormGroup
+      isInline
+      fieldId={fieldId}
+      label={t('ai:CPU architecture')}
+      isRequired
+      name={'cpuArchiteture'}
+    >
       <Dropdown
-        toggle={
-          <DropdownToggle onToggle={() => setCpuArchOpen(!cpuArchOpen)} className="pf-u-w-100">
+        toggle={(toggleRef) => (
+          <MenuToggle
+            ref={toggleRef}
+            onClick={() => setCpuArchOpen(!cpuArchOpen)}
+            className="pf-u-w-100"
+          >
             {value ? architectureData[value].label : t('ai:CPU architecture')}
-          </DropdownToggle>
-        }
-        name="cpuArchitecture"
+          </MenuToggle>
+        )}
         isOpen={cpuArchOpen}
         onSelect={onCpuArchSelect}
-        dropdownItems={dropdownItems}
-        className="pf-u-w-100"
-      />
+      >
+        {dropdownItems}
+      </Dropdown>
     </FormGroup>
   ) : (
     <StaticField name={'cpuArchitecture'} label={t('ai:CPU architecture')} isRequired>

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

@@ -1,7 +1,7 @@
 import { AgentStatus, getAgentStatusKey } from './status';
 import { Host } from '@openshift-assisted/types/assisted-installer-service';
 import { AgentK8sResource, BareMetalHostK8sResource } from '../../types';
-import { INFRAENV_AGENTINSTALL_LABEL_KEY } from '../common/constants';
+import { AGENT_BMH_NAME_LABEL_KEY, INFRAENV_AGENTINSTALL_LABEL_KEY } from '../common/constants';
 
 const AGENT_FOR_SELECTION_STATUSES: AgentStatus[] = [
   'known',
@@ -33,3 +33,32 @@ export const getInfraEnvNameOfAgent = (resource?: AgentK8sResource | BareMetalHo
 
 export const getClusterNameOfAgent = (agent?: AgentK8sResource) =>
   agent?.spec?.clusterDeploymentName?.name;
+
+type OnAgentChangeHostname<A = AgentK8sResource, B = BareMetalHostK8sResource> = (
+  agents: A[],
+  bmhs: B[],
+  onChangeHostname: (agent: A, hostname: string) => Promise<unknown>,
+  onChangeBMHHostname: (bmh: B, hostname: string) => Promise<unknown>,
+) => (host: Host, hostname: string) => Promise<unknown>;
+
+export const onAgentChangeHostname: OnAgentChangeHostname<
+  AgentK8sResource,
+  BareMetalHostK8sResource
+> = (agents, bmhs, onChangeHostname, onChangeBMHHostname) => (host, hostname) => {
+  const agent = agents.find((a) => a.metadata?.uid === host.id);
+  let bmh: BareMetalHostK8sResource | undefined;
+  if (agent) {
+    const bmhName = agent.metadata?.labels?.[AGENT_BMH_NAME_LABEL_KEY];
+    if (!bmhName) {
+      return onChangeHostname(agent, hostname);
+    }
+    // If Agent is backed by BMH, we need to update hostname on BMH
+    bmh = bmhs.find(
+      (bmh) =>
+        bmh.metadata?.namespace === agent.metadata?.namespace && bmh.metadata?.name === bmhName,
+    );
+  } else {
+    bmh = bmhs.find((bmh) => bmh.metadata?.uid === host.id);
+  }
+  return bmh ? onChangeBMHHostname(bmh, hostname) : Promise.resolve(undefined);
+};

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

@@ -135,14 +135,18 @@ export const getAICluster = ({
     name: clusterDeployment.spec?.clusterName,
     baseDnsDomain: clusterDeployment.spec?.baseDomain,
     openshiftVersion: installVersion,
-    apiVips: [
-      {
-        ip: agentClusterInstall?.status?.apiVIP || agentClusterInstall?.spec?.apiVIP,
-      },
-    ],
-    ingressVips: [
-      { ip: agentClusterInstall?.status?.ingressVIP || agentClusterInstall?.spec?.apiVIP },
-    ],
+    apiVips:
+      agentClusterInstall?.status?.apiVIP || agentClusterInstall?.spec?.apiVIP
+        ? [
+            {
+              ip: agentClusterInstall?.status?.apiVIP || agentClusterInstall?.spec?.apiVIP,
+            },
+          ]
+        : [],
+    ingressVips:
+      agentClusterInstall?.status?.ingressVIP || agentClusterInstall?.spec?.ingressVIP
+        ? [{ ip: agentClusterInstall?.status?.ingressVIP || agentClusterInstall?.spec?.ingressVIP }]
+        : [],
     highAvailabilityMode:
       agentClusterInstall?.spec?.provisionRequirements?.controlPlaneAgents === 1 ? 'None' : 'Full',
     status,

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

@@ -6,11 +6,18 @@ import {
   ClusterVersionK8sResource,
   OsImage,
 } from '../../types';
-import { OpenshiftVersionOptionType } from '../../../common';
+import { CpuArchitecture, OpenshiftVersionOptionType } from '../../../common';
 import { OpenshiftVersion } from '@openshift-assisted/types/assisted-installer-service';
 
 export const getVersionFromReleaseImage = (releaseImage = '') => {
-  const match = /.+:(.*)-/gm.exec(releaseImage);
+  const match = /.+:(.*)/gm.exec(releaseImage);
+  if (match && match.length > 1 && match[1]) {
+    return match[1];
+  }
+};
+
+const getCPUArchFromReleaseImage = (releaseImage = '') => {
+  const match = /.+:.*-(.*)/gm.exec(releaseImage);
   if (match && match.length > 1 && match[1]) {
     return match[1];
   }
@@ -37,8 +44,12 @@ const getSupportLevelFromChannel = (
 
 export const supportedNutanixPlatforms = ['x86_64', 'x86-64'];
 
-export const isValidImageSet = (cis: ClusterImageSetK8sResource, architectures?: string[]) => {
-  if (cis.metadata?.labels?.visible !== 'true') {
+export const isValidImageSet = (
+  cis: ClusterImageSetK8sResource,
+  architectures?: string[],
+  extended?: boolean,
+) => {
+  if (!extended && cis.metadata?.labels?.visible !== 'true') {
     return false;
   }
   if (!architectures) {
@@ -53,6 +64,7 @@ export const getOCPVersions = (
   clusterImageSets: ClusterImageSetK8sResource[],
   isNutanix?: boolean | undefined,
   osImages?: OsImage[],
+  extended?: boolean,
 ): OpenshiftVersionOptionType[] => {
   const ocpImageVersions = Array.from(
     new Set(osImages?.map((osImage) => osImage.openshiftVersion)),
@@ -60,10 +72,11 @@ export const getOCPVersions = (
 
   const versions = clusterImageSets
     .filter((clusterImageSet) =>
-      isValidImageSet(clusterImageSet, isNutanix ? supportedNutanixPlatforms : undefined),
+      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 || '',
@@ -71,6 +84,7 @@ export const getOCPVersions = (
         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) => {
@@ -99,7 +113,7 @@ export const getSelectedVersion = (
   );
 
   return selectedClusterImage
-    ? getOCPVersions([selectedClusterImage])?.[0]?.version
+    ? getOCPVersions([selectedClusterImage], undefined, undefined, true)?.[0]?.version
     : agentClusterInstall?.spec?.imageSetRef?.name;
 };
 

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

@@ -7,11 +7,12 @@ const EditAgentModal: React.FC<EditAgentModalProps> = ({ agent, onSave, ...rest
   const [host] = agent ? getAIHosts([agent]) : [];
   return (
     <EditHostModal
+      isOpen
       host={host}
       inventory={agent?.status?.inventory}
       {...rest}
       onSave={async ({ hostname }) => {
-        agent && (await onSave(agent, hostname));
+        agent && (await onSave(host, hostname));
         rest.onClose();
       }}
     />

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

@@ -25,6 +25,8 @@ import EditAgentModal from './EditAgentModal';
 import { getAgentsHostsNames } from '../ClusterDeployment/helpers';
 import { getErrorMessage } from '../../../common/utils';
 import { useTranslation } from '../../../common/hooks/use-translation-wrapper';
+import { onAgentChangeHostname } from '../helpers';
+import { BareMetalHostK8sResource } from '../../types';
 
 const getAgentsToAdd = (
   selectedHostIds: ScaleUpFormValues['selectedHostIds'] | ScaleUpFormValues['autoSelectedHostIds'],
@@ -56,7 +58,9 @@ type ScaleUpModalProps = {
   addHostsToCluster: (agentsToAdd: AgentK8sResource[]) => Promise<void>;
   clusterDeployment: ClusterDeploymentK8sResource;
   agents: AgentK8sResource[];
+  bareMetalHosts: BareMetalHostK8sResource[];
   onChangeHostname: (agent: AgentK8sResource, hostname: string) => Promise<AgentK8sResource>;
+  onChangeBMHHostname: (bmh: BareMetalHostK8sResource, hostname: string) => Promise<unknown>;
   onSetInstallationDiskId: AgentTableActions['onSetInstallationDiskId'];
   isNutanix: boolean;
 };
@@ -67,7 +71,9 @@ const ScaleUpModal: React.FC<ScaleUpModalProps> = ({
   addHostsToCluster,
   clusterDeployment,
   agents,
+  bareMetalHosts,
   onChangeHostname,
+  onChangeBMHHostname,
   onSetInstallationDiskId,
   isNutanix,
 }) => {
@@ -176,9 +182,13 @@ const ScaleUpModal: React.FC<ScaleUpModalProps> = ({
       {editAgent && (
         <EditAgentModal
           agent={editAgent}
-          isOpen
           onClose={() => setEditAgent(undefined)}
-          onSave={onChangeHostname}
+          onSave={onAgentChangeHostname(
+            agents,
+            bareMetalHosts,
+            onChangeHostname,
+            onChangeBMHHostname,
+          )}
           usedHostnames={getAgentsHostsNames(clusterAgents)}
         />
       )}

package/lib/common/api/index.ts

@@ -1,2 +1,3 @@
 export * from './axiosClient';
 export * from './utils';
+export * from './assisted-service';