@openshift-assisted/ui-lib 2.56.1 → 2.56.2

package/lib/ocm/components/wizard/steps/staticIp/components/FormViewNetworkWide/FormViewNetworkWideFields.tsx

@@ -23,7 +23,12 @@ import {
   PopoverIcon,
   useFieldErrorMsg,
 } from '../../../../../../../common';
-import { OcmCheckboxField, OcmInputField, OcmRadioField } from '../../../../../ui/OcmFormFields';
+import {
+  OcmCheckboxField,
+  OcmInputField,
+  OcmRadio,
+  OcmRadioField,
+} from '../../../../../ui/OcmFormFields';
 import {
   getAddressObject,
   getProtocolVersionLabel,
@@ -36,13 +41,16 @@ import {
   ProtocolVersion,
   StaticProtocolType,
   getMachineNetworkCidr,
+  DISCONNECTED_SINGLE_STACK_FIELD,
 } from '../../data';
+import { detectProtocolVersionFromIp } from '../../commonValidationSchemas';
 import {
   MIN_PREFIX_LENGTH,
   MAX_PREFIX_LENGTH,
   MAX_VLAN_ID,
   MIN_VLAN_ID,
 } from './formViewNetworkWideValidationSchema';
+import { useClusterWizardContext } from '../../../../clusterWizardContext';
 
 import '../staticIp.css';
 
@@ -127,6 +135,92 @@ const MachineNetwork: React.FC<{ fieldName: string; protocolVersion: ProtocolVer
   );
 };
 
