[dashboard][ES|QL] Update no data views ES|QL action to open new dashboard with new inline lens panel

[nreese]

Spin off of #174316 (comment)

On the current "no data views" page, clicking the Try ES|QL action takes the user to Discover. Instead, the action should take the user to a new dashboard with a new lens ES|QL panel.

[elasticmachine]

Pinging @elastic/kibana-presentation (Team:Presentation)

[ThomThomson]

Assigning this to the @elastic/appex-sharedux team as well. Interest was expressed in this comment. Leaving our assignment in case any Dashboard APIs need to be extended to make this possible.

[elasticmachine]

Pinging @elastic/kibana-esql (Team:ESQL)

[petrklapka]

@tsullivan - how much of a scope addition would this be to the other work you're doing to make ESQL present as a first class citizen? Can we squeeze this in before 8.16, or is this big enough to make it a piece of planned work for Q3?

[tsullivan]

@petrklapka the only scope change seems to be in the action triggered by clicking the button to try ES|QL. I will try to squeeze this in, as that could be on the small side.

A few questions:

• For clarification: will the action open a new dashboard regardless of the context of the no-data-views screen? In other words, if we are in the Discover context and don't have a data view, will the action take us to Dashboard?
• Could @elastic/kibana-presentation team offer guidance on how to open a new dashboard with a new inline lens panel? Maybe we already have functional tests that do this which I can learn from.

[stratoula]

In other words, if we are in the Discover context and don't have a data view, will the action take us to Dashboard?

No Discover works as expected atm Tim and we don't want to change the behavior. We want different action for the dashboard though.

Ideally I would like to open an empty dashboard with the new ES|QL panel open like that:

Not sure if this is possible though, the presentation team will know

[nreese]

Could @elastic/kibana-presentation team offer guidance on how to open a new dashboard with a new inline lens panel

This could be accomplished with embeddable state transfer service. In Discover, you could do something like this in an onClick handler

embeddableStateTransfer().navigateToWithEmbeddablePackage('dashboards', {
  state: {
    type: 'lens',
    input: lensEmbeddableInput,
  },
  path: '#/create',
});

[tsullivan]

@stratoula @nreese I'm working on the request to open a new dashboard with a new inline lens panel, but currently I'm getting stuck on how to define the object that is passed for the input field. I've reached out for help in our internal kibana-visualizations channel.

[stratoula]

@tsullivan I think the best thing you can do is to use the Lens suggestions api to take the state. I am doing something similar here https://github.com/elastic/kibana/blob/main/x-pack/plugins/lens/public/app_plugin/shared/edit_on_the_fly/helpers.ts#L106

So here you will need:

• dataview: you have already this with the getESQLAdHocDataview(from ${indexName}, dataViews);
• the query: you have this already with the getInitialESQLQuery
• the columns of the ES|QL query results. You can get them like that:

  const abortController = new AbortController();
  const columns = await getESQLQueryColumns({
    esqlQuery,
    search: deps.data.search.search,
    signal: abortController.signal,
    timeRange: deps.data.query.timefilter.timefilter.getAbsoluteTime(),
  });

The getESQLQueryColumns can be imported from '@kbn/esql-utils'.

When you pass this to the suggestions api it will most posibly suggest a table. Get the attributes for the embeddable input like this:

const attrs = getLensAttributesFromSuggestion({
      filters: [],
      query,
      suggestion: firstSuggestion,
      dataView,
    }) as TypedLensByValueInput['attributes'];
    return attrs;
  } catch (e) {
    setErrors([e]);
  }

Ping me if you have any questions. I hope it helps!

[tsullivan]

@tsullivan - how much of a scope addition would this be to the other work you're doing to make ESQL present as a first class citizen? Can we squeeze this in before 8.16, or is this big enough to make it a piece of planned work for Q3?

@petrklapka @nreese @stratoula I received a lot of help on this effort (thank you very much, Nathan and Stratoula) I think this task is better left to the subject experts with knowledge about the Embeddable API and Lens API.

I'm going to work on a PR to deliver a new look and feel for the "No Data" prompt, which will add an extension point that will allow consumers to customize the action triggered when the user clicks the "Try ES|QL" button. After that, I will post a Draft PR that has the beginnings of a feature that customizes the action for Dashboard and will include some of the info I got from researching this task with Nathan and Stratoula. I won't plan to complete the draft PR, instead I will hand off ownership to a volunteer who can finalize the work to open a new dashboard with an inline Lens panel.

[tsullivan]

... I will post a Draft PR that has the beginnings of a feature that customizes the action for Dashboard and will include some of the info I got from researching this task with Nathan and Stratoula.

Here is the Draft PR: #196449