@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
64 lines • 5.06 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ClusterDeploymentDetailsFormWrapper = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_core_1 = require("@patternfly/react-core");
const helpers_1 = require("../helpers");
const use_translation_wrapper_1 = require("../../../common/hooks/use-translation-wrapper");
const ClusterDetailsFormFields_1 = require("./ClusterDetailsFormFields");
const formik_1 = require("formik");
const common_1 = require("../../../common");
const ClusterDeploymentWizardContext_1 = require("./ClusterDeploymentWizardContext");
const ValidationSection_1 = require("./components/ValidationSection");
const lodash_es_1 = require("lodash-es");
const ClusterDeploymentDetailsFormWrapper = ({ children, }) => {
const { activeStep, goToPrevStep, goToNextStep, close } = (0, react_core_1.useWizardContext)();
const { syncError } = React.useContext(ClusterDeploymentWizardContext_1.ClusterDeploymentWizardContext);
const { submitForm, isSubmitting, isValid, isValidating, dirty } = (0, formik_1.useFormikContext)();
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const handleOnNext = React.useCallback(() => {
if (dirty) {
void submitForm();
}
else {
void goToNextStep();
}
}, [dirty, goToNextStep, submitForm]);
const footer = React.useMemo(() => (React.createElement(react_core_1.WizardFooter, { activeStep: activeStep, onNext: handleOnNext, isNextDisabled: !isValid || isValidating || isSubmitting, nextButtonProps: { isLoading: isSubmitting }, nextButtonText: t('ai:Next'), onBack: goToPrevStep, onClose: close, isBackHidden: true })), [activeStep, close, goToPrevStep, handleOnNext, isSubmitting, isValid, isValidating, t]);
(0, react_core_1.useWizardFooter)(footer);
return (React.createElement(react_core_1.Stack, { hasGutter: true },
children,
syncError && (React.createElement(react_core_1.StackItem, null,
React.createElement(ValidationSection_1.ValidationSection, { currentStepId: 'networking', hosts: [] },
React.createElement(react_core_1.Alert, { variant: react_core_1.AlertVariant.danger, title: t('ai:An error occured'), isInline: true }, syncError))))));
};
exports.ClusterDeploymentDetailsFormWrapper = ClusterDeploymentDetailsFormWrapper;
const ClusterDeploymentDetailsForm = ({ agentClusterInstall, clusterDeployment, clusterImages, extensionAfter, isNutanix, osImages, }) => {
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const versions = React.useMemo(() => (0, helpers_1.getOCPVersions)(clusterImages, isNutanix, osImages), [clusterImages, isNutanix, osImages]);
const allVersions = React.useMemo(() => (0, helpers_1.getOCPVersions)(clusterImages, isNutanix, osImages, true), [clusterImages, isNutanix, osImages]);
const forceOpenshiftVersion = agentClusterInstall
? (0, helpers_1.getSelectedVersion)(clusterImages, agentClusterInstall)
: undefined;
const isEditFlow = !!clusterDeployment;
const { values } = (0, formik_1.useFormikContext)();
const [cpuArchitectures, allowHighlyAvailable] = React.useMemo(() => {
var _a, _b, _c;
const cpuArchitectures = [common_1.CpuArchitecture.x86, common_1.CpuArchitecture.ARM, common_1.CpuArchitecture.s390x];
const version = allVersions.find((ver) => ver.value === values.openshiftVersion || ver.version === forceOpenshiftVersion);
const isMulti = ((_a = version === null || version === void 0 ? void 0 : version.cpuArchitectures) === null || _a === void 0 ? void 0 : _a[0]) === common_1.CpuArchitecture.MULTI;
const highlyAvailableSupported = (0, lodash_es_1.toNumber)((_c = (_b = version === null || version === void 0 ? void 0 : version.version) === null || _b === void 0 ? void 0 : _b.split('.')) === null || _c === void 0 ? void 0 : _c[1]) >= 18;
return [
(isMulti ? cpuArchitectures : version === null || version === void 0 ? void 0 : version.cpuArchitectures),
highlyAvailableSupported && !isMulti,
];
}, [allVersions, forceOpenshiftVersion, values.openshiftVersion]);
return (React.createElement(React.Fragment, null,
isEditFlow && (React.createElement(react_core_1.StackItem, null,
React.createElement(react_core_1.Alert, { isInline: true, variant: "info", title: t('ai:Some details are not editable after the draft cluster was created.') }))),
React.createElement(react_core_1.StackItem, null,
React.createElement(ClusterDetailsFormFields_1.ClusterDetailsFormFields, { versions: versions, allVersions: allVersions, isEditFlow: isEditFlow, forceOpenshiftVersion: forceOpenshiftVersion, extensionAfter: extensionAfter, isNutanix: isNutanix, cpuArchitectures: cpuArchitectures, allowHighlyAvailable: allowHighlyAvailable }))));
};
exports.default = ClusterDeploymentDetailsForm;
//# sourceMappingURL=ClusterDeploymentDetailsForm.js.map