@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
80 lines • 5.26 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_core_1 = require("@patternfly/react-core");
const formik_1 = require("formik");
const common_1 = require("../../../common");
const services_1 = require("../../services");
const use_feature_1 = require("../../hooks/use-feature");
const OperatorCheckbox_1 = tslib_1.__importDefault(require("../clusterConfiguration/operators/OperatorCheckbox"));
const operatorSpecs_1 = require("../../../common/components/operators/operatorSpecs");
const OperatorsSelect = ({ cluster, bundles, preflightRequirements, searchTerm, }) => {
const [isLoading, setIsLoading] = (0, common_1.useStateSafely)(true);
const { addAlert } = (0, common_1.useAlerts)();
const [isExpanded, setIsExpanded] = React.useState(false);
const [supportedOperators, setSupportedOperators] = (0, common_1.useStateSafely)([]);
const isSingleClusterFeatureEnabled = (0, use_feature_1.useFeature)('ASSISTED_INSTALLER_SINGLE_CLUSTER_FEATURE');
const { values } = (0, formik_1.useFormikContext)();
React.useEffect(() => {
const fetchSupportedOperators = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
try {
const fetchedOperators = yield services_1.OperatorsService.getSupportedOperators();
setSupportedOperators(fetchedOperators);
}
catch (error) {
(0, common_1.handleApiError)(error, () => addAlert({ title: 'Failed to fetch operators', message: (0, common_1.getApiErrorMessage)(error) }));
}
finally {
setIsLoading(false);
}
});
void fetchSupportedOperators();
}, [addAlert, setSupportedOperators, setIsLoading]);
const { byCategory, byKey: opSpecs } = (0, operatorSpecs_1.useOperatorSpecs)();
const operators = React.useMemo(() => {
return supportedOperators.filter((op) => {
if (!isSingleClusterFeatureEnabled) {
return true;
}
return common_1.singleClusterOperators.includes(op);
});
}, [isSingleClusterFeatureEnabled, supportedOperators]);
const selectedOperators = values.selectedOperators.filter((opKey) => operators.includes(opKey) && !!opSpecs[opKey]);
if (isLoading) {
return React.createElement(common_1.LoadingState, null);
}
let foundAtLeastOneOperator = false;
return (React.createElement(React.Fragment, null,
React.createElement(react_core_1.ExpandableSection, { toggleText: `Single Operators (${operators.length} | ${selectedOperators.length} selected)`, onToggle: () => setIsExpanded(!isExpanded), isExpanded: isExpanded, "data-testid": "single-operators-section" },
React.createElement(react_core_1.Stack, { hasGutter: true, "data-testid": 'operators-form' }, Object.entries(byCategory).map(([categoryName, specs]) => {
let categoryOperators = specs.filter((spec) => operators.includes(spec.operatorKey));
// Filter by searchTerm
if (searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()) {
const term = searchTerm.trim().toLowerCase();
categoryOperators = categoryOperators.filter((spec) => {
var _a, _b;
const op = opSpecs[spec.operatorKey];
const title = ((_a = op === null || op === void 0 ? void 0 : op.title) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '';
const description = ((_b = op === null || op === void 0 ? void 0 : op.descriptionText) === null || _b === void 0 ? void 0 : _b.toLowerCase()) || '';
return title.includes(term) || description.includes(term);
});
}
if (categoryOperators.length === 0) {
return null;
}
foundAtLeastOneOperator = true;
if (!!(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()) && !isExpanded) {
//if we found some results expand operators section
setIsExpanded(true);
}
return (React.createElement(React.Fragment, { key: categoryName },
React.createElement(react_core_1.StackItem, null,
React.createElement("strong", null, categoryName)),
categoryOperators.map((spec) => (React.createElement(react_core_1.StackItem, { key: spec.operatorKey },
React.createElement(OperatorCheckbox_1.default, Object.assign({ bundles: bundles, operatorId: spec.operatorKey, cluster: cluster, openshiftVersion: cluster.openshiftVersion, preflightRequirements: preflightRequirements, searchTerm: searchTerm }, spec)))))));
}))),
!foundAtLeastOneOperator && !!(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()) && React.createElement(react_core_1.StackItem, null, "No results found")));
};
exports.default = OperatorsSelect;
//# sourceMappingURL=OperatorsSelect.js.map