[Time to Visualize] Transition Embeddable State Transfer to Session Storage

[ThomThomson]

Summary

closes #85493

Note - please ignore the pink header, It's there to easily distinguish between Kibana instances

This PR switches the Embeddable State Transfer service to use Session Storage. This means that the implicit behaviour of the state being reset to undefined is gone. Now the editor state is:

capable of persisting over reloads

Working correctly with the browser back and forward buttons

Additionally, this PR fixes the incompatibility between #82909 and #83140

Things to Remember When Testing:

• add dashboard.allowByValueEmbeddables: true to your kibana.dev.yml
• Test the Create New flow from dashboards with Lens and Visualize
• Ensure that there is no way duplicates can show up on a dashboard after save and return
• Try with multiple tabs. Session Storage should not pollute other tabs
• Try reloading while editing a by value visualization

Checklist

Delete any items that are not applicable to this PR.

• Unit or functional tests were updated or added to match the most common scenarios

For maintainers

• This was checked for breaking API changes and was labeled appropriately

[elasticmachine]

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

[poffdeluxe]

Tested this with creating a view visualizations and seems to work as advertised. The amount of tests seem like they'll catch a bunch of issues

[poffdeluxe]

bit of a nit but this is more of a constant rather than a type, right? maybe could go in a constants files if applicable

[ThomThomson]

A constants file would be a good home for this, but the embeddable plugin doesn't have one yet.

[kibanamachine]

💚 Build Succeeded

• continuous-integration/kibana-ci/pull-request
• Commit: ceae277

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
dashboard	186.2KB	186.1KB	-11.0B
lens	1018.4KB	1018.5KB	+77.0B
maps	2.8MB	2.8MB	-4.0B
visualize	130.9KB	130.9KB	+4.0B
total			+66.0B

Distributable file count

id	before	after	diff
default	47130	47890	+760

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
dashboard	336.4KB	336.1KB	-369.0B
embeddable	228.3KB	228.8KB	+544.0B
total			+175.0B

History

• 💚 Build #94092 succeeded 8f26e06
• 💔 Build #94075 failed c55adeb
• 💔 Build #93744 failed 24d7189

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[flash1293]

Tested in Chrome and Firefox, transfer state seems to be reset in the relevant places (but take it with a grain of salt with regard to my track record in testing these changes :) )

However once the user starts to use the global search to navigate or to mess with the URL themselves, they can still end up in weird situations, e.g.:

• User goes to dashboard, creates new embedded Lens panel
• User uses global search to switch to another Library lens vis (or manually changes the URL)
• New vis loads, but connection to dashboard is still in place

I'm not 100% sure whether that's even a problem or just expected behavior - leaving that up to you :)

Approving if this was the intended flow

[ThomThomson]

I noticed that these sorts of in-between cases were possible during implementation. They are not strictly intended, but they also don't particularly break anything - which is why I would be okay with merging this, and having a follow up to remove them.

The problem stems from the state transfer state not being linked to the browser history in any way. If we clear the state upon returning to dashboard then it's cleared in all cases and the back / forward buttons won't restore it anymore. The only way I can think of to totally fix this is to introduce a short url param that determines whether the editor should check for incoming state or not.

[streamich]

AppServices code changes LGTM.