diff --git a/graylog2-web-interface/src/components/event-definitions/event-definitions/EventDefinitionsContainer.tsx b/graylog2-web-interface/src/components/event-definitions/event-definitions/EventDefinitionsContainer.tsx
index b437189e16c1..2daf2630c90c 100644
--- a/graylog2-web-interface/src/components/event-definitions/event-definitions/EventDefinitionsContainer.tsx
+++ b/graylog2-web-interface/src/components/event-definitions/event-definitions/EventDefinitionsContainer.tsx
@@ -27,6 +27,7 @@ import Routes from 'routing/Routes';
import type { ColumnRenderers } from 'components/common/EntityDataTable';
import FilterValueRenderers from 'components/streams/StreamsOverview/FilterValueRenderers';
import { keyFn, fetchEventDefinitions } from 'components/event-definitions/hooks/useEventDefinitions';
+import useTableComponents from 'components/event-definitions/event-definitions/useTableComponents';
import EventDefinitionActions from './EventDefinitionActions';
import SchedulingCell from './SchedulingCell';
@@ -71,6 +72,8 @@ const EventDefinitionsContainer = () => {
), []);
+ const { bulkSelection } = useTableComponents();
+
return (
humanName="event definitions"
columnsOrder={COLUMNS_ORDER}
@@ -82,7 +85,8 @@ const EventDefinitionsContainer = () => {
keyFn={keyFn}
entityAttributesAreCamelCase={false}
filterValueRenderers={FilterValueRenderers}
- columnRenderers={columnRenderers} />
+ columnRenderers={columnRenderers}
+ bulkSelection={bulkSelection} />
);
};
diff --git a/graylog2-web-interface/src/components/event-definitions/event-definitions/useTableComponents.tsx b/graylog2-web-interface/src/components/event-definitions/event-definitions/useTableComponents.tsx
new file mode 100644
index 000000000000..350f8883787d
--- /dev/null
+++ b/graylog2-web-interface/src/components/event-definitions/event-definitions/useTableComponents.tsx
@@ -0,0 +1,45 @@
+/*
+ * Copyright (C) 2020 Graylog, Inc.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the Server Side Public License, version 1,
+ * as published by MongoDB, Inc.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * Server Side Public License for more details.
+ *
+ * You should have received a copy of the Server Side Public License
+ * along with this program. If not, see
+ * .
+ */
+import * as React from 'react';
+import { useMemo, useState } from 'react';
+
+import type { EventDefinition } from 'components/event-definitions/event-definitions-types';
+
+import BulkActions from './BulkActions';
+
+const useTableElements = () => {
+ const [selectedEntitiesData, setSelectedEntitiesData] = useState<{[eventDefinitionId: string]: EventDefinition}>({});
+ const bulkSelection = useMemo(() => ({
+ onChangeSelection: (selectedItemsIds: Array, list: Array) => {
+ setSelectedEntitiesData((cur) => {
+ const uniqueSelectedIds = [...new Set(selectedItemsIds)];
+ const eventDefinitionsMap = Object.fromEntries(list.map((event) => [event.id, event]));
+
+ return Object.fromEntries(uniqueSelectedIds.map((selectedItemId) => [selectedItemId, cur[selectedItemId] ?? eventDefinitionsMap[selectedItemId]]));
+ });
+ },
+ actions: ,
+
+ }), [selectedEntitiesData]);
+
+ return {
+ bulkActions: ,
+ bulkSelection,
+ };
+};
+
+export default useTableElements;