From c94c4e653a5ab4b64ebb152b5d81730c77f70ecd Mon Sep 17 00:00:00 2001
From: Dmitry Tomashevich <39378793+Dmitriynj@users.noreply.github.com>
Date: Wed, 8 Sep 2021 17:33:29 +0300
Subject: [PATCH] [Discover] Fix opening the same saved search (#111127)
* [Discover] fix opening the same saved search
* [Discover] fix functional test
* [Discover] apply suggestion
* [Discover] apply suggestion
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
---
.../components/chart/discover_chart.test.tsx | 2 +-
.../main/components/chart/discover_chart.tsx | 6 ++--
.../layout/discover_layout.test.tsx | 2 +-
.../components/layout/discover_layout.tsx | 5 ++--
.../apps/main/components/layout/types.ts | 2 +-
.../top_nav/discover_topnav.test.tsx | 1 +
.../components/top_nav/discover_topnav.tsx | 30 +++++++++++++++++--
.../top_nav/get_top_nav_links.test.ts | 1 +
.../components/top_nav/get_top_nav_links.ts | 4 ++-
.../top_nav/open_search_panel.test.tsx | 8 +++--
.../components/top_nav/open_search_panel.tsx | 4 +--
.../top_nav/show_open_search_panel.tsx | 6 ++--
.../apps/main/discover_main_app.tsx | 4 +--
.../apps/main/services/use_discover_state.ts | 5 ++--
14 files changed, 58 insertions(+), 22 deletions(-)
diff --git a/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.test.tsx b/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.test.tsx
index dc3c9ebbc75c..732dee6106b3 100644
--- a/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.test.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.test.tsx
@@ -96,7 +96,7 @@ function getProps(timefield?: string) {
}) as DataCharts$;
return {
- resetQuery: jest.fn(),
+ resetSavedSearch: jest.fn(),
savedSearch: savedSearchMock,
savedSearchDataChart$: charts$,
savedSearchDataTotalHits$: totalHits$,
diff --git a/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.tsx b/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.tsx
index 7d761aa93b80..2a4e4a06b612 100644
--- a/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/chart/discover_chart.tsx
@@ -21,7 +21,7 @@ import { DiscoverServices } from '../../../../../build_services';
const TimechartHeaderMemoized = memo(TimechartHeader);
const DiscoverHistogramMemoized = memo(DiscoverHistogram);
export function DiscoverChart({
- resetQuery,
+ resetSavedSearch,
savedSearch,
savedSearchDataChart$,
savedSearchDataTotalHits$,
@@ -30,7 +30,7 @@ export function DiscoverChart({
stateContainer,
timefield,
}: {
- resetQuery: () => void;
+ resetSavedSearch: () => void;
savedSearch: SavedSearch;
savedSearchDataChart$: DataCharts$;
savedSearchDataTotalHits$: DataTotalHits$;
@@ -88,7 +88,7 @@ export function DiscoverChart({
{!state.hideChart && (
diff --git a/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.test.tsx b/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.test.tsx
index 7343760f32d1..79dfc9b77f90 100644
--- a/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.test.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.test.tsx
@@ -135,7 +135,7 @@ function getProps(indexPattern: IndexPattern): DiscoverLayoutProps {
navigateTo: jest.fn(),
onChangeIndexPattern: jest.fn(),
onUpdateQuery: jest.fn(),
- resetQuery: jest.fn(),
+ resetSavedSearch: jest.fn(),
savedSearch: savedSearchMock,
savedSearchData$,
savedSearchRefetch$: new Subject(),
diff --git a/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.tsx b/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.tsx
index 6d241468bdf7..ce745fecbbfa 100644
--- a/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/layout/discover_layout.tsx
@@ -57,7 +57,7 @@ export function DiscoverLayout({
onChangeIndexPattern,
onUpdateQuery,
savedSearchRefetch$,
- resetQuery,
+ resetSavedSearch,
savedSearchData$,
savedSearch,
searchSource,
@@ -165,6 +165,7 @@ export function DiscoverLayout({
services={services}
stateContainer={stateContainer}
updateQuery={onUpdateQuery}
+ resetSavedSearch={resetSavedSearch}
/>
@@ -246,7 +247,7 @@ export function DiscoverLayout({
void;
onChangeIndexPattern: (id: string) => void;
onUpdateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
- resetQuery: () => void;
+ resetSavedSearch: () => void;
savedSearch: SavedSearch;
savedSearchData$: SavedSearchData;
savedSearchRefetch$: DataRefetch$;
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.test.tsx b/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.test.tsx
index 687532cd94f0..4b572f6e348b 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.test.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.test.tsx
@@ -33,6 +33,7 @@ function getProps(savePermissions = true): DiscoverTopNavProps {
updateQuery: jest.fn(),
onOpenInspector: jest.fn(),
searchSource: {} as ISearchSource,
+ resetSavedSearch: () => {},
};
}
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.tsx b/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.tsx
index 9afda7340108..5e3e2dfd9695 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/discover_topnav.tsx
@@ -5,7 +5,8 @@
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
-import React, { useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
+import { useHistory } from 'react-router-dom';
import { DiscoverLayoutProps } from '../layout/types';
import { getTopNavLinks } from './get_top_nav_links';
import { Query, TimeRange } from '../../../../../../../data/common/query';
@@ -21,6 +22,7 @@ export type DiscoverTopNavProps = Pick<
savedQuery?: string;
updateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
stateContainer: GetStateReturn;
+ resetSavedSearch: () => void;
};
export const DiscoverTopNav = ({
@@ -34,9 +36,23 @@ export const DiscoverTopNav = ({
navigateTo,
savedSearch,
services,
+ resetSavedSearch,
}: DiscoverTopNavProps) => {
+ const history = useHistory();
const showDatePicker = useMemo(() => indexPattern.isTimeBased(), [indexPattern]);
const { TopNavMenu } = services.navigation.ui;
+
+ const onOpenSavedSearch = useCallback(
+ (newSavedSearchId: string) => {
+ if (savedSearch.id && savedSearch.id === newSavedSearchId) {
+ resetSavedSearch();
+ } else {
+ history.push(`/view/${encodeURIComponent(newSavedSearchId)}`);
+ }
+ },
+ [history, resetSavedSearch, savedSearch.id]
+ );
+
const topNavMenu = useMemo(
() =>
getTopNavLinks({
@@ -47,8 +63,18 @@ export const DiscoverTopNav = ({
state: stateContainer,
onOpenInspector,
searchSource,
+ onOpenSavedSearch,
}),
- [indexPattern, navigateTo, onOpenInspector, searchSource, stateContainer, savedSearch, services]
+ [
+ indexPattern,
+ navigateTo,
+ savedSearch,
+ services,
+ stateContainer,
+ onOpenInspector,
+ searchSource,
+ onOpenSavedSearch,
+ ]
);
const updateSavedQueryId = (newSavedQueryId: string | undefined) => {
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.test.ts b/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.test.ts
index 6a6fb8a44a5c..fd918429b57d 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.test.ts
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.test.ts
@@ -35,6 +35,7 @@ test('getTopNavLinks result', () => {
services,
state,
searchSource: {} as ISearchSource,
+ onOpenSavedSearch: () => {},
});
expect(topNavLinks).toMatchInlineSnapshot(`
Array [
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.ts b/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.ts
index f19b30cda5f8..f7b4a35b4cf8 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.ts
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/get_top_nav_links.ts
@@ -29,6 +29,7 @@ export const getTopNavLinks = ({
state,
onOpenInspector,
searchSource,
+ onOpenSavedSearch,
}: {
indexPattern: IndexPattern;
navigateTo: (url: string) => void;
@@ -37,6 +38,7 @@ export const getTopNavLinks = ({
state: GetStateReturn;
onOpenInspector: () => void;
searchSource: ISearchSource;
+ onOpenSavedSearch: (id: string) => void;
}) => {
const options = {
id: 'options',
@@ -89,7 +91,7 @@ export const getTopNavLinks = ({
testId: 'discoverOpenButton',
run: () =>
showOpenSearchPanel({
- makeUrl: (searchId) => `#/view/${encodeURIComponent(searchId)}`,
+ onOpenSavedSearch,
I18nContext: services.core.i18n.Context,
}),
};
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.test.tsx b/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.test.tsx
index 5080d1d61c88..dc5d3e81744d 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.test.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.test.tsx
@@ -29,7 +29,9 @@ import { OpenSearchPanel } from './open_search_panel';
describe('OpenSearchPanel', () => {
test('render', () => {
- const component = shallow();
+ const component = shallow(
+
+ );
expect(component).toMatchSnapshot();
});
@@ -40,7 +42,9 @@ describe('OpenSearchPanel', () => {
delete: false,
},
});
- const component = shallow();
+ const component = shallow(
+
+ );
expect(component.find('[data-test-subj="manageSearches"]').exists()).toBe(false);
});
});
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.tsx b/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.tsx
index 31026a1e0ab5..1b34e6ffa0b9 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/open_search_panel.tsx
@@ -27,7 +27,7 @@ const SEARCH_OBJECT_TYPE = 'search';
interface OpenSearchPanelProps {
onClose: () => void;
- makeUrl: (id: string) => string;
+ onOpenSavedSearch: (id: string) => void;
}
export function OpenSearchPanel(props: OpenSearchPanelProps) {
@@ -70,7 +70,7 @@ export function OpenSearchPanel(props: OpenSearchPanelProps) {
},
]}
onChoose={(id) => {
- window.location.assign(props.makeUrl(id));
+ props.onOpenSavedSearch(id);
props.onClose();
}}
uiSettings={uiSettings}
diff --git a/src/plugins/discover/public/application/apps/main/components/top_nav/show_open_search_panel.tsx b/src/plugins/discover/public/application/apps/main/components/top_nav/show_open_search_panel.tsx
index bb306396c4ca..1a9bfd7e30c5 100644
--- a/src/plugins/discover/public/application/apps/main/components/top_nav/show_open_search_panel.tsx
+++ b/src/plugins/discover/public/application/apps/main/components/top_nav/show_open_search_panel.tsx
@@ -14,11 +14,11 @@ import { OpenSearchPanel } from './open_search_panel';
let isOpen = false;
export function showOpenSearchPanel({
- makeUrl,
I18nContext,
+ onOpenSavedSearch,
}: {
- makeUrl: (path: string) => string;
I18nContext: I18nStart['Context'];
+ onOpenSavedSearch: (id: string) => void;
}) {
if (isOpen) {
return;
@@ -35,7 +35,7 @@ export function showOpenSearchPanel({
document.body.appendChild(container);
const element = (
-
+
);
ReactDOM.render(element, container);
diff --git a/src/plugins/discover/public/application/apps/main/discover_main_app.tsx b/src/plugins/discover/public/application/apps/main/discover_main_app.tsx
index 456f4ebfab62..7ee9ab44f9a7 100644
--- a/src/plugins/discover/public/application/apps/main/discover_main_app.tsx
+++ b/src/plugins/discover/public/application/apps/main/discover_main_app.tsx
@@ -92,7 +92,7 @@ export function DiscoverMainApp(props: DiscoverMainProps) {
addHelpMenuToAppChrome(chrome, docLinks);
}, [stateContainer, chrome, docLinks]);
- const resetQuery = useCallback(() => {
+ const resetCurrentSavedSearch = useCallback(() => {
resetSavedSearch(savedSearch.id);
}, [resetSavedSearch, savedSearch]);
@@ -103,7 +103,7 @@ export function DiscoverMainApp(props: DiscoverMainProps) {
inspectorAdapters={inspectorAdapters}
onChangeIndexPattern={onChangeIndexPattern}
onUpdateQuery={onUpdateQuery}
- resetQuery={resetQuery}
+ resetSavedSearch={resetCurrentSavedSearch}
navigateTo={navigateTo}
savedSearch={savedSearch}
savedSearchData$={data$}
diff --git a/src/plugins/discover/public/application/apps/main/services/use_discover_state.ts b/src/plugins/discover/public/application/apps/main/services/use_discover_state.ts
index afe010379cff..e11a9937111a 100644
--- a/src/plugins/discover/public/application/apps/main/services/use_discover_state.ts
+++ b/src/plugins/discover/public/application/apps/main/services/use_discover_state.ts
@@ -148,7 +148,8 @@ export function useDiscoverState({
const resetSavedSearch = useCallback(
async (id?: string) => {
const newSavedSearch = await services.getSavedSearchById(id);
- newSavedSearch.searchSource.setField('index', indexPattern);
+ const newIndexPattern = newSavedSearch.searchSource.getField('index') || indexPattern;
+ newSavedSearch.searchSource.setField('index', newIndexPattern);
const newAppState = getStateDefaults({
config,
data,
@@ -157,7 +158,7 @@ export function useDiscoverState({
await stateContainer.replaceUrlAppState(newAppState);
setState(newAppState);
},
- [services, indexPattern, config, data, stateContainer]
+ [indexPattern, services, config, data, stateContainer]
);
/**