@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
92 lines • 8.24 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const formik_1 = require("formik");
const plus_circle_icon_1 = require("@patternfly/react-icons/dist/js/icons/plus-circle-icon");
const react_core_1 = require("@patternfly/react-core");
const use_translation_wrapper_1 = require("../../../../../common/hooks/use-translation-wrapper");
const common_1 = require("../../../../../common");
const utils_1 = require("../../../../../common/utils");
const useTemptiflySync_1 = require("../../hooks/useTemptiflySync");
const NodePoolForm_1 = tslib_1.__importDefault(require("./NodePoolForm"));
const HostsForm = ({ onValuesChanged, infraEnvs, agents, clusterName, initReleaseImage, }) => {
const { values } = (0, formik_1.useFormikContext)();
(0, useTemptiflySync_1.useTemptiflySync)({ values, onValuesChanged });
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const infraEnvOptions = infraEnvs.length
? infraEnvs.map((ie) => {
var _a, _b;
return ({
label: ((_a = ie.metadata) === null || _a === void 0 ? void 0 : _a.namespace) || '',
value: ((_b = ie.metadata) === null || _b === void 0 ? void 0 : _b.namespace) || '',
});
})
: [
{
label: t('ai:No namespace with hosts is available'),
value: 'NOT_AVAILABLE',
},
];
const totalHosts = values.nodePools.reduce((acc, nodePool) => {
acc += nodePool.useAutoscaling ? nodePool.autoscaling.maxReplicas : nodePool.count;
return acc;
}, 0);
return (React.createElement(react_core_1.Form, null,
React.createElement(react_core_1.Grid, { hasGutter: true },
React.createElement(react_core_1.GridItem, null,
React.createElement(react_core_1.FormGroup, { isInline: true, label: React.createElement(React.Fragment, null, t('ai:Controller availability policy')), isRequired: true },
React.createElement(common_1.RadioField, { name: 'controllerAvailabilityPolicy', label: React.createElement(React.Fragment, null,
t('ai:Highly available'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:Highly available means components should be resilient to problems across fault boundaries as defined by the component to which the policy is attached. This usually means running critical workloads with 3 replicas and with little or no toleration of disruption of the component.') })), value: 'HighlyAvailable' }),
React.createElement(common_1.RadioField, { name: 'controllerAvailabilityPolicy', label: React.createElement(React.Fragment, null,
t('ai:Single replica'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:Single replica means components are not expected to be resilient to problems across most fault boundaries associated with high availability. This usually means running critical workloads with just 1 replica and with toleration of full disruption of the component.') })), value: 'SingleReplica' }))),
React.createElement(react_core_1.GridItem, null,
React.createElement(react_core_1.FormGroup, { isInline: true, label: React.createElement(React.Fragment, null, t('ai:Infrastructure availability policy')), isRequired: true },
React.createElement(common_1.RadioField, { name: 'infrastructureAvailabilityPolicy', label: React.createElement(React.Fragment, null,
t('ai:Highly available'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:Highly available means components should be resilient to problems across fault boundaries as defined by the component to which the policy is attached. This usually means running critical workloads with 3 replicas and with little or no toleration of disruption of the component.') })), value: 'HighlyAvailable' }),
React.createElement(common_1.RadioField, { name: 'infrastructureAvailabilityPolicy', label: React.createElement(React.Fragment, null,
t('ai:Single replica'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:Single replica means components are not expected to be resilient to problems across most fault boundaries associated with high availability. This usually means running critical workloads with just 1 replica and with toleration of full disruption of the component.') })), value: 'SingleReplica' }))),
React.createElement(react_core_1.GridItem, null,
React.createElement(react_core_1.FormGroup, { isInline: true, label: React.createElement(React.Fragment, null, t('ai:OLM catalog placement')), isRequired: true },
React.createElement(common_1.RadioField, { name: 'olmCatalogPlacement', label: React.createElement(React.Fragment, null,
t('ai:Management'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:OLM catalog components will be deployed onto the management cluster.') })), value: 'management' }),
React.createElement(common_1.RadioField, { name: 'olmCatalogPlacement', label: React.createElement(React.Fragment, null,
t('ai:Guest'),
' ',
React.createElement(common_1.PopoverIcon, { bodyContent: t('ai:OLM catalog components will be deployed onto the guest cluster.') })), value: 'guest' }))),
React.createElement(react_core_1.GridItem, null,
React.createElement(common_1.SelectField, { label: t('ai:Namespace'), name: "agentNamespace", options: infraEnvOptions, isRequired: true, isDisabled: !infraEnvs.length, labelIcon: React.createElement(common_1.PopoverIcon, { position: "right", bodyContent: t('ai:Choose a namespace from your existing host inventory in order to select hosts for your node pools. The namespace will be composed of 1 or more infrastructure environments. After the cluster is created, a host will become a worker node.') }) })),
totalHosts === 0 && (React.createElement(react_core_1.GridItem, null,
React.createElement(react_core_1.Alert, { isInline: true, variant: "warning", title: t('ai:The cluster has 0 hosts. No workloads will be able to run.') }))),
React.createElement(formik_1.FieldArray, { name: "nodePools" }, ({ remove, push }) => (React.createElement(React.Fragment, null,
values.nodePools.map((nodePool, index) => (React.createElement(react_core_1.GridItem, { key: index },
React.createElement(NodePoolForm_1.default, { index: index, agents: agents, infraEnvs: infraEnvs, onRemove: () => remove(index) })))),
React.createElement(react_core_1.GridItem, null,
React.createElement(react_core_1.Button, { variant: "link", icon: React.createElement(plus_circle_icon_1.PlusCircleIcon, null), iconPosition: "right", onClick: () => {
const uniquePoolName = `nodepool-${clusterName}-${(0, utils_1.getRandomString)(5)}`;
push({
nodePoolName: uniquePoolName,
count: 1,
agentLabels: [],
releaseImage: initReleaseImage,
clusterName,
useAutoscaling: false,
autoscaling: {
minReplicas: 1,
maxReplicas: 1,
},
});
} }, t('ai:Add Nodepool')))))))));
};
exports.default = HostsForm;
//# sourceMappingURL=HostsForm.js.map