@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
41 lines • 3 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const countBy_js_1 = tslib_1.__importDefault(require("lodash-es/countBy.js"));
const common_1 = require("../../../common");
const common_2 = require("../common");
const use_translation_wrapper_1 = require("../../../common/hooks/use-translation-wrapper");
const react_i18next_1 = require("react-i18next");
const LocationsLabelIcon = () => {
const { t } = (0, use_translation_wrapper_1.useTranslation)();
return (react_1.default.createElement(common_1.PopoverIcon, { position: "right", bodyContent: react_1.default.createElement(react_1.default.Fragment, null,
t('ai:Select one or multiple locations to choose the hosts from.'),
react_1.default.createElement("br", null),
react_1.default.createElement(react_i18next_1.Trans, { t: t, components: { bold: react_1.default.createElement("strong", null) }, i18nKey: "ai:Keep the field empty to match <bold>any</bold> location." }),
react_1.default.createElement("br", null),
react_1.default.createElement(react_i18next_1.Trans, { t: t, components: { bold: react_1.default.createElement("strong", null) }, i18nKey: "ai:Set <bold>{{agent_location_label_key}}</bold> label in Agent resource to specify its location.", values: { agent_location_label_key: common_2.AGENT_LOCATION_LABEL_KEY } })) }));
};
const getNumOfHosts = (size, t) => {
if (size === 0) {
return t('ai:(no hosts available)');
}
else if (size === 1) {
return t('ai:(1 host available)');
}
return t('ai:({{size}} hosts available)', { size });
};
const LocationsSelector = ({ agents }) => {
const locations = (0, countBy_js_1.default)(agents, ({ metadata }) => { var _a; return ((_a = metadata === null || metadata === void 0 ? void 0 : metadata.labels) === null || _a === void 0 ? void 0 : _a[common_2.AGENT_LOCATION_LABEL_KEY]) || common_2.AGENT_NOLOCATION_VALUE; });
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const agentLocationOptions = Object.keys(locations).map((location) => ({
// Why is that bloody prop set as mandatory in the SelectOptionProps??
isLastOptionBeforeFooter: (index) => index === locations.length,
id: location,
value: location,
displayName: `${location === common_2.AGENT_NOLOCATION_VALUE ? t('ai:No location') : location} ${getNumOfHosts(locations[location], t)}`,
}));
return (react_1.default.createElement(common_1.MultiSelectField, { idPostfix: "locations", name: "locations", label: t('ai:Host locations'), labelIcon: react_1.default.createElement(LocationsLabelIcon, null), placeholderText: t('ai:Type or select location(s)'), helperText: t('ai:Select one or more locations to view hosts'), options: agentLocationOptions }));
};
exports.default = LocationsSelector;
//# sourceMappingURL=LocationsSelector.js.map