@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
144 lines • 10.6 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const formik_1 = require("formik");
const react_redux_1 = require("react-redux");
const react_core_1 = require("@patternfly/react-core");
const VirtualIPControlGroup_1 = require("./VirtualIPControlGroup");
const common_1 = require("../../../../common");
const networkingSteps_1 = require("../../../../common/components/clusterWizard/networkingSteps");
const StackTypeControl_1 = require("./StackTypeControl");
const AvailableSubnetsControl_1 = require("./AvailableSubnetsControl");
const AdvancedNetworkFields_1 = tslib_1.__importDefault(require("./AdvancedNetworkFields"));
const selectors_1 = require("../../../store/slices/current-cluster/selectors");
const OcmFormFields_1 = require("../../ui/OcmFormFields");
const NetworkTypeControlGroup_1 = require("../../../../common/components/clusterWizard/networkingSteps/NetworkTypeControlGroup");
const newFeatureSupportLevels_1 = require("../../../../common/components/newFeatureSupportLevels");
const useSupportLevelsAPI_1 = tslib_1.__importDefault(require("../../../hooks/useSupportLevelsAPI"));
const utils_1 = require("../../utils");
const isAdvNetworkConf = (cluster, defaultNetworkValues) => !((0, common_1.serviceNetworksEqual)(cluster.serviceNetworks || [], defaultNetworkValues.serviceNetworksIpv4 || []) &&
(0, common_1.clusterNetworksEqual)(cluster.clusterNetworks || [], defaultNetworkValues.clusterNetworksIpv4 || []));
const getManagedNetworkingDisabledReason = (isDualStack, isOracleCloudInfrastructure, featureSupportLevelData) => {
if (isOracleCloudInfrastructure) {
return 'Network management selection is not supported with Oracle Cloud Infrastructure';
}
else if (isDualStack) {
return 'Network management selection is not supported with dual-stack';
}
else if (featureSupportLevelData.isFeatureDisabled('NETWORK_TYPE_SELECTION')) {
return featureSupportLevelData.getFeatureDisabledReason('NETWORK_TYPE_SELECTION');
}
};
const getUserManagedDisabledReason = (featureSupportLevelContext, platformType, featureSupportLevelMap) => {
if (!featureSupportLevelContext.isFeatureSupported('USER_MANAGED_NETWORKING')) {
return featureSupportLevelContext.getFeatureDisabledReason('USER_MANAGED_NETWORKING', featureSupportLevelMap !== null && featureSupportLevelMap !== void 0 ? featureSupportLevelMap : undefined, undefined, platformType);
}
};
const getClusterManagedDisabledReason = (featureSupportLevelContext, featureSupportLevelMap) => {
if (!featureSupportLevelContext.isFeatureSupported('CLUSTER_MANAGED_NETWORKING')) {
return featureSupportLevelContext.getFeatureDisabledReason('CLUSTER_MANAGED_NETWORKING', featureSupportLevelMap !== null && featureSupportLevelMap !== void 0 ? featureSupportLevelMap : undefined);
}
};
const getManagedNetworkingState = (isDualStack, isOracleCloudInfrastructure, featureSupportLevelData, platformType, featureSupportLevelMap) => {
const networkingReason = getManagedNetworkingDisabledReason(isDualStack, isOracleCloudInfrastructure, featureSupportLevelData);
const cmnReason = getClusterManagedDisabledReason(featureSupportLevelData, featureSupportLevelMap);
const umnReason = getUserManagedDisabledReason(featureSupportLevelData, platformType, featureSupportLevelMap);
return {
isDisabled: !!(cmnReason || umnReason || networkingReason),
clusterManagedDisabledReason: cmnReason || networkingReason,
userManagedDisabledReason: umnReason || networkingReason,
};
};
const NetworkConfiguration = ({ cluster, hostSubnets, isVipDhcpAllocationDisabled, defaultNetworkSettings, }) => {
var _a;
const featureSupportLevelContext = (0, newFeatureSupportLevels_1.useNewFeatureSupportLevel)();
const featureSupportLevelData = (0, useSupportLevelsAPI_1.default)('features', cluster.openshiftVersion, cluster.cpuArchitecture, (_a = cluster.platform) === null || _a === void 0 ? void 0 : _a.type);
const { isViewerMode } = (0, react_redux_1.useSelector)(selectors_1.selectCurrentClusterPermissionsState);
const { setFieldValue, values, validateField } = (0, formik_1.useFormikContext)();
const isSNOCluster = (0, common_1.isSNO)(cluster);
const isUserManagedNetworking = values.managedNetworkingType === 'userManaged';
const isDualStack = values.stackType === common_1.DUAL_STACK;
const isDualStackSelectable = react_1.default.useMemo(() => (0, common_1.canBeDualStack)(hostSubnets), [hostSubnets]);
const isSDNSelectable = react_1.default.useMemo(() => {
return (0, common_1.canSelectNetworkTypeSDN)(isSNOCluster, isDualStack);
}, [isSNOCluster, isDualStack]);
const [isAdvanced, setAdvanced] = react_1.default.useState(isDualStack || isAdvNetworkConf(cluster, defaultNetworkSettings));
react_1.default.useEffect(() => {
var _a, _b, _c;
if (isUserManagedNetworking) {
// We need to reset these fields' values in order to align with the values the server sends
if (values.vipDhcpAllocation || ((_a = values.ingressVips) === null || _a === void 0 ? void 0 : _a.length) || ((_b = values.apiVips) === null || _b === void 0 ? void 0 : _b.length)) {
setFieldValue('vipDhcpAllocation', false);
setFieldValue('ingressVips', [], false);
setFieldValue('apiVips', [], false);
}
if (!isSNOCluster && ((_c = values.machineNetworks) === null || _c === void 0 ? void 0 : _c.length)) {
setFieldValue('machineNetworks', [], false);
}
}
}, [
isSNOCluster,
isUserManagedNetworking,
values.vipDhcpAllocation,
setFieldValue,
validateField,
values.apiVips,
values.ingressVips,
values.machineNetworks,
]);
const toggleAdvConfiguration = react_1.default.useCallback((checked) => {
setAdvanced(checked);
if (!checked) {
setFieldValue('clusterNetworks', isDualStack
? defaultNetworkSettings.clusterNetworksDualstack
: defaultNetworkSettings.clusterNetworksIpv4, true);
setFieldValue('serviceNetworks', isDualStack
? defaultNetworkSettings.serviceNetworksDualstack
: defaultNetworkSettings.serviceNetworksIpv4, true);
}
}, [
setFieldValue,
isDualStack,
defaultNetworkSettings.clusterNetworksDualstack,
defaultNetworkSettings.clusterNetworksIpv4,
defaultNetworkSettings.serviceNetworksDualstack,
defaultNetworkSettings.serviceNetworksIpv4,
]);
react_1.default.useEffect(() => {
if (!isViewerMode && isDualStack && !isUserManagedNetworking) {
toggleAdvConfiguration(true);
}
}, [isDualStack, isUserManagedNetworking, isViewerMode, toggleAdvConfiguration]);
const managedNetworkingState = react_1.default.useMemo(() => {
var _a;
return getManagedNetworkingState(isDualStack, (0, utils_1.isOciPlatformType)(cluster), featureSupportLevelContext, (_a = cluster.platform) === null || _a === void 0 ? void 0 : _a.type, featureSupportLevelData);
}, [isDualStack, cluster, featureSupportLevelContext, featureSupportLevelData]);
const isSDNSupported = react_1.default.useMemo(() => {
return featureSupportLevelContext.isFeatureSupported('SDN_NETWORK_TYPE');
}, [featureSupportLevelContext]);
return (react_1.default.createElement(react_core_1.Stack, { hasGutter: true },
react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(networkingSteps_1.ManagedNetworkingControlGroup, { disabled: isViewerMode || managedNetworkingState.isDisabled, tooltipCmnDisabled: managedNetworkingState.clusterManagedDisabledReason, tooltipUmnDisabled: managedNetworkingState.userManagedDisabledReason })),
isUserManagedNetworking && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(networkingSteps_1.UserManagedNetworkingTextContent, { shouldDisplayLoadBalancersBullet: !isSNOCluster, docVersion: cluster.openshiftVersion }))),
(isSNOCluster || !isUserManagedNetworking) && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(StackTypeControl_1.StackTypeControlGroup, { clusterId: cluster.id, isDualStackSelectable: isDualStackSelectable, hostSubnets: hostSubnets }))),
isSDNSupported && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(NetworkTypeControlGroup_1.NetworkTypeControlGroup, { isDisabled: isViewerMode, isSDNSelectable: isSDNSelectable }))),
!(isUserManagedNetworking && !isSNOCluster) && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(AvailableSubnetsControl_1.AvailableSubnetsControl, { clusterId: cluster.id, hostSubnets: hostSubnets, isRequired: !isUserManagedNetworking, isDisabled: (cluster.vipDhcpAllocation &&
(0, common_1.selectApiVip)(cluster) === '' &&
(0, common_1.selectIngressVip)(cluster) === '') ||
hostSubnets.length === 0 ||
false }))),
!isUserManagedNetworking && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(VirtualIPControlGroup_1.VirtualIPControlGroup, { cluster: cluster, isVipDhcpAllocationDisabled: isVipDhcpAllocationDisabled || !isSDNSupported, supportLevel: featureSupportLevelContext.getFeatureSupportLevel('VIP_AUTO_ALLOC') }))),
react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(react_core_1.Tooltip, { content: 'Advanced networking properties must be configured in dual-stack', hidden: !isDualStack, position: 'top-start' },
react_1.default.createElement(OcmFormFields_1.OcmCheckbox, { id: "useAdvancedNetworking", label: "Use advanced networking", description: "Configure advanced networking properties (e.g. CIDR ranges).", isChecked: isAdvanced, onChange: (_event, value) => toggleAdvConfiguration(value), isDisabled: isDualStack }))),
isAdvanced && (react_1.default.createElement(react_core_1.StackItem, null,
react_1.default.createElement(AdvancedNetworkFields_1.default, null)))));
};
exports.default = NetworkConfiguration;
//# sourceMappingURL=NetworkConfiguration.js.map