Visualize: Reload on ui state change and fix ui state for tsvb (elast…

…ic#63699)
flash1293 · May 14, 2020 · 546e228 · 546e228
1 parent 5a7cefb
commit 546e228
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 7 deletions.
diff --git a/src/legacy/core_plugins/kibana/public/visualize/np_ready/editor/editor.js b/src/legacy/core_plugins/kibana/public/visualize/np_ready/editor/editor.js
@@ -413,6 +413,7 @@ function VisualizeAppController($scope, $route, $injector, $timeout, kbnUrlState
       stateContainer
     );
     vis.uiState = persistedState;
+    vis.uiState.on('reload', embeddableHandler.reload);
     $scope.uiState = persistedState;
     $scope.savedVis = savedVis;
     $scope.query = initialState.query;
@@ -560,6 +561,7 @@ function VisualizeAppController($scope, $route, $injector, $timeout, kbnUrlState
       $scope.eventEmitter.off('apply', _applyVis);
 
       unsubscribePersisted();
+      vis.uiState.off('reload', embeddableHandler.reload);
       unsubscribeStateUpdates();
 
       stopAllSyncing();

diff --git a/src/legacy/core_plugins/vis_type_timeseries/public/components/vis_editor.js b/src/legacy/core_plugins/vis_type_timeseries/public/components/vis_editor.js
@@ -74,6 +74,8 @@ export class VisEditor extends Component {
 
   handleUiState = (field, value) => {
     this.props.vis.uiState.set(field, value);
+    // reload visualization because data might need to be re-fetched
+    this.props.vis.uiState.emit('reload');
   };
 
   updateVisState = debounce(() => {

diff --git a/...acy/core_plugins/visualizations/public/np_ready/public/embeddable/visualize_embeddable.ts b/...acy/core_plugins/visualizations/public/np_ready/public/embeddable/visualize_embeddable.ts
@@ -65,6 +65,7 @@ export interface VisualizeInput extends EmbeddableInput {
   vis?: {
     colors?: { [key: string]: string };
   };
+  table?: unknown;
   appState?: { save(): void };
   uiState?: PersistedState;
 }
@@ -84,7 +85,7 @@ export class VisualizeEmbeddable extends Embeddable<VisualizeInput, VisualizeOut
   private query?: Query;
   private title?: string;
   private filters?: Filter[];
-  private visCustomizations: VisualizeInput['vis'];
+  private visCustomizations?: Pick<VisualizeInput, 'vis' | 'table'>;
   private subscriptions: Subscription[] = [];
   private expression: string = '';
   private vis: Vis;
@@ -113,6 +114,7 @@ export class VisualizeEmbeddable extends Embeddable<VisualizeInput, VisualizeOut
     this.timefilter = timefilter;
     this.vis = vis;
     this.vis.uiState.on('change', this.uiStateChangeHandler);
+    this.vis.uiState.on('reload', this.reload);
 
     this.autoRefreshFetchSubscription = timefilter
       .getAutoRefreshFetch$()
@@ -150,17 +152,22 @@ export class VisualizeEmbeddable extends Embeddable<VisualizeInput, VisualizeOut
     // Check for changes that need to be forwarded to the uiState
     // Since the vis has an own listener on the uiState we don't need to
     // pass anything from here to the handler.update method
-    const visCustomizations = this.input.vis;
-    if (visCustomizations) {
+    const visCustomizations = { vis: this.input.vis, table: this.input.table };
+    if (visCustomizations.vis || visCustomizations.table) {
       if (!_.isEqual(visCustomizations, this.visCustomizations)) {
         this.visCustomizations = visCustomizations;
         // Turn this off or the uiStateChangeHandler will fire for every modification.
         this.vis.uiState.off('change', this.uiStateChangeHandler);
         this.vis.uiState.clearAllKeys();
-        this.vis.uiState.set('vis', visCustomizations);
-        getKeys(visCustomizations).forEach(key => {
-          this.vis.uiState.set(key, visCustomizations[key]);
-        });
+        if (visCustomizations.vis) {
+          this.vis.uiState.set('vis', visCustomizations.vis);
+          getKeys(visCustomizations).forEach(key => {
+            this.vis.uiState.set(key, visCustomizations[key]);
+          });
+        }
+        if (visCustomizations.table) {
+          this.vis.uiState.set('table', visCustomizations.table);
+        }
         this.vis.uiState.on('change', this.uiStateChangeHandler);
       }
     } else if (this.parent) {
@@ -307,6 +314,7 @@ export class VisualizeEmbeddable extends Embeddable<VisualizeInput, VisualizeOut
     super.destroy();
     this.subscriptions.forEach(s => s.unsubscribe());
     this.vis.uiState.off('change', this.uiStateChangeHandler);
+    this.vis.uiState.off('reload', this.reload);
 
     if (this.handler) {
       this.handler.destroy();