explicitly passing filters and query to visualize (#19172)

src/core_plugins/kibana/public/dashboard/actions/view.js

@@ -27,3 +27,5 @@ export const updateIsFullScreenMode = createAction('UPDATE_IS_FULL_SCREEN_MODE')
 export const updateUseMargins = createAction('UPDATE_USE_MARGINS');
 export const updateHidePanelTitles = createAction('HIDE_PANEL_TITLES');
 export const updateTimeRange = createAction('UPDATE_TIME_RANGE');
+export const updateFilters = createAction('UPDATE_FILTERS');
+export const updateQuery = createAction('UPDATE_QUERY');

src/core_plugins/kibana/public/dashboard/dashboard_app.js

@@ -160,9 +160,6 @@ app.directive('dashboardApp', function ($injector) {
 
       timefilter.enableAutoRefreshSelector();
       timefilter.enableTimeRangeSelector();
-      dash.searchSource.highlightAll(true);
-      dash.searchSource.version(true);
-      courier.setRootSearchSource(dash.searchSource);
 
       updateState();
 

src/core_plugins/kibana/public/dashboard/dashboard_state_manager.js

@@ -35,6 +35,8 @@ import {
   updateHidePanelTitles,
   updateTimeRange,
   clearStagedFilters,
+  updateFilters,
+  updateQuery,
 } from './actions';
 import { stateMonitorFactory } from 'ui/state_management/state_monitor_factory';
 import { createPanelState } from './panel';
@@ -50,7 +52,9 @@ import {
   getHidePanelTitles,
   getStagedFilters,
   getEmbeddables,
-  getEmbeddableMetadata
+  getEmbeddableMetadata,
+  getQuery,
+  getFilters,
 } from '../selectors';
 
 /**
@@ -196,6 +200,17 @@ export class DashboardStateManager {
     if (getDescription(state) !== this.getDescription()) {
       store.dispatch(updateDescription(this.getDescription()));
     }
+
+    if (!_.isEqual(
+      FilterUtils.cleanFiltersForComparison(this.appState.filters),
+      FilterUtils.cleanFiltersForComparison(getFilters(state))
+    )) {
+      store.dispatch(updateFilters(this.appState.filters));
+    }
+
+    if (getQuery(state) !== this.getQuery()) {
+      store.dispatch(updateQuery(this.getQuery()));
+    }
   }
 
   _handleStoreChanges() {

src/core_plugins/kibana/public/dashboard/panel/dashboard_panel.js

@@ -161,7 +161,9 @@ DashboardPanel.propTypes = {
   ]),
   destroy: PropTypes.func.isRequired,
   containerState: PropTypes.shape({
-    timeRange: PropTypes.object.isRequired,
+    timeRange: PropTypes.object,
+    filters: PropTypes.array,
+    query: PropTypes.object,
     embeddableCustomization: PropTypes.object,
     hidePanelTitles: PropTypes.bool.isRequired,
   }),

src/core_plugins/kibana/public/dashboard/reducers/view.js

@@ -26,6 +26,8 @@ import {
   updateHidePanelTitles,
   updateIsFullScreenMode,
   updateTimeRange,
+  updateFilters,
+  updateQuery,
   setVisibleContextMenuPanelId,
 } from '../actions';
 
@@ -47,6 +49,16 @@ export const view = handleActions({
     timeRange: payload
   }),
 
+  [updateFilters]: (state, { payload }) => ({
+    ...state,
+    filters: payload
+  }),
+
+  [updateQuery]: (state, { payload }) => ({
+    ...state,
+    query: payload
+  }),
+
   [updateUseMargins]: (state, { payload }) => ({
     ...state,
     useMargins: payload

src/core_plugins/kibana/public/dashboard/selectors/index.js

@@ -158,6 +158,10 @@ export const getMaximizedPanelId = dashboard => dashboard.view.maximizedPanelId;
  */
 export const getTimeRange = dashboard => dashboard.view.timeRange;
 
+export const getFilters = dashboard => dashboard.view.filters;
+
+export const getQuery = dashboard => dashboard.view.query;
+
 /**
  * @typedef {Object} DashboardMetadata
  * @property {string} title
@@ -205,6 +209,8 @@ export const getContainerState = (dashboard, panelId) => {
       to: time.to,
       from: time.from,
     },
+    filters: getFilters(dashboard),
+    query: getQuery(dashboard),
     embeddableCustomization: _.cloneDeep(getEmbeddableCustomization(dashboard, panelId) || {}),
     hidePanelTitles: getHidePanelTitles(dashboard),
     customTitle: getPanel(dashboard, panelId).title,

src/core_plugins/kibana/public/discover/controllers/discover.js

@@ -201,6 +201,15 @@ function discoverController(
     .highlightAll(true)
     .version(true);
 
+  // searchSource which applies time range
+  const timeRangeSearchSource = savedSearch.searchSource.new();
+  timeRangeSearchSource.set('filter', () => {
+    return timefilter.get($scope.indexPattern);
+  });
+
+  $scope.searchSource.inherits(timeRangeSearchSource);
+
+
   const pageTitleSuffix = savedSearch.id && savedSearch.title ? `: ${savedSearch.title}` : '';
   docTitle.change(`Discover${pageTitleSuffix}`);
 

src/core_plugins/kibana/public/discover/embeddable/search_embeddable.js

@@ -21,6 +21,7 @@ import angular from 'angular';
 import { Embeddable } from 'ui/embeddable';
 import searchTemplate from './search_template.html';
 import * as columnActions from 'ui/doc_table/actions/columns';
+import { getTime } from 'ui/timefilter/get_time';
 
 export class SearchEmbeddable extends Embeddable {
   constructor({ onEmbeddableStateChanged, savedSearch, editUrl, loader, $rootScope, $compile }) {
@@ -52,13 +53,20 @@ export class SearchEmbeddable extends Embeddable {
   pushContainerStateParamsToScope() {
     // If there is column or sort data on the panel, that means the original columns or sort settings have
     // been overridden in a dashboard.
+
     this.searchScope.columns = this.customization.columns || this.savedSearch.columns;
     this.searchScope.sort = this.customization.sort || this.savedSearch.sort;
     this.searchScope.sharedItemTitle = this.panelTitle;
+
+    this.filtersSearchSource.set('filter', this.filters);
+    this.filtersSearchSource.set('query', this.query);
   }
 
   onContainerStateChanged(containerState) {
     this.customization = containerState.embeddableCustomization || {};
+    this.filters = containerState.filters;
+    this.query = containerState.query;
+    this.timeRange = containerState.timeRange;
     this.panelTitle = '';
     if (!containerState.hidePanelTitles) {
       this.panelTitle = containerState.customTitle !== undefined ?
@@ -74,11 +82,21 @@ export class SearchEmbeddable extends Embeddable {
   initializeSearchScope() {
     this.searchScope = this.$rootScope.$new();
 
-    this.pushContainerStateParamsToScope();
-
     this.searchScope.description = this.savedSearch.description;
     this.searchScope.searchSource = this.savedSearch.searchSource;
 
+    const timeRangeSearchSource = this.searchScope.searchSource.new();
+    timeRangeSearchSource.filter(() => {
+      return getTime(this.searchScope.searchSource.get('index'), this.timeRange);
+    });
+
+    this.filtersSearchSource = this.searchScope.searchSource.new();
+    this.filtersSearchSource.inherits(timeRangeSearchSource);
+
+    this.searchScope.searchSource.inherits(this.filtersSearchSource);
+
+    this.pushContainerStateParamsToScope();
+
     this.searchScope.setSortOrder = (columnName, direction) => {
       this.searchScope.sort = this.customization.sort = [columnName, direction];
       this.emitEmbeddableStateChange(this.getEmbeddableState());

src/core_plugins/kibana/public/discover/saved_searches/_saved_search.js

@@ -42,7 +42,7 @@ module.factory('SavedSearch', function (courier) {
         hits: 0,
         sort: [],
         version: 1
-      }
+      },
     });
 
     this.showInRecenltyAccessed = true;

src/core_plugins/kibana/public/selectors/dashboard_selectors.js

@@ -52,6 +52,8 @@ export const getMaximizedPanelId = state => DashboardSelectors.getMaximizedPanel
 export const getUseMargins = state => DashboardSelectors.getUseMargins(getDashboard(state));
 export const getHidePanelTitles = state => DashboardSelectors.getHidePanelTitles(getDashboard(state));
 export const getTimeRange = state => DashboardSelectors.getTimeRange(getDashboard(state));
+export const getFilters = state => DashboardSelectors.getFilters(getDashboard(state));
+export const getQuery = state => DashboardSelectors.getQuery(getDashboard(state));
 
 export const getTitle = state => DashboardSelectors.getTitle(getDashboard(state));
 export const getDescription = state => DashboardSelectors.getDescription(getDashboard(state));

src/core_plugins/kibana/public/visualize/editor/editor.html

@@ -69,10 +69,9 @@
   <visualize
     saved-obj="savedVis"
     ui-state="uiState"
-    app-state="state"
+    time-range="timeRange"
     editor-mode="chrome.getVisible()"
     show-spy-panel="chrome.getVisible()"
-    time-range="timeRange"
     >
 
   </visualize>

src/core_plugins/kibana/public/visualize/editor/editor.js

@@ -246,12 +246,14 @@ function VisEditor($scope, $route, timefilter, AppState, $window, kbnUrl, courie
 
     // update the searchSource when filters update
     $scope.$listen(queryFilter, 'update', function () {
-      $state.save();
+      $scope.fetch();
     });
 
     // update the searchSource when query updates
     $scope.fetch = function () {
       $state.save();
+      savedVis.searchSource.set('query', $state.query);
+      savedVis.searchSource.set('filter', $state.filters);
       $scope.vis.forceReload();
     };
 

src/core_plugins/kibana/public/visualize/embeddable/visualize_embeddable.js

@@ -98,6 +98,18 @@ export class VisualizeEmbeddable extends Embeddable  {
       this.timeRange = containerState.timeRange;
     }
 
+    // Check if filters has changed
+    if (containerState.filters !== this.filters) {
+      updatedParams.filters = containerState.filters;
+      this.filters = containerState.filters;
+    }
+
+    // Check if query has changed
+    if (containerState.query !== this.query) {
+      updatedParams.query = containerState.query;
+      this.query = containerState.query;
+    }
+
     const derivedPanelTitle = this.getPanelTitle(containerState);
     if (this.panelTitle !== derivedPanelTitle) {
       updatedParams.dataAttrs = {
@@ -119,6 +131,8 @@ export class VisualizeEmbeddable extends Embeddable  {
   render(domNode, containerState) {
     this.panelTitle = this.getPanelTitle(containerState);
     this.timeRange = containerState.timeRange;
+    this.query = containerState.query;
+    this.filters = containerState.filters;
 
     this.transferCustomizationsToUiState(containerState);
 
@@ -127,6 +141,8 @@ export class VisualizeEmbeddable extends Embeddable  {
       // Append visualization to container instead of replacing its content
       append: true,
       timeRange: containerState.timeRange,
+      query: containerState.query,
+      filters: containerState.filters,
       cssClass: `panel-content panel-content--fullWidth`,
       // The chrome is permanently hidden in "embed mode" in which case we don't want to show the spy pane, since
       // we deem that situation to be more public facing and want to hide more detailed information.

src/ui/public/courier/courier.js

@@ -29,7 +29,6 @@ import { SearchSourceProvider } from './data_source/search_source';
 import { requestQueue } from './_request_queue';
 import { FetchSoonProvider } from './fetch';
 import { SearchLooperProvider } from './looper/search';
-import { RootSearchSourceProvider } from './data_source/_root_search_source';
 import { SavedObjectProvider } from './saved_object';
 import { RedirectWhenMissingProvider } from './_redirect_when_missing';
 
@@ -42,9 +41,6 @@ uiModules.get('kibana/courier')
       const fetchSoon = Private(FetchSoonProvider);
       const searchLooper = self.searchLooper = Private(SearchLooperProvider);
 
-      // expose some internal modules
-      self.setRootSearchSource = Private(RootSearchSourceProvider).set;
-
       self.SavedObject = Private(SavedObjectProvider);
       self.indexPatterns = indexPatterns;
       self.redirectWhenMissing = Private(RedirectWhenMissingProvider);