[ML] Fix Data visualizer globally pinned filters not saved and query search bar not cleared properly (#136897) (#137525)

* Save globally pinned filters and set merged query to handle empty strings

* Retain filters coming from other apps

* Fix same issues for aiops

* Fix tests

* Add named functions clearFiltersOnLeave

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit 7778027cd7)

Co-authored-by: Quynh Nguyen <43350163+qn895@users.noreply.github.com>
This commit is contained in:
Kibana Machine 2022-07-28 16:27:36 -04:00 committed by GitHub
parent a0b2246b1b
commit ad6f453df7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 50 additions and 28 deletions

View file

@ -188,7 +188,7 @@ export function getEsQueryFromSavedSearch({
// If no saved search available, use user's query and filters
if (!savedSearchData && userQuery) {
if (filterManager && userFilters) filterManager.setFilters(userFilters);
if (filterManager && userFilters) filterManager.addFilters(userFilters);
const combinedQuery = createMergedEsQuery(
userQuery,
@ -207,16 +207,16 @@ export function getEsQueryFromSavedSearch({
// If saved search available, merge saved search with latest user query or filters
// which might differ from extracted saved search data
if (savedSearchData) {
// @ts-ignore property does not exist on type never
const globalFilters = filterManager?.getGlobalFilters();
const currentQuery = userQuery ?? savedSearchData?.query;
// @ts-ignore property does not exist on type never
const currentFilters = userFilters ?? savedSearchData?.filter;
if (filterManager) filterManager.setFilters(currentFilters);
if (globalFilters) filterManager?.addFilters(globalFilters);
const combinedQuery = createMergedEsQuery(
currentQuery,
Array.isArray(currentFilters) ? currentFilters : [],
filterManager ? filterManager?.getFilters() : currentFilters,
dataView,
uiSettings
);

View file

@ -22,7 +22,7 @@ import {
import type { DataView } from '@kbn/data-views-plugin/public';
import type { WindowParameters } from '@kbn/aiops-utils';
import type { ChangePoint } from '@kbn/ml-agg-utils';
import { Filter, Query } from '@kbn/es-query';
import { Filter, FilterStateStore, Query } from '@kbn/es-query';
import { FormattedMessage } from '@kbn/i18n-react';
import { SavedSearch } from '@kbn/discover-plugin/public';
@ -125,14 +125,20 @@ export const ExplainLogRateSpikesPage: FC<ExplainLogRateSpikesPageProps> = ({
? overallDocStats.totalCount + selectedDocStats.totalCount
: overallDocStats.totalCount;
useEffect(() => {
return () => {
// When navigating away from the index pattern
// Reset all previously set filters
// to make sure new page doesn't have unrelated filters
dataService.query.filterManager.removeAll();
};
}, [dataView.id, dataService.query.filterManager]);
useEffect(
// TODO: Consolidate this hook/function with with Data visualizer's
function clearFiltersOnLeave() {
return () => {
// We want to clear all filters that have not been pinned globally
// when navigating to other pages
dataService.query.filterManager
.getFilters()
.filter((f) => f.$state?.store === FilterStateStore.APP_STATE)
.forEach((f) => dataService.query.filterManager.removeFilter(f));
};
},
[dataService.query.filterManager]
);
const [windowParameters, setWindowParameters] = useState<WindowParameters | undefined>();

View file

@ -47,6 +47,7 @@ export const useData = (
/** Prepare required params to pass to search strategy **/
const { searchQueryLanguage, searchString, searchQuery } = useMemo(() => {
const filterManager = data.query.filterManager;
const searchData = getEsQueryFromSavedSearch({
dataView: currentDataView,
uiSettings,
@ -56,7 +57,10 @@ export const useData = (
if (searchData === undefined || aiopsListState.searchString !== '') {
if (aiopsListState.filters) {
services.data.query.filterManager.setFilters(aiopsListState.filters);
const globalFilters = filterManager?.getGlobalFilters();
if (filterManager) filterManager.setFilters(aiopsListState.filters);
if (globalFilters) filterManager?.addFilters(globalFilters);
}
return {
searchQuery: aiopsListState.searchQuery,

View file

@ -20,7 +20,7 @@ import {
} from '@elastic/eui';
import { Required } from 'utility-types';
import { i18n } from '@kbn/i18n';
import { Filter, Query } from '@kbn/es-query';
import { Filter, FilterStateStore, Query } from '@kbn/es-query';
import { generateFilters } from '@kbn/data-plugin/public';
import { DataView, DataViewField } from '@kbn/data-views-plugin/public';
import { DV_RANDOM_SAMPLER_PREFERENCE, useStorage } from '../../hooks/use_storage';
@ -304,14 +304,19 @@ export const IndexDataVisualizerView: FC<IndexDataVisualizerViewProps> = (dataVi
setDataVisualizerListState({ ...dataVisualizerListState, probability: value });
};
useEffect(() => {
return () => {
// When navigating away from the index pattern
// Reset all previously set filters
// to make sure new page doesn't have unrelated filters
data.query.filterManager.removeAll();
};
}, [currentDataView.id, data.query.filterManager]);
useEffect(
function clearFiltersOnLeave() {
return () => {
// We want to clear all filters that have not been pinned globally
// when navigating to other pages
data.query.filterManager
.getFilters()
.filter((f) => f.$state?.store === FilterStateStore.APP_STATE)
.forEach((f) => data.query.filterManager.removeFilter(f));
};
},
[data.query.filterManager]
);
useEffect(() => {
// Force refresh on index pattern change

View file

@ -11,6 +11,7 @@ import { i18n } from '@kbn/i18n';
import { Query, Filter } from '@kbn/es-query';
import type { TimeRange } from '@kbn/es-query';
import { DataView, DataViewField } from '@kbn/data-views-plugin/public';
import { isDefined } from '../../../common/util/is_defined';
import { ShardSizeFilter } from './shard_size_select';
import { DataVisualizerFieldNamesFilter } from './field_name_filter';
import { DataVisualizerFieldTypeFilter } from './field_type_filter';
@ -87,8 +88,8 @@ export const SearchPanel: FC<Props> = ({
}, [searchQueryLanguage, searchString, queryManager.filterManager]);
const searchHandler = ({ query, filters }: { query?: Query; filters?: Filter[] }) => {
const mergedQuery = query ?? searchInput;
const mergedFilters = filters ?? queryManager.filterManager.getFilters();
const mergedQuery = isDefined(query) ? query : searchInput;
const mergedFilters = isDefined(filters) ? filters : queryManager.filterManager.getFilters();
try {
if (mergedFilters) {
queryManager.filterManager.setFilters(mergedFilters);

View file

@ -90,6 +90,7 @@ export const useDataVisualizerGridData = (
/** Prepare required params to pass to search strategy **/
const { searchQueryLanguage, searchString, searchQuery } = useMemo(() => {
const filterManager = data.query.filterManager;
const searchData = getEsQueryFromSavedSearch({
dataView: currentDataView,
uiSettings,
@ -101,7 +102,10 @@ export const useDataVisualizerGridData = (
if (searchData === undefined || dataVisualizerListState.searchString !== '') {
if (dataVisualizerListState.filters) {
data.query.filterManager.setFilters(dataVisualizerListState.filters);
const globalFilters = filterManager?.getGlobalFilters();
if (filterManager) filterManager.setFilters(dataVisualizerListState.filters);
if (globalFilters) filterManager?.addFilters(globalFilters);
}
return {
searchQuery: dataVisualizerListState.searchQuery,

View file

@ -174,7 +174,7 @@ export function getEsQueryFromSavedSearch({
// If no saved search available, use user's query and filters
if (!savedSearchData && userQuery) {
if (filterManager && userFilters) filterManager.setFilters(userFilters);
if (filterManager && userFilters) filterManager.addFilters(userFilters, false);
const combinedQuery = createMergedEsQuery(
userQuery,
@ -193,14 +193,16 @@ export function getEsQueryFromSavedSearch({
// If saved search available, merge saved search with latest user query or filters
// which might differ from extracted saved search data
if (savedSearchData) {
const globalFilters = filterManager?.getGlobalFilters();
const currentQuery = userQuery ?? savedSearchData?.query;
const currentFilters = userFilters ?? savedSearchData?.filter;
if (filterManager) filterManager.setFilters(currentFilters);
if (globalFilters) filterManager?.addFilters(globalFilters);
const combinedQuery = createMergedEsQuery(
currentQuery,
Array.isArray(currentFilters) ? currentFilters : [],
filterManager ? filterManager?.getFilters() : currentFilters,
dataView,
uiSettings
);