How to updateState in Kibana 7.8

[ssimmons (Stacey Simmons)]

I'm migrating a plugin from Kibana 7.5 to 7.8 and using the new plugin/platform. In 7.5 I could call
this.props.vis.updateState() from within my Editor to update the state of the visualization. I see that this cannot be done in 7.8. I've read that I need to add a toExpression property to my visualization in order to update the state. I've not found a good example of this in the code. The other post I read said to look at build_pipeline.ts, but its not that clear to me in that function what I need to do. Can someone explain what must be done to update the state of the visualization from within the editor in 7.8?

[lukeelmers]

Hey @ssimmons -

That's a good question -- as you may have seen mentioned elsewhere, our vis APIs have been in a state of heavy churn as a result of the platform migration project. Another complicating factor has been that shortly before the migration project began, we moved the vis infrastructure over to utilize the Expression language provided by Canvas.

To answer your questions around build_pipeline and toExpression... Moving forward, the plan is for each custom visualization to provide three things:

1. The vis type definition. This is quite similar to the older vis types. The type gets registered to the visualizations plugin to create the new vis type. The vis type includes a toExpression method which can be called on any visualization of that type (from the build_pipeline file you mentioned). The function takes in a vis object and params, and returns the AST representing the expression function for that type, which leads me to:
2. An expression function representing the vis. This function is registered to the expressions plugin, and responsible for taking in configuration for the visualization, as well as the output of the ES query that gets sent whenever a vis is updated. Then it munges that data together in a way which will make sense to...
3. An expression renderer representing the vis. This also gets registered with the expressions plugin, and is what gets called after the function created in 2 is executed. The renderer takes the data & config munged together in the function, as well as a DOM node in which it can render the data (using any rendering framework you want).

The general goal of this flow is to decouple the querying logic from the rendering logic. By default your registered visualization will use what we used to call the "courier" request handler, which returns a datatable of results to your expression function.

You can see most of these things brought together in this PR which is still in progress, though it doesn't include an example implementation of toExpression yet. The PR is converting our metric visualization to use its own renderer, as well as its own function which has existed previously.

So to get to your original question about updating state: In order for this to work, you'll need the expression to re-execute each time a change is made, so wherever in your editor you are applying changes, you'll want to first call vis.setState(), and then call reload() on the embeddable handler which is provided to the editor. This should then trigger a re-run of the expression pipeline I explained above. You can see an example of this logic in this part of code for the default editor.

Hope this helps a bit. We do hope to provide some clearer documentation soon on this in the near term as the APIs are finally starting to stabilize in 7.9/7.10