@openshift-assisted/ui-lib
Version:
React component library for the Assisted Installer UI
121 lines • 8.26 kB
JavaScript
"use strict";
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 react_core_2 = require("@patternfly/react-core");
const tableUtils_1 = require("../Agent/tableUtils");
const HostsTable_1 = tslib_1.__importStar(require("../../../common/components/hosts/HostsTable"));
const tableUtils_2 = require("../../../common/components/hosts/tableUtils");
const common_1 = require("../../../common");
const modals_1 = require("../modals");
const MassApproveAction_1 = tslib_1.__importDefault(require("../modals/MassApproveAction"));
const usePagination_1 = require("../../../common/components/hosts/usePagination");
const InfraTableToolbar_1 = tslib_1.__importDefault(require("./InfraTableToolbar"));
const use_translation_wrapper_1 = require("../../../common/hooks/use-translation-wrapper");
const agentStatus_1 = require("../helpers/agentStatus");
const helpers_1 = require("../helpers");
const NoFilterMatchState = ({ onClearFilters }) => {
const { t } = (0, use_translation_wrapper_1.useTranslation)();
return (React.createElement(common_1.EmptyState, { title: t('ai:No results found'), content: t('ai:No results match the filter criteria. Clear filters to show results.'), secondaryActions: [
React.createElement(react_core_1.Button, { key: "clear-filters", variant: "link", onClick: onClearFilters }, t('ai:Clear all filters')),
] }));
};
const InfraEnvAgentTable = ({ agents, agentMachines, getClusterDeploymentLink, bareMetalHosts, infraEnv, nmStates, onChangeHostname, onChangeBMHHostname, onMassDeleteHost, agentClusterInstalls, onApprove, onDeleteHost, onEditBMH, onEditHost, onUnbindHost, }) => {
const [isDiscoveryHintModalOpen, setDiscoveryHintModalOpen] = React.useState(false);
const [isMassChangeHostOpen, setMassChangeHostOpen] = React.useState(false);
const [isMassApproveOpen, setMassApproveOpen] = React.useState(false);
const [isMassDeleteOpen, setMassDeleteOpen] = React.useState(false);
const [selectedHostIDs, setSelectedHostIDs] = React.useState([]);
const selectedIDsRef = React.useRef(selectedHostIDs);
selectedIDsRef.current = selectedHostIDs;
const onSelect = React.useCallback((host, isSelected) => {
if (isSelected) {
setSelectedHostIDs([...selectedIDsRef.current, host.id]);
}
else {
setSelectedHostIDs(selectedIDsRef.current.filter((sa) => sa !== host.id));
}
}, []);
const [allHosts, hostActions, actionResolver] = (0, tableUtils_1.useAgentsTable)({
agents,
bmhs: bareMetalHosts,
infraEnv,
agentClusterInstalls,
}, {
onApprove,
onDeleteHost,
onEditBMH,
onEditHost,
onUnbindHost,
});
const { t } = (0, use_translation_wrapper_1.useTranslation)();
const { agentStatuses, bmhStatuses } = React.useMemo(() => ({
agentStatuses: (0, agentStatus_1.agentStatus)(t),
bmhStatuses: (0, agentStatus_1.bmhStatus)(t),
}), [t]);
const { statusCount, hostnameFilter, setHostnameFilter, setStatusFilter, statusFilter, filteredHosts: hosts, sorted, } = (0, tableUtils_1.useAgentsFilter)({
agents,
agentStatuses,
bmhs: bareMetalHosts,
bmhStatuses,
hosts: allHosts,
});
const content = React.useMemo(() => [
(0, tableUtils_1.agentHostnameColumn)(t, hosts, agents, bareMetalHosts, hostActions.onEditHost, hostActions.canEditHostname, hostActions.canEditBMH),
(0, tableUtils_1.discoveryTypeColumn)(agents, bareMetalHosts, t),
(0, tableUtils_1.agentStatusColumn)({
agents,
agentStatuses,
bareMetalHosts,
bmhStatuses,
onEditHostname: onEditHost,
onApprove: onApprove,
t,
}),
(0, tableUtils_1.clusterColumn)(agents, agentMachines, getClusterDeploymentLink, t),
(0, tableUtils_2.discoveredAtColumn)(t),
(0, tableUtils_2.cpuCoresColumn)(t),
(0, tableUtils_2.memoryColumn)(t),
(0, tableUtils_2.disksColumn)(t),
].filter(Boolean), [
t,
hosts,
agents,
bareMetalHosts,
hostActions.onEditHost,
hostActions.canEditHostname,
hostActions.canEditBMH,
agentStatuses,
bmhStatuses,
onEditHost,
onApprove,
agentMachines,
getClusterDeploymentLink,
]);
const selectedAgents = agents.filter((a) => { var _a; return selectedHostIDs.includes(((_a = a.metadata) === null || _a === void 0 ? void 0 : _a.uid) || ''); });
const selectedBMHs = bareMetalHosts.filter((bmh) => { var _a; return selectedHostIDs.includes(((_a = bmh.metadata) === null || _a === void 0 ? void 0 : _a.uid) || ''); });
const canEditHostname = selectedBMHs.some((bmh) => (0, tableUtils_1.canEditBMH)(bmh, t)[0]) ||
selectedAgents.some((a) => (0, tableUtils_1.canEditAgent)(a, agentStatuses, t)[0]);
const massActions = [
React.createElement(react_core_2.DropdownItem, { key: "hostname", onClick: () => setMassChangeHostOpen(!isMassChangeHostOpen), isDisabled: !canEditHostname, description: canEditHostname ? undefined : t('ai:Hostname cannot be changed for selected hosts.') }, t('ai:Change hostname')),
React.createElement(MassApproveAction_1.default, { key: "approve", onApprove: () => setMassApproveOpen(!isMassApproveOpen), selectedAgents: selectedAgents }),
React.createElement(common_1.DeleteHostAction, { key: "delete", onDeleteHost: () => setMassDeleteOpen(!isMassDeleteOpen) }),
];
const paginationProps = (0, usePagination_1.usePagination)(hosts.length);
return (React.createElement(React.Fragment, null,
React.createElement(react_core_1.Stack, { hasGutter: true },
React.createElement(react_core_1.StackItem, null,
React.createElement(InfraTableToolbar_1.default, Object.assign({ hosts: hosts, setSelectedHostIDs: setSelectedHostIDs, massActions: massActions, statusCount: statusCount, hostnameFilter: hostnameFilter, statusFilter: statusFilter, setStatusFilter: setStatusFilter, selectedHostIDs: selectedHostIDs, setHostnameFilter: setHostnameFilter }, paginationProps))),
React.createElement(react_core_1.StackItem, null,
React.createElement(HostsTable_1.default, Object.assign({ hosts: hosts, alreadySorted: sorted, content: content, actionResolver: actionResolver, selectedIDs: selectedHostIDs, setSelectedIDs: setSelectedHostIDs, onSelect: onSelect, ExpandComponent: HostsTable_1.DefaultExpandComponent }, paginationProps), allHosts.length !== hosts.length ? (React.createElement(NoFilterMatchState, { onClearFilters: () => {
setHostnameFilter(undefined);
setStatusFilter([]);
} })) : (React.createElement(HostsTable_1.HostsTableEmptyState, { setDiscoveryHintModalOpen: setDiscoveryHintModalOpen }))))),
isDiscoveryHintModalOpen && (React.createElement(common_1.DiscoveryTroubleshootingModal, { isOpen: isDiscoveryHintModalOpen, setDiscoveryHintModalOpen: setDiscoveryHintModalOpen })),
isMassChangeHostOpen && (React.createElement(common_1.MassChangeHostnameModal, { isOpen: isMassChangeHostOpen, hosts: hosts, selectedHostIDs: selectedHostIDs, onChangeHostname: (0, helpers_1.onAgentChangeHostname)(agents, bareMetalHosts, onChangeHostname, onChangeBMHHostname), onClose: () => setMassChangeHostOpen(false), canChangeHostname: (0, tableUtils_1.canChangeHostname)(agents, agentStatuses, bareMetalHosts, t) })),
isMassDeleteOpen && (React.createElement(modals_1.MassDeleteAgentModal, { isOpen: isMassDeleteOpen, agents: selectedAgents, bmhs: selectedBMHs, infraEnv: infraEnv, nmStates: nmStates, onDelete: onMassDeleteHost, onClose: () => setMassDeleteOpen(false) })),
isMassApproveOpen && (React.createElement(modals_1.MassApproveAgentModal, { isOpen: isMassApproveOpen, agents: selectedAgents, onApprove: onApprove, onClose: () => setMassApproveOpen(false) }))));
};
exports.default = InfraEnvAgentTable;
//# sourceMappingURL=InfraEnvAgentTable.js.map