Fix Time Range in Vis State

src/legacy/core_plugins/data/public/search/search_service.ts

@@ -18,7 +18,7 @@
  */
 
 import { CoreSetup, CoreStart } from '../../../../../core/public';
-import { IndexPattern } from '../../../../../plugins/data/public';
+import { IndexPattern, TimeRange } from '../../../../../plugins/data/public';
 import {
   aggTypes,
   AggType,
@@ -55,7 +55,8 @@ interface AggsStart {
   createAggConfigs: (
     indexPattern: IndexPattern,
     configStates?: CreateAggConfigParams[],
-    schemas?: Record<string, any>
+    schemas?: Record<string, any>,
+    timeRange?: TimeRange
   ) => InstanceType<typeof AggConfigs>;
   types: AggTypesRegistryStart;
   __LEGACY: AggsStartLegacy;
@@ -94,11 +95,20 @@ export class SearchService {
     const aggTypesStart = this.aggTypesRegistry.start();
     return {
       aggs: {
-        createAggConfigs: (indexPattern, configStates = [], schemas) => {
-          return new AggConfigs(indexPattern, configStates, {
+        createAggConfigs: (
+          indexPattern,
+          configStates = [],
+          schemas,
+          timeRange: TimeRange | undefined
+        ) => {
+          const aggConfigs = new AggConfigs(indexPattern, configStates, {
             schemas,
             typesRegistry: aggTypesStart,
           });
+          if (timeRange) {
+            aggConfigs.setTimeRange(timeRange);
+          }
+          return aggConfigs;
         },
         types: aggTypesStart,
         __LEGACY: {

src/legacy/core_plugins/vis_default_editor/public/components/sidebar/sidebar.tsx

@@ -21,12 +21,19 @@ import React, { useMemo, useState, useCallback, KeyboardEventHandler, useEffect
 import { get, isEqual } from 'lodash';
 import { i18n } from '@kbn/i18n';
 import { keyCodes, EuiButtonIcon, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
+import { TimeRange } from 'src/plugins/data/public';
 
 import { Vis } from 'src/legacy/core_plugins/visualizations/public';
 import { AggGroupNames } from '../../legacy_imports';
 import { DefaultEditorNavBar, OptionTab } from './navbar';
 import { DefaultEditorControls } from './controls';
-import { setStateParamValue, useEditorReducer, useEditorFormState, discardChanges } from './state';
+import {
+  setStateParamValue,
+  useEditorReducer,
+  useEditorFormState,
+  discardChanges,
+  timeRangeChange,
+} from './state';
 import { DefaultEditorAggCommonProps } from '../agg_common_props';
 import { SidebarTitle } from './sidebar_title';
 import { SavedSearch } from '../../../../kibana/public/discover/np_ready/types';
@@ -38,6 +45,7 @@ interface DefaultEditorSideBarProps {
   optionTabs: OptionTab[];
   uiState: PersistedState;
   vis: Vis;
+  timeRange?: TimeRange | undefined;
   isLinkedSearch: boolean;
   savedSearch?: SavedSearch;
 }
@@ -48,6 +56,7 @@ function DefaultEditorSideBar({
   optionTabs,
   uiState,
   vis,
+  timeRange,
   isLinkedSearch,
   savedSearch,
 }: DefaultEditorSideBarProps) {
@@ -72,6 +81,12 @@ function DefaultEditorSideBar({
     [setValidity]
   );
 
+  useEffect(() => {
+    if (timeRange) {
+      dispatch(timeRangeChange(timeRange));
+    }
+  }, [dispatch, timeRange]);
+
   const setStateValue: DefaultEditorAggCommonProps['setStateParamValue'] = useCallback(
     (paramName, value) => {
       const shouldUpdate = !isEqual(state.params[paramName], value);

src/legacy/core_plugins/vis_default_editor/public/components/sidebar/state/actions.ts

@@ -18,6 +18,7 @@
  */
 
 import { Vis, VisParams } from 'src/legacy/core_plugins/visualizations/public';
+import { TimeRange } from 'src/plugins/data/public';
 import { IAggConfig, Schema } from '../../../legacy_imports';
 import { EditorStateActionTypes } from './constants';
 
@@ -60,6 +61,10 @@ type UpdateStateParams = ActionType<
   EditorStateActionTypes.UPDATE_STATE_PARAMS,
   { params: VisParams }
 >;
+type TimeRangeChange = ActionType<
+  EditorStateActionTypes.TIMERANGE_CHANGE,
+  { timeRange: TimeRange }
+>;
 
 export type EditorAction =
   | AddNewAgg
@@ -70,7 +75,8 @@ export type EditorAction =
   | RemoveAgg
   | ReorderAggs
   | ToggleEnabledAgg
-  | UpdateStateParams;
+  | UpdateStateParams
+  | TimeRangeChange;
 
 export interface EditorActions {
   addNewAgg(schema: Schema): AddNewAgg;
@@ -89,6 +95,7 @@ export interface EditorActions {
   reorderAggs(sourceAgg: IAggConfig, destinationAgg: IAggConfig): ReorderAggs;
   toggleEnabledAgg(aggId: AggId, enabled: IAggConfig['enabled']): ToggleEnabledAgg;
   updateStateParams(params: VisParams): UpdateStateParams;
+  timeRangeChange(timeRange: TimeRange): TimeRangeChange;
 }
 
 const addNewAgg: EditorActions['addNewAgg'] = schema => ({
@@ -158,6 +165,13 @@ const updateStateParams: EditorActions['updateStateParams'] = params => ({
   },
 });
 
+const timeRangeChange: EditorActions['timeRangeChange'] = (timeRange: TimeRange) => ({
+  type: EditorStateActionTypes.TIMERANGE_CHANGE,
+  payload: {
+    timeRange,
+  },
+});
+
 export {
   addNewAgg,
   discardChanges,
@@ -168,4 +182,5 @@ export {
   reorderAggs,
   toggleEnabledAgg,
   updateStateParams,
+  timeRangeChange,
 };

src/legacy/core_plugins/vis_default_editor/public/components/sidebar/state/constants.ts

@@ -27,4 +27,5 @@ export enum EditorStateActionTypes {
   REMOVE_AGG = 'REMOVE_AGG',
   REORDER_AGGS = 'REORDER_AGGS',
   UPDATE_STATE_PARAMS = 'UPDATE_STATE_PARAMS',
+  TIMERANGE_CHANGE = 'TIMERANGE_CHANGE',
 }

src/legacy/core_plugins/vis_default_editor/public/components/sidebar/state/reducers.ts

@@ -42,7 +42,12 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
       };
     }
 
@@ -65,7 +70,12 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
       };
     }
 
@@ -90,7 +100,12 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
       };
     }
 
@@ -131,7 +146,12 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
       };
     }
 
@@ -143,7 +163,12 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
       };
     }
 
@@ -165,7 +190,26 @@ function editorStateReducer(state: VisState, action: EditorAction): VisState {
 
       return {
         ...state,
-        aggs: createAggConfigs(state.aggs.indexPattern, newAggs, state.aggs.schemas),
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          newAggs,
+          state.aggs.schemas,
+          state.aggs.timeRange
+        ),
+      };
+    }
+
+    case EditorStateActionTypes.TIMERANGE_CHANGE: {
+      const { timeRange: timeRange } = action.payload;
+
+      return {
+        ...state,
+        aggs: createAggConfigs(
+          state.aggs.indexPattern,
+          state.aggs.aggs,
+          state.aggs.schemas,
+          timeRange
+        ),
       };
     }
 

src/legacy/core_plugins/vis_default_editor/public/default_editor.tsx

@@ -113,6 +113,7 @@ function DefaultEditor({
         initialWidth={editorInitialWidth}
       >
         <DefaultEditorSideBar
+          timeRange={timeRange}
           isCollapsed={isCollapsed}
           onClickCollapse={onClickCollapse}
           optionTabs={optionTabs}