+const SingleStackMachineNetwork: React.FC<{ fieldName: string }> = ({ fieldName }) => {
+  const [{ value }] = useField<Cidr>(fieldName);
+  const ipFieldName = `${fieldName}.ip`;
+  const prefixLengthFieldName = `${fieldName}.prefixLength`;
+  const ipErrorMessage = useFieldErrorMsg({ name: ipFieldName });
+  const prefixLengthErrorMessage = useFieldErrorMsg({ name: prefixLengthFieldName });
+  const errorMessage = ipErrorMessage || prefixLengthErrorMessage;
+  const protocolVersion = detectProtocolVersionFromIp(value.ip) ?? ProtocolVersion.ipv4;
+  const machineNetworkHelptext = React.useMemo(() => {
+    if (errorMessage) {
+      return '';
+    }
+    const cidr = getMachineNetworkCidr(value);
+    return getHumanizedSubnetRange(getAddressObject(cidr, protocolVersion));
+  }, [value, protocolVersion, errorMessage]);
+  const fieldId = getFieldId(`${fieldName}`, 'input');
+  return (
+    <FormGroup
+      labelHelp={
+        <PopoverIcon noVerticalAlign bodyContent="The range of IP addresses of the hosts." />
+      }
+      label="Subnet"
+      fieldId={fieldId}
+      isRequired
+      className="subnet"
+    >
+      <Flex>
+        <FlexItem spacer={{ default: 'spacerSm' }}>
+          <OcmInputField
+            name={`${fieldName}.ip`}
+            isRequired={true}
+            data-testid="single-stack-machine-network-ip"
+            showErrorMessage={false}
+          />
+        </FlexItem>
+        <FlexItem spacer={{ default: 'spacerSm' }}>{'/'}</FlexItem>
+        <FlexItem>
+          <OcmInputField
+            name={`${fieldName}.prefixLength`}
+            isRequired={true}
+            data-testid="single-stack-machine-network-prefix-length"
+            type={TextInputTypes.number}
+            showErrorMessage={false}
+            min={MIN_PREFIX_LENGTH}
+            max={MAX_PREFIX_LENGTH.ipv6}
+          />
+        </FlexItem>
+      </Flex>
+      {(errorMessage || machineNetworkHelptext) && (
+        <FormHelperText>
+          <HelperText>
+            <HelperTextItem
+              icon={errorMessage ? <ExclamationCircleIcon /> : null}
+              variant={errorMessage ? 'error' : 'default'}
+              id={errorMessage ? `${fieldId}-helper-error` : `${fieldId}-helper`}
+              data-testid={`input-machine-network-${fieldId}-helper-text`}
+            >
+              {errorMessage ? errorMessage : machineNetworkHelptext}
+            </HelperTextItem>
+          </HelperText>
+        </FormHelperText>
+      )}
+    </FormGroup>
+  );
+};
+
+const SingleStackIpConfigFields: React.FC<{ fieldName: string }> = ({ fieldName }) => {
+  return (
+    <Grid hasGutter>
+      <SingleStackMachineNetwork fieldName={`${fieldName}.machineNetwork`} />
+      <OcmInputField
+        isRequired
+        label="Default gateway"
+        labelIcon={
+          <PopoverIcon
+            noVerticalAlign
+            bodyContent="An IP address to where any IP packet should be forwarded in case there is no other routing rule configured for a destination IP."
+          />
+        }
+        name={`${fieldName}.gateway`}
+        data-testid="single-stack-gateway"
+      />
+    </Grid>
+  );
+};
+
 const IpConfigFields: React.FC<{
   fieldName: string;
   protocolVersion: ProtocolVersion;
@@ -155,7 +249,7 @@ const ipv6ValuesEmpty = (values: FormViewNetworkWideValues) =>
   values.ipConfigs.ipv6.machineNetwork.ip === '' &&
   values.ipConfigs.ipv6.machineNetwork.prefixLength === '';
 
-export const ProtocolTypeSelect = () => {
+const ConnectedProtocolTypeSelect = () => {
   const selectFieldName = 'protocolType';
   const [{ value: protocolType }, , { setValue: setProtocolType }] =
     useField<StaticProtocolType>(selectFieldName);
@@ -171,7 +265,6 @@ export const ProtocolTypeSelect = () => {
     if (newProtocolType === 'ipv4' && !ipv6ValuesEmpty(values)) {
       setConfirmModal(true);
     } else {
-      //no need to empty ipv4, when switching back dual stack ipv4 remains as is
       setIpv6(getEmptyIpConfig());
       setProtocolType(newProtocolType);
     }
@@ -239,6 +332,99 @@ export const ProtocolTypeSelect = () => {
           }}
           onConfirm={() => {
             setConfirmModal(false);
+            setIpv6(getEmptyIpConfig());
+            setProtocolType('ipv4');
+          }}
+        />
+      )}
+    </>
+  );
+};
+
+const DisconnectedProtocolTypeSelect = () => {
+  const selectFieldName = 'protocolType';
+  const [{ value: protocolType }, , { setValue: setProtocolType }] =
+    useField<StaticProtocolType>(selectFieldName);
+  const [, , { setValue: setIpv6 }] = useField<IpConfig>(`ipConfigs.ipv6`);
+  const [openConfirmModal, setConfirmModal] = React.useState(false);
+  const { values } = useFormikContext<FormViewNetworkWideValues>();
+
+  const isDualStack = protocolType === 'dualStack';
+  const singleStackRadioId = getFieldId(selectFieldName, 'radio', 'singleStack');
+  const dualStackRadioId = getFieldId(selectFieldName, 'radio', 'dualStack');
+
+  const switchToSingleStack = () => {
+    if (protocolType !== 'dualStack') {
+      return;
+    }
+    if (!ipv6ValuesEmpty(values)) {
+      setConfirmModal(true);
+      return;
+    }
+    setIpv6(getEmptyIpConfig());
+    setProtocolType('ipv4');
+  };
+
+  const switchToDualStack = () => {
+    if (protocolType === 'dualStack') {
+      return;
+    }
+    setProtocolType('dualStack');
+  };
+
+  return (
+    <>
+      <FormGroup
+        fieldId={getFieldId(selectFieldName, 'radio')}
+        isInline
+        label="Networking stack type"
+        isRequired
+      >
+        <OcmRadio
+          id={singleStackRadioId}
+          name={`${selectFieldName}-stack-level`}
+          data-testid="select-single-stack"
+          label={
+            <>
+              {'Single stack\u00A0'}
+              <PopoverIcon
+                noVerticalAlign
+                bodyContent="Use either IPv4 or IPv6 for all network-wide and host addresses. The address family is determined from the subnet you enter below."
+              />
+            </>
+          }
+          isChecked={!isDualStack}
+          onChange={() => switchToSingleStack()}
+        />
+        <OcmRadio
+          id={dualStackRadioId}
+          name={`${selectFieldName}-stack-level`}
+          data-testid="select-dual-stack"
+          label={
+            <>
+              {'Dual-stack'}{' '}
+              <PopoverIcon
+                noVerticalAlign
+                bodyContent="Select dual-stack when your hosts are using IPV4 together with IPV6."
+              />
+            </>
+          }
+          isChecked={isDualStack}
+          onChange={() => switchToDualStack()}
+        />
+      </FormGroup>
+
+      {openConfirmModal && (
+        <ConfirmationModal
+          title={'Change networking stack type?'}
+          titleIconVariant={'warning'}
+          confirmationButtonText={'Change'}
+          confirmationButtonVariant={ButtonVariant.primary}
+          content={<p>All data and configuration done for &apos;Dual-stack&apos; will be lost.</p>}
+          onClose={() => setConfirmModal(false)}
+          onConfirm={() => {
+            setConfirmModal(false);
+            setIpv6(getEmptyIpConfig());
             setProtocolType('ipv4');
           }}
         />
@@ -246,8 +432,30 @@ export const ProtocolTypeSelect = () => {
     </>
   );
 };
+
+export const ProtocolTypeSelect = () => {
+  const { installDisconnected } = useClusterWizardContext();
+  if (installDisconnected) {
+    return <DisconnectedProtocolTypeSelect />;
+  }
+  return <ConnectedProtocolTypeSelect />;
+};
+const getIpConfigSectionLabel = (
+  protocolVersion: ProtocolVersion,
+  protocolType: StaticProtocolType,
+  installDisconnected: boolean,
+): string => {
+  if (installDisconnected && protocolType !== 'dualStack') {
+    return 'Single stack';
+  }
+  return getProtocolVersionLabel(protocolVersion);
+};
+
 export const FormViewNetworkWideFields = ({ hosts }: { hosts: FormViewHost[] }) => {
+  const { installDisconnected } = useClusterWizardContext();
   const { values, setFieldValue } = useFormikContext<FormViewNetworkWideValues>();
+  const isDisconnectedSingleStack = installDisconnected && values.protocolType !== 'dualStack';
+
   return (
     <>
       <Content>
@@ -297,18 +505,28 @@ export const FormViewNetworkWideFields = ({ hosts }: { hosts: FormViewHost[] })
         helperText={'List of your DNS server addresses, separated by commas.'}
       />
 
-      {getShownProtocolVersions(values.protocolType).map((protocolVersion) => (
-        <FormGroup
-          key={protocolVersion}
-          label={getProtocolVersionLabel(protocolVersion)}
-          fieldId={getFieldId(`ip-configs-${protocolVersion}`, 'input')}
-        >
-          <IpConfigFields
-            fieldName={`ipConfigs.${protocolVersion}`}
-            protocolVersion={protocolVersion}
-          />
+      {isDisconnectedSingleStack ? (
+        <FormGroup label="Single stack" fieldId={getFieldId('ip-configs-single-stack', 'input')}>
+          <SingleStackIpConfigFields fieldName={`ipConfigs.${DISCONNECTED_SINGLE_STACK_FIELD}`} />
         </FormGroup>
-      ))}
+      ) : (
+        getShownProtocolVersions(values.protocolType).map((protocolVersion) => (
+          <FormGroup
+            key={protocolVersion}
+            label={getIpConfigSectionLabel(
+              protocolVersion,
+              values.protocolType,
+              installDisconnected,
+            )}
+            fieldId={getFieldId(`ip-configs-${protocolVersion}`, 'input')}
+          >
+            <IpConfigFields
+              fieldName={`ipConfigs.${protocolVersion}`}
+              protocolVersion={protocolVersion}
+            />
+          </FormGroup>
+        ))
+      )}
     </>
   );
 };

package/lib/ocm/components/wizard/steps/staticIp/components/FormViewNetworkWide/disconnectedNetworkWideValidationSchema.tsx

@@ -0,0 +1,98 @@
+import * as Yup from 'yup';
+import { IpConfig, FormViewNetworkWideValues, Cidr } from '../../data';
+import {
+  detectProtocolVersionFromIp,
+  getDnsMatchingSubnetFamilyValidationSchema,
+  getFamilyAgnosticIpValidationSchema,
+  isNotReservedHostIPAddress,
+} from '../../commonValidationSchemas';
+import {
+  buildNetworkWideValidationSchema,
+  getInMachineNetworkValidationSchema,
+  getIsNotNetworkOrBroadcastAddressSchema,
+  getIPValidationSchema,
+  MAX_PREFIX_LENGTH,
+  MIN_PREFIX_LENGTH,
+  validateNumber,
+  MAX_VLAN_ID,
+  MUST_BE_A_NUMBER,
+} from './formViewNetworkWideValidationSchema';
+
+const REQUIRED_MESSAGE = 'A value is required';
+
+const transformNumber = (originalValue: number) => {
+  return isNaN(originalValue) ? null : originalValue;
+};
+
+const getDisconnectedSingleStackMachineNetworkSchema = (subnetIp: string) =>
+  Yup.object<Cidr>().shape({
+    ip: getFamilyAgnosticIpValidationSchema().required(REQUIRED_MESSAGE),
+    prefixLength: Yup.number()
+      .required('Prefix length is required')
+      .min(MIN_PREFIX_LENGTH, `Prefix length must be more than or equal to ${MIN_PREFIX_LENGTH}`)
+      .test(
+        'prefix-length-family',
+        `Prefix length must be less than or equal to ${MAX_PREFIX_LENGTH.ipv6}`,
+        (prefixLength) => {
+          if (prefixLength === undefined || prefixLength === null) {
+            return true;
+          }
+          const family = detectProtocolVersionFromIp(subnetIp);
+          const max = family ? MAX_PREFIX_LENGTH[family] : MAX_PREFIX_LENGTH.ipv6;
+          return prefixLength <= max;
+        },
+      )
+      .transform(transformNumber) as Yup.NumberSchema,
+  });
+
+const getDisconnectedSingleStackIpConfigSchema = (ipConfig: IpConfig) => {
+  const subnetIp = ipConfig.machineNetwork.ip;
+  const family = detectProtocolVersionFromIp(subnetIp);
+
+  const gatewaySchema = family
+    ? getIPValidationSchema(family)
+        .concat(getInMachineNetworkValidationSchema(family, ipConfig.machineNetwork))
+        .concat(getIsNotNetworkOrBroadcastAddressSchema(family, ipConfig.machineNetwork))
+    : getFamilyAgnosticIpValidationSchema()
+        .required(REQUIRED_MESSAGE)
+        .concat(isNotReservedHostIPAddress());
+
+  return Yup.object({
+    machineNetwork: getDisconnectedSingleStackMachineNetworkSchema(subnetIp),
+    gateway: gatewaySchema,
+  });
+};
+
+const buildDisconnectedSingleStackValidationSchema = (values: FormViewNetworkWideValues) => {
+  const subnetIp = values.ipConfigs.ipv4.machineNetwork.ip;
+
+  return Yup.object({
+    useVlan: Yup.boolean(),
+    vlanId: Yup.mixed().when('useVlan', {
+      is: (useVlan: boolean) => useVlan,
+      then: () =>
+        Yup.number()
+          .required(MUST_BE_A_NUMBER)
+          .min(1, `Must be more than or equal to 1`)
+          .max(MAX_VLAN_ID, `Must be less than or equal to ${MAX_VLAN_ID}`)
+          .test('not-number', MUST_BE_A_NUMBER, () => validateNumber(values.vlanId))
+          .nullable()
+          .transform(transformNumber) as Yup.NumberSchema,
+    }),
+    protocolType: Yup.string(),
+    dns: getDnsMatchingSubnetFamilyValidationSchema(subnetIp),
+    ipConfigs: Yup.object({
+      ipv4: getDisconnectedSingleStackIpConfigSchema(values.ipConfigs.ipv4),
+      ipv6: Yup.object<IpConfig>(),
+    }),
+  });
+};
+
+export const disconnectedNetworkWideValidationSchema = Yup.lazy(
+  (values: FormViewNetworkWideValues) => {
+    if (values.protocolType === 'dualStack') {
+      return buildNetworkWideValidationSchema(values);
+    }
+    return buildDisconnectedSingleStackValidationSchema(values);
+  },
+);

package/lib/ocm/components/wizard/steps/staticIp/components/FormViewNetworkWide/formViewNetworkWideValidationSchema.tsx

@@ -19,7 +19,7 @@ import {
 } from '../../commonValidationSchemas';
 
 const REQUIRED_MESSAGE = 'A value is required';
-const MUST_BE_A_NUMBER = 'Must be a number';
+export const MUST_BE_A_NUMBER = 'Must be a number';
 const ONLY_DIGITS_REGEX = /^\d+$/;
 
 export const MIN_PREFIX_LENGTH = 1;
@@ -68,7 +68,7 @@ const getMachineNetworkValidationSchema = (protocolVersion: ProtocolVersion) =>
       .transform(transformNumber) as Yup.NumberSchema, //add casting to not get typescript error caused by nullable
   });
 
-const getIPValidationSchema = (protocolVersion: ProtocolVersion) => {
+export const getIPValidationSchema = (protocolVersion: ProtocolVersion) => {
   return getIpAddressValidationSchema(protocolVersion)
     .required(REQUIRED_MESSAGE)
     .concat(isNotReservedHostIPAddress(protocolVersion));
@@ -80,6 +80,11 @@ const getDNSValidationSchema = (protocolType: StaticProtocolType) => {
       .required(REQUIRED_MESSAGE)
       .concat(isNotReservedHostDNSAddress());
   }
+  if (protocolType === 'ipv6') {
+    return getMultipleIpAddressValidationSchema(ProtocolVersion.ipv6)
+      .required(REQUIRED_MESSAGE)
+      .concat(isNotReservedHostDNSAddress(ProtocolVersion.ipv6));
+  }
   return getMultipleIpAddressValidationSchema(ProtocolVersion.ipv4)
     .required(REQUIRED_MESSAGE)
     .concat(isNotReservedHostDNSAddress(ProtocolVersion.ipv4));
@@ -94,9 +99,11 @@ const getAddressDataValidationSchema = (protocolVersion: ProtocolVersion, ipConf
   });
 };
 
-export const networkWideValidationSchema = Yup.lazy((values: FormViewNetworkWideValues) => {
+export const buildNetworkWideValidationSchema = (values: FormViewNetworkWideValues) => {
   const ipConfigsValidationSchemas = Yup.object({
-    ipv4: getAddressDataValidationSchema(ProtocolVersion.ipv4, values.ipConfigs.ipv4),
+    ipv4: showProtocolVersion(values.protocolType, ProtocolVersion.ipv4)
+      ? getAddressDataValidationSchema(ProtocolVersion.ipv4, values.ipConfigs.ipv4)
+      : Yup.object<IpConfig>(),
     ipv6: showProtocolVersion(values.protocolType, ProtocolVersion.ipv6)
       ? getAddressDataValidationSchema(ProtocolVersion.ipv6, values.ipConfigs.ipv6)
       : Yup.object<IpConfig>(),
@@ -119,7 +126,9 @@ export const networkWideValidationSchema = Yup.lazy((values: FormViewNetworkWide
     dns: getDNSValidationSchema(values.protocolType),
     ipConfigs: ipConfigsValidationSchemas,
   });
-});
+};
+
+export const networkWideValidationSchema = Yup.lazy(buildNetworkWideValidationSchema);
 
 export const validateNumber = (vlanId: FormViewNetworkWideValues['vlanId']) => {
   //We need to validate that value is a number(without letters) and is not an exponential number (ex: 1e2)

package/lib/ocm/components/wizard/steps/staticIp/components/StaticIpPage.tsx

@@ -95,8 +95,10 @@ export const StaticIpPage: React.FC<StaticIpPageProps> = ({
       <GridItem>
         <ClusterWizardStepHeader>Static network configurations</ClusterWizardStepHeader>
         <Content component={ContentVariants.small}>
-          Network configuration can be done using either the form view or YAML view. Configurations
-          done in this step are for discovering hosts.
+          Network configuration can be done using either the form view or YAML view.
+          {clusterWizardContext.installDisconnected
+            ? ' Configurations done in this step are for hosts.'
+            : ' Configurations done in this step are for discovering hosts.'}
         </Content>
       </GridItem>
 
@@ -108,7 +110,10 @@ export const StaticIpPage: React.FC<StaticIpPageProps> = ({
           onChangeView={onChangeView}
         />
       )}
-      {initialStaticIpInfo.isDataComplete && isoRegenerationAlert}
+      {/* Disconnected flow has no Host discovery step; the ISO is generated at the end */}
+      {!clusterWizardContext.installDisconnected &&
+        initialStaticIpInfo.isDataComplete &&
+        isoRegenerationAlert}
       {content}
     </Grid>
   );

package/lib/ocm/components/wizard/steps/staticIp/data/dataTypes.ts

@@ -10,7 +10,7 @@ export enum ProtocolVersion {
   ipv6 = 'ipv6',
 }
 
-export type StaticProtocolType = 'ipv4' | 'dualStack';
+export type StaticProtocolType = 'ipv4' | 'ipv6' | 'dualStack';
 
 export type Cidr = {
   ip: string;

package/lib/ocm/components/wizard/steps/staticIp/data/disconnectedNetworkWide.ts

@@ -0,0 +1,81 @@
+import { Address4, Address6 } from 'ip-address';
+import { InfraEnv } from '@openshift-assisted/types/assisted-installer-service';
+import { FormViewNetworkWideValues, ProtocolVersion } from './dataTypes';
+import { getEmptyIpConfig } from './emptyData';
+import { getFormViewNetworkWideValues } from './fromInfraEnv';
+import { networkWideToInfraEnvField } from './formDataToInfraEnvField';
+
+export const DISCONNECTED_SINGLE_STACK_FIELD = ProtocolVersion.ipv4;
+
+const isIpv6OnlyAddress = (ip: string): boolean => Address6.isValid(ip) && !Address4.isValid(ip);
+
+export const normalizeDisconnectedNetworkWideForLoad = (
+  values: FormViewNetworkWideValues,
+): FormViewNetworkWideValues => {
+  if (values.protocolType === 'dualStack') {
+    return values;
+  }
+  if (values.protocolType === 'ipv6') {
+    return {
+      ...values,
+      protocolType: 'ipv4',
+      ipConfigs: {
+        ipv4: { ...values.ipConfigs.ipv6 },
+        ipv6: getEmptyIpConfig(),
+      },
+    };
+  }
+  return {
+    ...values,
+    ipConfigs: {
+      ipv4: { ...values.ipConfigs.ipv4 },
+      ipv6: getEmptyIpConfig(),
+    },
+  };
+};
+
+export const normalizeDisconnectedNetworkWideForSave = (
+  values: FormViewNetworkWideValues,
+): FormViewNetworkWideValues => {
+  if (values.protocolType === 'dualStack') {
+    return values;
+  }
+
+  const singleStackConfig = values.ipConfigs[DISCONNECTED_SINGLE_STACK_FIELD];
+  const subnetIp = singleStackConfig.machineNetwork.ip;
+
+  if (subnetIp && isIpv6OnlyAddress(subnetIp)) {
+    return {
+      ...values,
+      protocolType: 'ipv6',
+      ipConfigs: {
+        ipv4: getEmptyIpConfig(),
+        ipv6: { ...singleStackConfig },
+      },
+    };
+  }
+
+  return {
+    ...values,
+    protocolType: 'ipv4',
+    ipConfigs: {
+      ipv4: { ...singleStackConfig },
+      ipv6: getEmptyIpConfig(),
+    },
+  };
+};
+
+export const getDisconnectedFormViewNetworkWideValues = (
+  infraEnv: InfraEnv,
+): FormViewNetworkWideValues => {
+  const values = getFormViewNetworkWideValues(infraEnv);
+  return normalizeDisconnectedNetworkWideForLoad(values);
+};
+
+export const disconnectedNetworkWideToInfraEnvField = (
+  currentInfraEnv: InfraEnv,
+  networkWide: FormViewNetworkWideValues,
+) => {
+  const normalized = normalizeDisconnectedNetworkWideForSave(networkWide);
+  return networkWideToInfraEnvField(currentInfraEnv, normalized);
+};

package/lib/ocm/components/wizard/steps/staticIp/data/formDataFromInfraEnvField.ts

@@ -9,7 +9,7 @@ import {
   StaticProtocolType,
 } from './dataTypes';
 import {
-  getProtocolVersionIdx,
+  getRouteGateway,
   YAML_COMMENT_CHAR,
   getMachineNetworks,
   getProtocolType,
@@ -89,7 +89,11 @@ const getGateway = (nmstate: Nmstate, protocolVersion: ProtocolVersion): string
   if (!routesConfig) {
     throw `Nmstate yaml doesn't contain routes section`;
   }
-  return routesConfig[getProtocolVersionIdx(protocolVersion)]['next-hop-address'];
+  const gateway = getRouteGateway(routesConfig, protocolVersion);
+  if (!gateway) {
+    throw `Nmstate yaml doesn't contain a route for protocol version ${protocolVersion}`;
+  }
+  return gateway;
 };
 
 const getNetworkWideConfigurations = (

package/lib/ocm/components/wizard/steps/staticIp/data/fromInfraEnv.ts

@@ -1,9 +1,15 @@
+import { Address6 } from 'ip-address';
 import {
   HostStaticNetworkConfig,
   InfraEnv,
 } from '@openshift-assisted/types/assisted-installer-service';
 import { stringToJSON } from '../../../../../../common';
-import { FORM_VIEW_PREFIX, getProtocolType, getYamlComments } from './nmstateYaml';
+import {
+  FORM_VIEW_PREFIX,
+  getProtocolType,
+  getYamlComments,
+  yamlToNmstateObject,
+} from './nmstateYaml';
 import {
   StaticIpInfo,
   StaticIpView,
@@ -11,8 +17,10 @@ import {
   FormViewHostsValues,
   FormViewNetworkWideValues,
   YamlViewValues,
+  ProtocolVersion,
 } from './dataTypes';
-import { isDummyYaml } from './dummyData';
+import { isDummyInterface, isDummyYaml } from './dummyData';
+import { NmstateInterface } from './nmstateTypes';
 import { formDataFromInfraEnvField } from './formDataFromInfraEnvField';
 import { getEmptyFormViewHost } from './emptyData';
 
@@ -91,3 +99,50 @@ export const getYamlViewValues = (infraEnv: InfraEnv): YamlViewValues => {
   }
   return { hosts: staticNetworkConfig };
 };
+
+export const canonicalizeIp = (ip: string): string => {
+  if (Address6.isValid(ip)) {
+    return new Address6(ip).correctForm();
+  }
+  return ip;
+};
+
+const getIpsFromInterface = (networkInterface: NmstateInterface): string[] => {
+  const ips: string[] = [];
+  for (const protocolVersion of [ProtocolVersion.ipv4, ProtocolVersion.ipv6]) {
+    const addresses = networkInterface[protocolVersion]?.address;
+    if (addresses?.length) {
+      for (const entry of addresses) {
+        if (entry.ip) {
+          ips.push(entry.ip);
+        }
+      }
+    }
+  }
+  return ips;
+};
+
+export const getHostIpsFromInfraEnv = (infraEnv: InfraEnv | undefined): string[] => {
+  if (!infraEnv) {
+    return [];
+  }
+  const staticNetworkConfig = getStaticNetworkConfig(infraEnv);
+  if (!staticNetworkConfig?.length) {
+    return [];
+  }
+
+  const hostIps: string[] = [];
+  for (const hostConfig of staticNetworkConfig) {
+    if (!hostConfig.networkYaml || isDummyYaml(hostConfig.networkYaml)) {
+      continue;
+    }
+    const nmstate = yamlToNmstateObject(hostConfig.networkYaml);
+    for (const networkInterface of nmstate.interfaces) {
+      if (isDummyInterface(networkInterface.name)) {
+        continue;
+      }
+      hostIps.push(...getIpsFromInterface(networkInterface));
+    }
+  }
+  return hostIps;
+};

package/lib/ocm/components/wizard/steps/staticIp/data/index.tsx

@@ -2,6 +2,7 @@ export * from './dataTypes';
 export * from './fromInfraEnv';
 export * from './emptyData';
 export * from './formDataToInfraEnvField';
+export * from './disconnectedNetworkWide';
 export * from './dummyData';
 export * from './protocolVersion';
 export * from './machineNetwork';