[SpaceTime] [Saved Search] Inline editing

[Heenawter]

Branched from elastic#180536

Warning

This PR is just a proof of concept - I made some changes to behaviour that would need a longer discussion before it is ready to be merged. Would also definitely need some design help 🙈

Summary

This PR is a proof of concept for inline editing + creation for the saved search embeddable. When creating a new saved search embeddable via the dashboard, I opted to only include ES|QL editing - however, editing existing saved search embeddables based on data views is also supported.

Data view

Note that, in the following video, opening the editor flyout causes the "Auto refresh" option to be removed from the time picker in the unified search bar - this is because auto-refresh is not applicable at a panel level.

Screen.Recording.2024-06-27.at.12.15.01.PM.mov

ES|QL

Note that, in the following video, opening the editor flyout causes everything in the unified search bar except the time filter to get disabled - that is because the time range is the only applicable local filter for ES|QL saved searches. The auto-refresh is also removed in this editor, just like for data view saved searches.

Screen.Recording.2024-06-27.at.12.00.28.PM.mov

Other notes

As part of this, I also made a few changes to the saved search embeddable to make its behaviour more consistent with other embeddables:

1. The saved search embeddable no longer ignores its local time range in favour of the dashboard one - instead, the saved search exposes this custom time range via the panel custom time range action
2. The saved search now exposes its filters via the panel filters action
3. If the search is saved to the library, then the library item gets updated when the dashboard is saved.

[andreadelrio]

Really impressive work here @Heenawter! After testing this locally, my recommendation is not to re-use the main Unified Search bar for the saved search panel. During my testing this felt quite confusing and I had already watched the recording where Hannah explains the behavior. I anticipate this causing confusion to users who are completely new to the feature.

Instead, I suggest we incorporate some of the ideas @MichaelMarcialis had explored as he was iterating on Dashboard - Merge Visualization & Panel Settings #174136 Below is a quick mock I’ve put together based on some of those ideas to show why I think it’s possible to have a simplied version* of the Unified Search working in the flyout. Having filters/queries in two distinct locations (flyout and main Unified Search bar) will really help users keep track of what's local to the saved search panel and what's global to the dashboard.

(*) Doesn't include functionality for loading and saving queries, which Hannah and I think should be excluded from this UI.

Note

The above is a quick mock and we still have a number of open questions which include

• Where do we place the Edit/Open in Discover button?
• Where do we place the Search field names input? In Discover, we currently have a single search input for all fields accordions (Selected, Popular, Available, Empty and Meta). Because of the way in which we're using accordions in this flyout, I don't think we'd be able to do the same. Perhaps we'll need to have one search input inside each fields accordion.
• Where do we place the Add field button?
• Where do we place the switch to Lucene button?
• Where do we place the switch to ES|QL button? Ryan is working on the switch for One Discover. We should aim to re-use that.