change how time range is restored and improve back button for drilldowns

Author: Dosant

src/legacy/core_plugins/kibana/public/dashboard/np_ready/dashboard_app_controller.tsx

@@ -36,6 +36,7 @@ import {
   IndexPattern,
   IndexPatternsContract,
   Query,
+  QueryState,
   SavedQuery,
   syncQueryStateWithUrl,
 } from '../../../../../../plugins/data/public';
@@ -132,13 +133,6 @@ export class DashboardAppController {
     const queryFilter = filterManager;
     const timefilter = queryService.timefilter.timefilter;
 
-    // starts syncing `_g` portion of url with query services
-    // note: dashboard_state_manager.ts syncs `_a` portion of url
-    const {
-      stop: stopSyncingQueryServiceStateWithUrl,
-      hasInheritedQueryFromUrl: hasInheritedGlobalStateFromUrl,
-    } = syncQueryStateWithUrl(queryService, kbnUrlStateStorage);
-
     let lastReloadRequestTime = 0;
     const dash = ($scope.dash = $route.current.locals.dash);
     if (dash.id) {
@@ -170,9 +164,20 @@ export class DashboardAppController {
 
     // The hash check is so we only update the time filter on dashboard open, not during
     // normal cross app navigation.
-    if (dashboardStateManager.getIsTimeSavedWithDashboard() && !hasInheritedGlobalStateFromUrl) {
+    const initialGlobalStateInUrl = kbnUrlStateStorage.get<QueryState>('_g');
+    const hasInheritedTimeRange = Boolean(initialGlobalStateInUrl?.time);
+    if (dashboardStateManager.getIsTimeSavedWithDashboard() && !hasInheritedTimeRange) {
       dashboardStateManager.syncTimefilterWithDashboard(timefilter);
     }
+    // starts syncing `_g` portion of url with query services
+    // note: dashboard_state_manager.ts syncs `_a` portion of url
+    // it is important to start this syncing after `dashboardStateManager.syncTimefilterWithDashboard(timefilter);` above is run,
+    // otherwise it will case redundant browser history record
+    const { stop: stopSyncingQueryServiceStateWithUrl } = syncQueryStateWithUrl(
+      queryService,
+      kbnUrlStateStorage
+    );
+
     $scope.showSaveQuery = dashboardCapabilities.saveQuery as boolean;
 
     const getShouldShowEditHelp = () =>

test/functional/apps/management/_kibana_settings.js

@@ -46,6 +46,18 @@ export default function({ getService, getPageObjects }) {
     });
 
     describe('state:storeInSessionStorage', () => {
+      async function getStateFromUrl() {
+        const currentUrl = await browser.getCurrentUrl();
+        let match = currentUrl.match(/(.*)?_g=(.*)&_a=(.*)/);
+        if (match) return [match[2], match[3]];
+        match = currentUrl.match(/(.*)?_a=(.*)&_g=(.*)/);
+        if (match) return [match[3], match[2]];
+
+        if (!match) {
+          throw new Error('State in url is missing or malformed');
+        }
+      }
+
       it('defaults to null', async () => {
         await PageObjects.settings.clickKibanaSettings();
         const storeInSessionStorage = await PageObjects.settings.getAdvancedSettingCheckbox(
@@ -58,10 +70,7 @@ export default function({ getService, getPageObjects }) {
         await PageObjects.common.navigateToApp('dashboard');
         await PageObjects.dashboard.clickNewDashboard();
         await PageObjects.timePicker.setDefaultAbsoluteRange();
-        const currentUrl = await browser.getCurrentUrl();
-        const urlPieces = currentUrl.match(/(.*)?_g=(.*)&_a=(.*)/);
-        const globalState = urlPieces[2];
-        const appState = urlPieces[3];
+        const [globalState, appState] = await getStateFromUrl();
 
         // We don't have to be exact, just need to ensure it's greater than when the hashed variation is being used,
         // which is less than 20 characters.
@@ -83,10 +92,7 @@ export default function({ getService, getPageObjects }) {
         await PageObjects.common.navigateToApp('dashboard');
         await PageObjects.dashboard.clickNewDashboard();
         await PageObjects.timePicker.setDefaultAbsoluteRange();
-        const currentUrl = await browser.getCurrentUrl();
-        const urlPieces = currentUrl.match(/(.*)?_g=(.*)&_a=(.*)/);
-        const globalState = urlPieces[2];
-        const appState = urlPieces[3];
+        const [globalState, appState] = await getStateFromUrl();
 
         // We don't have to be exact, just need to ensure it's less than the unhashed version, which will be
         // greater than 20 characters with the default state plus a time.
@@ -100,10 +106,7 @@ export default function({ getService, getPageObjects }) {
         await PageObjects.settings.clickKibanaSettings();
         await PageObjects.settings.toggleAdvancedSettingCheckbox('state:storeInSessionStorage');
         await PageObjects.header.clickDashboard();
-        const currentUrl = await browser.getCurrentUrl();
-        const urlPieces = currentUrl.match(/(.*)?_g=(.*)&_a=(.*)/);
-        const globalState = urlPieces[2];
-        const appState = urlPieces[3];
+        const [globalState, appState] = await getStateFromUrl();
         // We don't have to be exact, just need to ensure it's greater than when the hashed variation is being used,
         // which is less than 20 characters.
         expect(globalState.length).to.be.greaterThan(20);

x-pack/plugins/dashboard_enhanced/public/services/drilldowns/dashboard_to_dashboard_drilldown/drilldown.test.tsx

@@ -68,9 +68,6 @@ describe('.execute()', () => {
     const navigateToApp = jest.fn();
     const dataPluginActions = dataPluginMock.createStartContract().actions;
     const savedObjectsClient = savedObjectsServiceMock.createStartContract().client;
-    savedObjectsClient.get = jest
-      .fn()
-      .mockReturnValue({ attributes: { from: 'now-15m', to: 'now' } });
 
     const drilldown = new DashboardToDashboardDrilldown({
       getNavigateToApp: () => Promise.resolve(navigateToApp),

x-pack/plugins/dashboard_enhanced/public/services/drilldowns/dashboard_to_dashboard_drilldown/drilldown.tsx

@@ -60,7 +60,6 @@ export class DashboardToDashboardDrilldown
   ) => {
     const getUrlGenerator = await this.params.getGetUrlGenerator();
     const navigateToApp = await this.params.getNavigateToApp();
-    const savedObjectsClient = await this.params.getSavedObjectsClient();
 
     const {
       selectRangeActionGetFilters,
@@ -72,16 +71,6 @@ export class DashboardToDashboardDrilldown
       filters: currentFilters,
     } = context.embeddable.getInput();
 
-    const savedDashboard = await savedObjectsClient.get<{ timeTo: string; timeFrom: string }>(
-      'dashboard',
-      config.dashboardId as string
-    );
-
-    const defaultTimeRange = {
-      to: savedDashboard.attributes.timeTo,
-      from: savedDashboard.attributes.timeFrom,
-    };
-
     // if useCurrentDashboardFilters enabled, then preserve all the filters (pinned and unpinned)
     // otherwise preserve only pinned
     const filters =
@@ -92,7 +81,7 @@ export class DashboardToDashboardDrilldown
     // if useCurrentDashboardDataRange is enabled, then preserve current time range
     // if undefined is passed, then destination dashboard will figure out time range itself
     // for brush event this time range would be overwritten
-    let timeRange = config.useCurrentDateRange ? currentTimeRange : defaultTimeRange;
+    let timeRange = config.useCurrentDateRange ? currentTimeRange : undefined;
 
     if (context.data.range) {
       // look up by range