From 562b0639c41a3e5cc8f154d5abb884537398d577 Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Thu, 9 Sep 2021 15:35:15 +0100 Subject: [PATCH 1/4] use existing filterManager --- .../hover_actions/use_hover_action_items.tsx | 15 +++++++++------ .../timeline/query_tab_content/index.tsx | 15 +++++++++++++-- .../public/timelines/store/timeline/helpers.ts | 1 + 3 files changed, 23 insertions(+), 8 deletions(-) diff --git a/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx b/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx index f717a72ab8ad5..53b33e063de0f 100644 --- a/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx +++ b/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx @@ -20,6 +20,7 @@ import { SourcererScopeName } from '../../store/sourcerer/model'; import { useSourcererScope } from '../../containers/sourcerer'; import { timelineSelectors } from '../../../timelines/store/timeline'; import { ShowTopNButton } from './actions/show_top_n'; +import { FilterManager } from '../../../../../../../src/plugins/data/public'; export interface UseHoverActionItemsProps { dataProvider?: DataProvider | DataProvider[]; @@ -68,13 +69,13 @@ export const useHoverActionItems = ({ ownFocus, showTopN, stKeyboardEvent, - timelineId, + timelineId = 'timeline-1', toggleColumn, toggleTopN, values, }: UseHoverActionItemsProps): UseHoverActionItems => { const kibana = useKibana(); - const { timelines } = kibana.services; + const { timelines, uiSettings } = kibana.services; // Common actions used by the alert table and alert flyout const { getAddToTimelineButton, @@ -84,17 +85,19 @@ export const useHoverActionItems = ({ getFilterOutValueButton, getOverflowButton, } = timelines.getHoverActions(); - const filterManagerBackup = useMemo(() => kibana.services.data.query.filterManager, [ kibana.services.data.query.filterManager, ]); const getManageTimeline = useMemo(() => timelineSelectors.getManageTimelineById(), []); - const { filterManager: activeFilterMananager } = useDeepEqualSelector((state) => + const { filterManager: activeFilterManager } = useDeepEqualSelector((state) => getManageTimeline(state, timelineId ?? '') ); const filterManager = useMemo( - () => (timelineId === TimelineId.active ? activeFilterMananager : filterManagerBackup), - [timelineId, activeFilterMananager, filterManagerBackup] + () => + timelineId === TimelineId.active + ? activeFilterManager ?? new FilterManager(uiSettings) + : filterManagerBackup, + [uiSettings, timelineId, activeFilterManager, filterManagerBackup] ); // Regarding data from useManageTimeline: diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx index abbb991c274da..63e4497c116d1 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx @@ -60,6 +60,7 @@ import { activeTimeline } from '../../../containers/active_timeline_context'; import { DetailsPanel } from '../../side_panel'; import { ExitFullScreen } from '../../../../common/components/exit_full_screen'; import { defaultControlColumn } from '../body/control_columns'; +import { useDeepEqualSelector } from '../../../../common/hooks/use_selector'; const TimelineHeaderContainer = styled.div` margin-top: 6px; @@ -193,7 +194,17 @@ export const QueryTabContentComponent: React.FC = ({ } = useSourcererScope(SourcererScopeName.timeline); const { uiSettings } = useKibana().services; - const [filterManager] = useState(new FilterManager(uiSettings)); + + const getManageTimeline = useMemo(() => timelineSelectors.getManageTimelineById(), []); + const { filterManager: activeFilterManager } = useDeepEqualSelector((state) => + getManageTimeline(state, timelineId ?? '') + ); + + const filterManager = useMemo(() => activeFilterManager ?? new FilterManager(uiSettings), [ + activeFilterManager, + uiSettings, + ]); + const esQueryConfig = useMemo(() => esQuery.getEsQueryConfig(uiSettings), [uiSettings]); const kqlQuery: { query: string; @@ -256,7 +267,7 @@ export const QueryTabContentComponent: React.FC = ({ id: timelineId, }) ); - }, [filterManager, timelineId, dispatch]); + }, [activeFilterManager, dispatch, filterManager, timelineId, uiSettings]); const [ isQueryLoading, diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts index 7c07410a2789a..c46e3d328012e 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts @@ -155,6 +155,7 @@ export const addTimelineToStore = ({ return { ...timelineById, [id]: { + ...(timelineById[id] ? timelineById[id] : {}), ...timeline, isLoading: timelineById[id].isLoading, initialized: timelineById[id].initialized, From c710b0b3571af93aa3ea3c0f2d614c37441f93e1 Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Thu, 9 Sep 2021 15:43:17 +0100 Subject: [PATCH 2/4] remove unused default value --- .../common/components/hover_actions/use_hover_action_items.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx b/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx index 53b33e063de0f..7d480c9e4b04f 100644 --- a/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx +++ b/x-pack/plugins/security_solution/public/common/components/hover_actions/use_hover_action_items.tsx @@ -69,7 +69,7 @@ export const useHoverActionItems = ({ ownFocus, showTopN, stKeyboardEvent, - timelineId = 'timeline-1', + timelineId, toggleColumn, toggleTopN, values, From 030b001c002751144288dd288f9de80ed98f6627 Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Fri, 10 Sep 2021 11:38:45 +0100 Subject: [PATCH 3/4] unit test --- .../timeline/query_tab_content/index.tsx | 2 +- .../public/timelines/store/timeline/helpers.ts | 2 +- .../timelines/store/timeline/reducer.test.ts | 15 +++++++++++++++ 3 files changed, 17 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx index 63e4497c116d1..3dc2d98f16462 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/query_tab_content/index.tsx @@ -14,7 +14,7 @@ import { EuiBadge, } from '@elastic/eui'; import { isEmpty } from 'lodash/fp'; -import React, { useState, useMemo, useEffect, useCallback } from 'react'; +import React, { useMemo, useEffect, useCallback } from 'react'; import styled from 'styled-components'; import { Dispatch } from 'redux'; import { connect, ConnectedProps, useDispatch } from 'react-redux'; diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts index c46e3d328012e..6ee844958aeed 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/helpers.ts @@ -155,8 +155,8 @@ export const addTimelineToStore = ({ return { ...timelineById, [id]: { - ...(timelineById[id] ? timelineById[id] : {}), ...timeline, + filterManager: timelineById[id].filterManager, isLoading: timelineById[id].isLoading, initialized: timelineById[id].initialized, dateRange: diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts index c0dcba6920b60..c4061b7d845a5 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts @@ -97,6 +97,7 @@ const basicTimeline: TimelineModel = { eventIdToNoteIds: {}, excludedRowRendererIds: [], expandedDetail: {}, + filterManager: 'mockFilterManager', highlightedDropAndProviderId: '', historyIds: [], id: 'foo', @@ -194,6 +195,20 @@ describe('Timeline', () => { }, }); }); + + test('should contain existing filterManager', () => { + const update = addTimelineToStore({ + id: 'foo', + timeline: { + ...basicTimeline, + status: TimelineStatus.immutable, + timelineType: TimelineType.template, + }, + timelineById: timelineByIdMock, + }); + + expect(update.foo.filterManager).toEqual('mockFilterManager'); + }); }); describe('#addNewTimeline', () => { From bc5fc059ff124824647f4dd163e32db44a79e68e Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Fri, 10 Sep 2021 16:47:46 +0100 Subject: [PATCH 4/4] fix type --- .../public/timelines/store/timeline/reducer.test.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts index c4061b7d845a5..eceafb9b56cdd 100644 --- a/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts +++ b/x-pack/plugins/security_solution/public/timelines/store/timeline/reducer.test.ts @@ -52,6 +52,7 @@ import { TimelineModel } from './model'; import { timelineDefaults } from './defaults'; import { TimelineById } from './types'; import { Direction } from '../../../../common/search_strategy'; +import { FilterManager } from '../../../../../../../src/plugins/data/public'; jest.mock('../../../common/components/url_state/normalize_time_range.ts'); jest.mock('../../../common/utils/default_date_settings', () => { @@ -63,6 +64,8 @@ jest.mock('../../../common/utils/default_date_settings', () => { }; }); +const mockFilterManager = {} as FilterManager; + const basicDataProvider: DataProvider = { and: [], id: '123', @@ -97,7 +100,7 @@ const basicTimeline: TimelineModel = { eventIdToNoteIds: {}, excludedRowRendererIds: [], expandedDetail: {}, - filterManager: 'mockFilterManager', + filterManager: mockFilterManager, highlightedDropAndProviderId: '', historyIds: [], id: 'foo', @@ -207,7 +210,7 @@ describe('Timeline', () => { timelineById: timelineByIdMock, }); - expect(update.foo.filterManager).toEqual('mockFilterManager'); + expect(update.foo.filterManager).toEqual(mockFilterManager); }); });