From 3877763e118b9e20b88eb9f89eb083d4581679fc Mon Sep 17 00:00:00 2001 From: Pablo Machado Date: Wed, 13 Apr 2022 11:43:12 +0200 Subject: [PATCH] Fix explore tables don't display data when a global filter is applied (#130024) --- .../common/components/search_bar/index.tsx | 46 +++++++++++++++---- 1 file changed, 37 insertions(+), 9 deletions(-) diff --git a/x-pack/plugins/security_solution/public/common/components/search_bar/index.tsx b/x-pack/plugins/security_solution/public/common/components/search_bar/index.tsx index d5624421c0006..48b4acbf4d008 100644 --- a/x-pack/plugins/security_solution/public/common/components/search_bar/index.tsx +++ b/x-pack/plugins/security_solution/public/common/components/search_bar/index.tsx @@ -8,7 +8,7 @@ import { set } from '@elastic/safer-lodash-set/fp'; import { getOr } from 'lodash/fp'; import React, { memo, useEffect, useCallback, useMemo } from 'react'; -import { connect, ConnectedProps } from 'react-redux'; +import { connect, ConnectedProps, useDispatch } from 'react-redux'; import { Dispatch } from 'redux'; import { Subscription } from 'rxjs'; import styled from 'styled-components'; @@ -35,10 +35,11 @@ import { startSelector, toStrSelector, } from './selectors'; -import { hostsActions } from '../../../hosts/store'; -import { networkActions } from '../../../network/store'; import { timelineActions } from '../../../timelines/store/timeline'; import { useKibana } from '../../lib/kibana'; +import { usersActions } from '../../../users/store'; +import { hostsActions } from '../../../hosts/store'; +import { networkActions } from '../../../network/store'; const APP_STATE_STORAGE_KEY = 'securitySolution.searchBar.appState'; @@ -91,16 +92,25 @@ export const SearchBarComponent = memo( }, } = useKibana().services; + const dispatch = useDispatch(); + const setTablesActivePageToZero = useCallback(() => { + dispatch(usersActions.setUsersTablesActivePageToZero()); + dispatch(hostsActions.setHostTablesActivePageToZero()); + dispatch(networkActions.setNetworkTablesActivePageToZero()); + }, [dispatch]); + useEffect(() => { if (fromStr != null && toStr != null) { timefilter.setTime({ from: fromStr, to: toStr }); } else if (start != null && end != null) { + setTablesActivePageToZero(); + timefilter.setTime({ from: new Date(start).toISOString(), to: new Date(end).toISOString(), }); } - }, [end, fromStr, start, timefilter, toStr]); + }, [end, fromStr, start, timefilter, toStr, setTablesActivePageToZero]); const onQuerySubmit = useCallback( (payload: { dateRange: TimeRange; query?: Query }) => { @@ -119,6 +129,7 @@ export const SearchBarComponent = memo( isQuickSelection, updateTime: false, filterManager, + setTablesActivePageToZero, }; let isStateUpdated = false; @@ -164,6 +175,7 @@ export const SearchBarComponent = memo( filterQuery, queries, updateSearch, + setTablesActivePageToZero, ] ); @@ -178,12 +190,13 @@ export const SearchBarComponent = memo( isQuickSelection: true, updateTime: true, filterManager, + setTablesActivePageToZero, }); } else { queries.forEach((q) => q.refetch && (q.refetch as inputsModel.Refetch)()); } }, - [updateSearch, id, filterManager, queries] + [updateSearch, id, filterManager, queries, setTablesActivePageToZero] ); const onSaved = useCallback( @@ -209,6 +222,7 @@ export const SearchBarComponent = memo( isQuickSelection, updateTime: false, filterManager, + setTablesActivePageToZero, }; if (savedQueryUpdated.attributes.timefilter) { @@ -226,7 +240,7 @@ export const SearchBarComponent = memo( updateSearch(updateSearchBar); }, - [id, toStr, end, fromStr, start, filterManager, updateSearch] + [id, toStr, end, fromStr, start, filterManager, updateSearch, setTablesActivePageToZero] ); const onClearSavedQuery = useCallback(() => { @@ -246,9 +260,20 @@ export const SearchBarComponent = memo( resetSavedQuery: true, savedQuery: undefined, filterManager, + setTablesActivePageToZero, }); } - }, [savedQuery, updateSearch, id, toStr, end, fromStr, start, filterManager]); + }, [ + savedQuery, + updateSearch, + id, + toStr, + end, + fromStr, + start, + filterManager, + setTablesActivePageToZero, + ]); const saveAppStateToStorage = useCallback( (filters: Filter[]) => storage.set(APP_STATE_STORAGE_KEY, filters), @@ -273,6 +298,8 @@ export const SearchBarComponent = memo( id, filters: filterManager.getFilters(), }); + + setTablesActivePageToZero(); } }, }) @@ -369,6 +396,7 @@ interface UpdateReduxSearchBar extends OnTimeChangeProps { resetSavedQuery?: boolean; timelineId?: string; updateTime: boolean; + setTablesActivePageToZero: () => void; } export const dispatchUpdateSearch = @@ -385,6 +413,7 @@ export const dispatchUpdateSearch = timelineId, filterManager, updateTime = false, + setTablesActivePageToZero, }: UpdateReduxSearchBar): void => { if (updateTime) { const fromDate = formatDate(start); @@ -446,8 +475,7 @@ export const dispatchUpdateSearch = dispatch(inputsActions.setSavedQuery({ id, savedQuery })); } - dispatch(hostsActions.setHostTablesActivePageToZero()); - dispatch(networkActions.setNetworkTablesActivePageToZero()); + setTablesActivePageToZero(); }; const mapDispatchToProps = (dispatch: Dispatch) => ({