[Discover] Show "Unsaved changes" badge on time filter changes in case time range is stored along with saved search

src/plugins/discover/public/__mocks__/saved_search.ts

@@ -17,6 +17,8 @@ export const savedSearchMock = {
   id: 'the-saved-search-id',
   title: 'A saved search',
   searchSource: createSearchSourceMock({ index: dataViewMock }),
+  columns: ['default_column'],
+  sort: [],
 } as unknown as SavedSearch;
 
 export const savedSearchMockWithTimeField = {

src/plugins/discover/public/application/main/services/discover_state.test.ts

@@ -12,7 +12,7 @@ import {
   createSearchSessionRestorationDataProvider,
 } from './discover_state';
 import { createBrowserHistory, createMemoryHistory, History } from 'history';
-import { dataPluginMock } from '@kbn/data-plugin/public/mocks';
+import { createSearchSourceMock, dataPluginMock } from '@kbn/data-plugin/public/mocks';
 import type { SavedSearch, SortOrder } from '@kbn/saved-search-plugin/public';
 import {
   savedSearchAdHoc,
@@ -524,6 +524,43 @@ describe('Test discover state actions', () => {
     unsubscribe();
   });
 
+  test('loadSavedSearch given a URL with different time range than the stored one showing as changed', async () => {
+    const url = '/#_g=(time:(from:now-24h%2Fh,to:now))';
+    const savedSearch = {
+      ...savedSearchMock,
+      searchSource: createSearchSourceMock({ index: dataViewMock, filter: [] }),
+      timeRestore: true,
+      timeRange: { from: 'now-666m', to: 'now' },
+    };
+    const { state } = await getState(url, {
+      savedSearch,
+      isEmptyUrl: false,
+    });
+    await state.actions.loadSavedSearch({ savedSearchId: savedSearchMock.id });
+    const unsubscribe = state.actions.initializeAndSync();
+    await new Promise(process.nextTick);
+    expect(state.savedSearchState.getHasChanged$().getValue()).toBe(true);
+    unsubscribe();
+  });
+
+  test('loadSavedSearch given a URL with different time range than without timeRestore not showing as changed', async () => {
+    const url = '/#?_g=(time:(from:now-24h%2Fh,to:now))';
+    const savedSearch = {
+      ...savedSearchMock,
+      searchSource: createSearchSourceMock({ index: dataViewMock, filter: [] }),
+      timeRestore: false,
+    };
+    const { state } = await getState(url, {
+      savedSearch,
+      isEmptyUrl: false,
+    });
+    await state.actions.loadSavedSearch({ savedSearchId: savedSearchMock.id });
+    const unsubscribe = state.actions.initializeAndSync();
+    await new Promise(process.nextTick);
+    expect(state.savedSearchState.getHasChanged$().getValue()).toBe(false);
+    unsubscribe();
+  });
+
   test('loadSavedSearch ignoring hideChart in URL', async () => {
     const url = '/#?_a=(hideChart:true,columns:!(message))&_g=()';
     const { state } = await getState(url, { savedSearch: savedSearchMock });

src/plugins/discover/public/application/main/services/discover_state.ts

@@ -375,6 +375,16 @@ export function getDiscoverStateContainer({
    * state containers initializing and subscribing to changes triggering e.g. data fetching
    */
   const initializeAndSync = () => {
+    // This needs to be the first thing that's wired up because initAndSync is pulling the current state from the URL which
+    // might change the time filter and thus needs to re-check whether the saved search has changed.
+    const timefilerUnsubscribe = services.timefilter.getTimeUpdate$().subscribe(() => {
+      savedSearchContainer.update({
+        nextDataView: internalStateContainer.getState().dataView,
+        nextState: appStateContainer.getState(),
+        useFilterAndQueryServices: true,
+      });
+    });
+
     // initialize app state container, syncing with _g and _a part of the URL
     const appStateInitAndSyncUnsubscribe = appStateContainer.initAndSync(
       savedSearchContainer.getState()
@@ -426,6 +436,7 @@ export function getDiscoverStateContainer({
       appStateUnsubscribe();
       appStateInitAndSyncUnsubscribe();
       filterUnsubscribe.unsubscribe();
+      timefilerUnsubscribe.unsubscribe();
     };
   };
 

src/plugins/discover/public/application/main/utils/update_saved_search.test.ts

@@ -10,6 +10,7 @@ import { savedSearchMock } from '../../../__mocks__/saved_search';
 import { discoverServiceMock } from '../../../__mocks__/services';
 import { Filter, FilterStateStore, Query } from '@kbn/es-query';
 import { updateSavedSearch } from './update_saved_search';
+import { SavedSearch } from '@kbn/saved-search-plugin/public';
 
 describe('updateSavedSearch', () => {
   const query: Query = {
@@ -73,6 +74,56 @@ describe('updateSavedSearch', () => {
     expect(savedSearch.searchSource.getField('filter')).toEqual([globalFilter, appFilter]);
   });
 
+  it('should set time range is timeRestore is enabled', async () => {
+    const savedSearch: SavedSearch = {
+      ...savedSearchMock,
+      searchSource: savedSearchMock.searchSource.createCopy(),
+      timeRestore: true,
+    };
+    (discoverServiceMock.timefilter.getTime as jest.Mock).mockReturnValue({
+      from: 'now-666m',
+      to: 'now',
+    });
+    updateSavedSearch({
+      savedSearch,
+      globalStateContainer: createGlobalStateContainer(),
+      services: discoverServiceMock,
+      state: {
+        query,
+        filters: [appFilter],
+      },
+    });
+    expect(savedSearch.timeRange).toEqual({
+      from: 'now-666m',
+      to: 'now',
+    });
+  });
+
+  it('should not set time range is timeRestore is enabled', async () => {
+    const savedSearch: SavedSearch = {
+      ...savedSearchMock,
+      searchSource: savedSearchMock.searchSource.createCopy(),
+      timeRestore: false,
+    };
+    (discoverServiceMock.timefilter.getTime as jest.Mock).mockReturnValue({
+      from: 'now-666m',
+      to: 'now',
+    });
+    updateSavedSearch({
+      savedSearch,
+      globalStateContainer: createGlobalStateContainer(),
+      services: discoverServiceMock,
+      state: {
+        query,
+        filters: [appFilter],
+      },
+    });
+    expect(savedSearch.timeRange).not.toEqual({
+      from: 'now-666m',
+      to: 'now',
+    });
+  });
+
   it('should set query and filters from services', async () => {
     const savedSearch = {
       ...savedSearchMock,

src/plugins/discover/public/application/main/utils/update_saved_search.ts

@@ -54,6 +54,9 @@ export function updateSavedSearch({
       .setField('query', state.query ?? undefined)
       .setField('filter', [...globalFilters, ...appFilters]);
   }
+  if (savedSearch.timeRestore) {
+    savedSearch.timeRange = services.timefilter.getTime();
+  }
   if (state) {
     savedSearch.columns = state.columns || [];
     savedSearch.sort = (state.sort as SortOrder[]) || [];