Visualize: Reload on ui state change and fix ui state for tsvb #63699
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
flash1293
commented
Apr 16, 2020
| @@ -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'); | |||
There was a problem hiding this comment.
This is re-running the expression when ui state changes in TSVB
flash1293
commented
Apr 16, 2020
| @@ -105,6 +106,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); | |||
There was a problem hiding this comment.
This is making sure the reload is picked up when visualize embeddable is used on the dashboard
flash1293
commented
Apr 16, 2020
| @@ -405,6 +405,9 @@ function VisualizeAppController($scope, $route, $injector, $timeout, kbnUrlState | |||
| stateContainer | |||
| ); | |||
| vis.uiState = persistedState; | |||
| vis.uiState.on('reload', () => { | |||
There was a problem hiding this comment.
This is making sure the reload is picked up when visualize embeddable is used in visualize editor
flash1293
added
Feature:Visualizations
|
Pinging @elastic/kibana-app-arch (Team:AppArch) |
|
@elasticmachine merge upstream |
wylieconlon
approved these changes
Apr 23, 2020
|
@elasticmachine merge upstream |
|
@elasticmachine merge upstream |
|
@elasticmachine merge upstream |
|
Good point @wylieconlon , it's not cleaning them up properly. I will add that. |
💚 Build SucceededHistory
To update your PR or re-run it, just comment with: |
flash1293
added a commit
to flash1293/kibana
that referenced
this pull request
May 5, 2020
flash1293
added a commit
that referenced
this pull request
May 5, 2020
gmmorris
added a commit
to gmmorris/kibana
that referenced
this pull request
May 5, 2020
* master: (133 commits) Cleanup Typescript index pattern field editor / Expression functions for bucket agg (elastic#65254) Removes legacy infra plugin and moves saved objects registration to NP (elastic#64848) Added support for docLinks plugin in Connectors forms and missing save capabilities for modal dialog (elastic#64986) [SIEM] Removes prebuilt rules number dependency (elastic#65128) [Maps] add categorical palettes with 20 and 30 categories (elastic#64701) [CI] Slack alerts - Elasticsearch snapshot failures (elastic#64724) [Uptime] Console errors in case index missing (elastic#65115) [SIEM][CASE] Dynamic fields mapping based on connector (elastic#64412) [test/functional] Tsfy page objects (elastic#64887) [Maps] [Telemetry] Track geo_point and geo_shape index patterns separately (elastic#65195) [Maps] Add global fit to data (elastic#64702) Visualize: Reload on ui state change and fix ui state for tsvb (elastic#63699) [SIEM] [Cases] External service selection per case (elastic#64775) [Uptime] Set ML anomaly look-back to 2w (from 24h) / Add spinner (elastic#65055) [Metrics UI] Remove APM Hard Dependency (elastic#64952) [Ingest] Datastream list: add icons and dashboard links (elastic#65048) disable plugins. they could access ES via SO repository (elastic#65242) Feature fleet enrollment instructions (elastic#65176) [SIEM] Adds 'Configure connector' Cypress test (elastic#64807) [TSVB] Fix std deviation band mode (elastic#64413) ...
flash1293
added a commit
to flash1293/kibana
that referenced
this pull request
May 14, 2020
flash1293
added a commit
that referenced
this pull request
May 14, 2020
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #51888
Fixes #49626
Currently sorting the TSVB table doesn't work (in editor as well as on dashboard). There are two underlying issues for this, both having architectural implications.
Issue 1: Re-run expression from within a visualization
The TSVB table visualization is special in the regard that it provides interactivity which changes the underlying data and requires to run the expression again to fetch new data - when the sort order is changed, this information is stored in the UI state, but currently there is no mechanism for this change to trigger a full reload as well. The reason for this is that other usages of the UI state (changing colors) work just fine without running the expression again and can be handled locally within the rendered component.
This PR introduces a mechanism to trigger an additional run by exploiting the fact the
uiStateis passed into the renderer:kibana/src/plugins/expressions/public/render.ts
Line 122 in 63d5e38
As
uiStateis an event emitter as well, it can pass a reload event back to the consumer of the visualization which can trigger a re-run. Currently this has to happen in two places (visualize_embeddable and editor) because the uiState is overwritten in the latter case.Issue 2 uiState in embeddable input is too specific
The visualize embeddable passes down uiState from its input to the visualization, but it only considers color overwrites:
kibana/src/plugins/visualizations/public/embeddable/visualize_embeddable.ts
Line 59 in 81f7302
table.sortkey which is not considered and overwritten.This PR adds the
tableinput to the list of properties to pass into the uiState of the visualization, but maybe a better solution would be to have a dedicated section (e.g.persistedUiState) for this which contains both the overwritten colors and the table sorting in its respective keys. However this would be a breaking change and BWC would be hard to achieve (for example because of state stored in URLs).