@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
126 lines • 7.87 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const react_core_1 = require("@patternfly/react-core");
const common_1 = require("../../../../common");
const services_1 = require("../../../services");
const FormViewHosts_1 = require("../../clusterConfiguration/staticIp/components/FormViewHosts/FormViewHosts");
const FormViewNetworkWide_1 = require("../../clusterConfiguration/staticIp/components/FormViewNetworkWide/FormViewNetworkWide");
const StaticIpViewRadioGroup_1 = tslib_1.__importDefault(require("../../clusterConfiguration/staticIp/components/StaticIpViewRadioGroup"));
const YamlView_1 = require("../../clusterConfiguration/staticIp/components/YamlView/YamlView");
const dataTypes_1 = require("../../clusterConfiguration/staticIp/data/dataTypes");
const fromInfraEnv_1 = require("../../clusterConfiguration/staticIp/data/fromInfraEnv");
const dummyData_1 = require("../../clusterConfiguration/staticIp/data/dummyData");
const ModalDialogsContext_1 = require("../../hosts/ModalDialogsContext");
const Day2WizardContext_1 = require("./Day2WizardContext");
const Day2WizardNav_1 = tslib_1.__importDefault(require("./Day2WizardNav"));
const Day2WizardFooter_1 = tslib_1.__importDefault(require("./Day2WizardFooter"));
const Day2StaticIP = () => {
const { day2DiscoveryImageDialog } = (0, ModalDialogsContext_1.useModalDialogsContext)();
const wizardContext = (0, Day2WizardContext_1.useDay2WizardContext)();
const [infraEnv, setInfraEnv] = react_1.default.useState(undefined);
const [hasLoadError, setHasLoadError] = react_1.default.useState(false);
const [confirmOnChangeView, setConfirmOnChangeView] = react_1.default.useState(false);
const [viewChanged, setViewChanged] = react_1.default.useState(false);
const [initialStaticIpInfo, setInitialStaticIpInfo] = react_1.default.useState((0, dummyData_1.getDummyStaticIpInfo)());
const [formState, setFormState] = react_1.default.useState();
const { data: { cluster }, } = day2DiscoveryImageDialog;
const selectedArchitecture = wizardContext.selectedCpuArchitecture;
const restartWizard = react_1.default.useCallback(() => {
wizardContext.setCurrentStepId('cluster-details');
wizardContext.onUpdateHostNetworkConfigType(services_1.HostsNetworkConfigurationType.DHCP);
}, [wizardContext]);
react_1.default.useEffect(() => {
const setCurrentStaticConfig = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
let infraEnv;
try {
infraEnv = yield services_1.InfraEnvsService.getInfraEnv(cluster.id, selectedArchitecture);
}
catch (e) {
setHasLoadError(true);
setInfraEnv(undefined);
return;
}
if (infraEnv && !(infraEnv instanceof Error)) {
if (!infraEnv.staticNetworkConfig) {
// Make sure the infraEnv we store in the state has staticIP config
// This is required to be able to reuse the StaticIP services
infraEnv = yield services_1.InfraEnvsService.setDummyStaticConfigToInfraEnv(infraEnv.id);
}
const staticIpInfo = (0, fromInfraEnv_1.getStaticIpInfo)(infraEnv);
if (staticIpInfo) {
setInfraEnv(infraEnv);
setInitialStaticIpInfo(staticIpInfo);
}
else {
setHasLoadError(true);
}
}
else {
setHasLoadError(true);
setInfraEnv(undefined);
return;
}
});
void setCurrentStaticConfig();
}, [cluster.id, selectedArchitecture]);
const onChangeView = react_1.default.useCallback((view) => {
wizardContext.onUpdateStaticIpView(view);
setViewChanged(true);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
if (hasLoadError) {
return (react_1.default.createElement(react_core_1.PageSection, { variant: react_core_1.PageSectionVariants.light, isFilled: true },
react_1.default.createElement(common_1.ErrorState, { title: "Cannot load the Static IP configuration for this cluster", content: "For non-multi-architecture clusters, make sure you select the Day1 cpu architecture", actions: [
react_1.default.createElement(react_core_1.Button, { key: "restart-wizard", variant: react_core_1.ButtonVariant.primary, onClick: restartWizard }, "Back to Wizard"),
] })));
}
else if (!infraEnv) {
// It's still loading
return react_1.default.createElement(common_1.LoadingState, null);
}
const onFormStateChange = (formState) => {
const hasFilledData = wizardContext.currentStepId === 'static-ip-host-configurations' || !formState.isEmpty;
setConfirmOnChangeView(hasFilledData);
setFormState(formState);
};
const viewProps = {
infraEnv,
onFormStateChange,
updateInfraEnv: (updateParams) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
const updatedInfraEnv = yield services_1.InfraEnvsService.syncStaticIpConfigs(cluster.id, infraEnv.id, updateParams.staticNetworkConfig);
setInfraEnv(updatedInfraEnv);
return updatedInfraEnv;
}),
showEmptyValues: viewChanged,
};
const getContent = () => {
if (initialStaticIpInfo.view === dataTypes_1.StaticIpView.YAML && !viewChanged) {
return react_1.default.createElement(YamlView_1.YamlView, Object.assign({}, viewProps));
}
switch (wizardContext.currentStepId) {
case 'static-ip-yaml-view':
return react_1.default.createElement(YamlView_1.YamlView, Object.assign({}, viewProps));
case 'static-ip-host-configurations':
return react_1.default.createElement(FormViewHosts_1.FormViewHosts, Object.assign({}, viewProps));
case 'static-ip-network-wide-configurations':
return react_1.default.createElement(FormViewNetworkWide_1.FormViewNetworkWide, Object.assign({}, viewProps));
default:
throw `Unexpected wizard step id ${wizardContext.currentStepId} when entering static ip page`;
}
};
const content = getContent();
if (!content) {
return null;
}
return (react_1.default.createElement(common_1.ClusterWizardStep, { navigation: react_1.default.createElement(Day2WizardNav_1.default, null), footer: react_1.default.createElement(Day2WizardFooter_1.default, { isSubmitting: (formState === null || formState === void 0 ? void 0 : formState.isSubmitting) || false, isNextDisabled: !(formState === null || formState === void 0 ? void 0 : formState.isValid) || formState.isAutoSaveRunning, onCancel: day2DiscoveryImageDialog.close }) },
react_1.default.createElement(react_core_1.Grid, { hasGutter: true },
react_1.default.createElement(react_core_1.TextContent, null,
react_1.default.createElement(react_core_1.Text, { component: react_core_1.TextVariants.h2 }, "Static network configurations"),
react_1.default.createElement(react_core_1.Text, { component: react_core_1.TextVariants.small }, "Network configuration can be done using either the form view or YAML view. Configurations done in this step are for discovering hosts.")),
react_1.default.createElement(StaticIpViewRadioGroup_1.default, { initialView: initialStaticIpInfo.view, confirmOnChangeView: confirmOnChangeView, onChangeView: onChangeView }),
content)));
};
exports.default = Day2StaticIP;
//# sourceMappingURL=Day2StaticIP.js.map