[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>
This commit is contained in:
Dmitry Tomashevich 2021-09-08 17:33:29 +03:00 committed by GitHub
parent 55b0d535ff
commit c94c4e653a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 58 additions and 22 deletions

View file

@ -96,7 +96,7 @@ function getProps(timefield?: string) {
}) as DataCharts$;
return {
resetQuery: jest.fn(),
resetSavedSearch: jest.fn(),
savedSearch: savedSearchMock,
savedSearchDataChart$: charts$,
savedSearchDataTotalHits$: totalHits$,

View file

@ -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({
<HitsCounter
savedSearchData$={savedSearchDataTotalHits$}
showResetButton={!!(savedSearch && savedSearch.id)}
onResetQuery={resetQuery}
onResetQuery={resetSavedSearch}
/>
</EuiFlexItem>
{!state.hideChart && (

View file

@ -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(),

View file

@ -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}
/>
<EuiPageBody className="dscPageBody" aria-describedby="savedSearchTitle">
<h1 id="savedSearchTitle" className="euiScreenReaderOnly">
@ -246,7 +247,7 @@ export function DiscoverLayout({
<EuiFlexItem grow={false}>
<DiscoverChartMemoized
state={state}
resetQuery={resetQuery}
resetSavedSearch={resetSavedSearch}
savedSearch={savedSearch}
savedSearchDataChart$={charts$}
savedSearchDataTotalHits$={totalHits$}

View file

@ -27,7 +27,7 @@ export interface DiscoverLayoutProps {
navigateTo: (url: string) => void;
onChangeIndexPattern: (id: string) => void;
onUpdateQuery: (payload: { dateRange: TimeRange; query?: Query }, isUpdate?: boolean) => void;
resetQuery: () => void;
resetSavedSearch: () => void;
savedSearch: SavedSearch;
savedSearchData$: SavedSearchData;
savedSearchRefetch$: DataRefetch$;

View file

@ -33,6 +33,7 @@ function getProps(savePermissions = true): DiscoverTopNavProps {
updateQuery: jest.fn(),
onOpenInspector: jest.fn(),
searchSource: {} as ISearchSource,
resetSavedSearch: () => {},
};
}

View file

@ -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) => {

View file

@ -35,6 +35,7 @@ test('getTopNavLinks result', () => {
services,
state,
searchSource: {} as ISearchSource,
onOpenSavedSearch: () => {},
});
expect(topNavLinks).toMatchInlineSnapshot(`
Array [

View file

@ -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,
}),
};

View file

@ -29,7 +29,9 @@ import { OpenSearchPanel } from './open_search_panel';
describe('OpenSearchPanel', () => {
test('render', () => {
const component = shallow(<OpenSearchPanel onClose={jest.fn()} makeUrl={jest.fn()} />);
const component = shallow(
<OpenSearchPanel onClose={jest.fn()} onOpenSavedSearch={jest.fn()} />
);
expect(component).toMatchSnapshot();
});
@ -40,7 +42,9 @@ describe('OpenSearchPanel', () => {
delete: false,
},
});
const component = shallow(<OpenSearchPanel onClose={jest.fn()} makeUrl={jest.fn()} />);
const component = shallow(
<OpenSearchPanel onClose={jest.fn()} onOpenSavedSearch={jest.fn()} />
);
expect(component.find('[data-test-subj="manageSearches"]').exists()).toBe(false);
});
});

View file

@ -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}

View file

@ -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 = (
<I18nContext>
<OpenSearchPanel onClose={onClose} makeUrl={makeUrl} />
<OpenSearchPanel onClose={onClose} onOpenSavedSearch={onOpenSavedSearch} />
</I18nContext>
);
ReactDOM.render(element, container);

View file

@ -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$}

View file

@ -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]
);
/**