@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
80 lines • 5 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ExpandComponent = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const formik_1 = require("formik");
const HostsTable_1 = tslib_1.__importStar(require("../../../common/components/hosts/HostsTable"));
const tableUtils_1 = require("../../../common/components/hosts/tableUtils");
const tableUtils_2 = require("./tableUtils");
const EmptyState_1 = tslib_1.__importDefault(require("../../../common/components/ui/uiState/EmptyState"));
const usePagination_1 = require("../../../common/components/hosts/usePagination");
const useFormikHelpers_1 = require("../../../common/hooks/useFormikHelpers");
const use_translation_wrapper_1 = require("../../../common/hooks/use-translation-wrapper");
const HostRowDetail_1 = require("../../../common/components/hosts/HostRowDetail");
const HostsTableDetailContext_1 = require("../../../common/components/hosts/HostsTableDetailContext");
const agentStatus_1 = require("../helpers/agentStatus");
function ExpandComponent({ obj: host }) {
const { onDiskRole, canEditDisks } = (0, HostsTableDetailContext_1.useHostsTableDetailContext)();
return (react_1.default.createElement(HostRowDetail_1.HostDetail, { key: host.id, host: host, onDiskRole: onDiskRole, canEditDisks: canEditDisks }));
}
exports.ExpandComponent = ExpandComponent;
const AgentsSelectionTable = ({ matchingAgents, onEditRole, width, onEditHost, onHostSelect, onSetInstallationDiskId, }) => {
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const agentStatuses = (0, agentStatus_1.agentStatus)(t);
const [{ value: selectedIDs }] = (0, formik_1.useField)('selectedHostIds');
const idsRef = react_1.default.useRef(selectedIDs);
idsRef.current = selectedIDs;
const { setValue, setTouched } = (0, useFormikHelpers_1.useFormikHelpers)('selectedHostIds');
const setFieldValue = react_1.default.useCallback((ids) => {
setValue(ids, true);
setTouched(true, false);
}, [setValue, setTouched]);
react_1.default.useEffect(() => {
const allIds = matchingAgents.map((a) => { var _a; return (_a = a.metadata) === null || _a === void 0 ? void 0 : _a.uid; });
const presentIds = selectedIDs.filter((id) => allIds.includes(id));
if (presentIds.length !== selectedIDs.length) {
void setFieldValue(presentIds);
}
}, [matchingAgents, setFieldValue, selectedIDs]);
const onSelect = react_1.default.useCallback((agent, selected) => {
var _a;
const newIDs = selected
? [...idsRef.current, ((_a = agent.metadata) === null || _a === void 0 ? void 0 : _a.uid) || '']
: idsRef.current.filter((uid) => { var _a; return uid !== ((_a = agent.metadata) === null || _a === void 0 ? void 0 : _a.uid); });
void setFieldValue(newIDs);
onHostSelect === null || onHostSelect === void 0 ? void 0 : onHostSelect();
}, [setFieldValue, onHostSelect]);
const [hosts, actions, actionResolver] = (0, tableUtils_2.useAgentsTable)({ agents: matchingAgents }, { onSelect, onEditRole, onEditHost, onSetInstallationDiskId });
const addAll = width && width > 700;
const content = react_1.default.useMemo(() => {
return [
(0, tableUtils_2.agentHostnameColumn)(t, hosts, matchingAgents, [], actions.onEditHost, actions.canEditHostname),
...(addAll ? [(0, tableUtils_2.infraEnvColumn)(matchingAgents, t)] : []),
(0, tableUtils_2.agentStatusColumn)({
agents: matchingAgents,
agentStatuses,
wizardStepId: 'hosts-selection',
t,
}),
(0, tableUtils_1.roleColumn)(t, actions.canEditRole, actions.onEditRole, undefined, undefined),
...(addAll ? [(0, tableUtils_1.cpuCoresColumn)(t), (0, tableUtils_1.memoryColumn)(t), (0, tableUtils_1.disksColumn)(t)] : []),
];
}, [
matchingAgents,
actions.canEditRole,
actions.onEditRole,
addAll,
hosts,
agentStatuses,
actions.onEditHost,
actions.canEditHostname,
t,
]);
const paginationProps = (0, usePagination_1.usePagination)(hosts.length);
return (react_1.default.createElement(HostsTableDetailContext_1.HostsTableDetailContextProvider, { canEditDisks: actions.canEditDisks, onDiskRole: actions.onDiskRole },
react_1.default.createElement(HostsTable_1.default, Object.assign({ hosts: hosts, content: content, selectedIDs: selectedIDs, actionResolver: actionResolver, ExpandComponent: actions.onDiskRole ? ExpandComponent : HostsTable_1.DefaultExpandComponent }, actions, paginationProps),
react_1.default.createElement(EmptyState_1.default, { title: t('ai:No hosts found'), content: t('ai:No host matches provided labels/locations') }))));
};
exports.default = AgentsSelectionTable;
//# sourceMappingURL=AgentsSelectionTable.js.map