Fix issue with short URL not working for dashboard

[eokoneyo]

Summary

This PR Resolves #191090

In addition, it adds implementation to allow consumers pass in their callout message of choice for handling the message displayed to users on attempting to copy a url especially that when short urls are allowed, in draft mode the URL copied will not point to the same configuration once the change has been persisted.

For lens the message that was displayed previously when presented with the option to copy a link remains the same, however for dashboard a new message is being added. See screenshot below;

Checklist

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

[elasticmachine]

Pinging @elastic/appex-sharedux (Team:SharedUX)

[Heenawter]

I am still getting the following error trying to load a short URL for a dashboard that had unsaved changes:

To see this, I took the following steps:

1. Make any change to the dashboard to cause unsaved changes
2. Copy the link via the share modal
3. Paste the generate short URL into an incognito window
4. Warning appears 🔥

This is happening because the entire dashboard state is being serialized into the short URL - not just the unsaved changes. Checkout the short URL saved object: BrokenShortUrl.ndjson.zip

[eokoneyo]

I am still getting the following error trying to load a short URL for a dashboard that had unsaved changes:

To see this, I took the following steps:

1. Make any change to the dashboard to cause unsaved changes
2. Copy the link via the share modal
3. Paste the generate short URL into an incognito window
4. Warning appears 🔥

This is happening because the entire dashboard state is being serialized into the short URL - not just the unsaved changes. Checkout the short URL saved object: BrokenShortUrl.ndjson.zip

Hmmm... interesting this one, so I tried this out on 8.14.0 and this behaviour is consistent especially when the dashboard has unsaved changes relating to panels, it however works in both variations if the suggestion to enable sessionStorage setting is followed so technically we could have the error message that gets displayed in draft mode just before generating a short URL say that sessionStorage is required, I'm however not completely sold because of this other issue we've seen (#183930) that relates to having sessionStorage enabled, at the same, it makes one wonder how folks have been getting past this. let me know what you think.

[Heenawter]

Hmmm... interesting this one, so I tried this out on 8.14.0 and this behaviour is consistent especially when the dashboard has unsaved changes relating to panels,

I dug into this more, and it is specifically controls that are bugged - i.e. having control unsaved changes causes the entire dashboard panel state to be serialized into the URL. I also found the root of the problem - it's a regression caused by #184873 in this part of the code:

kibana/src/plugins/dashboard/public/dashboard_app/top_nav/share/show_share_modal.tsx

Lines 122 to 129 in 0434254

	const allUnsavedPanels = (() => {
	if (
	Object.keys(unsavedDashboardState?.panels ?? {}).length === 0 &&
	Object.keys(panelModifications ?? {}).length === 0
	) {
	// if this dashboard has no modifications or unsaved panels return early. No overrides needed.
	return;
	}

This needs to be changed to the following:

 const allUnsavedPanels = (() => { 
   if ( 
     Object.keys(unsavedDashboardState?.panels ?? {}).length === 0 && 
     Object.keys(omit(panelModifications ?? {}, PANELS_CONTROL_GROUP_KEY)).length === 0 
   ) { 
     // if this dashboard has no modifications or unsaved panels return early. No overrides needed. 
     return; 
   } 

Would it be possible for you to make this change in this PR? It would be greatly appreciated 🙇 And sorry for the noise.

[eokoneyo]

Hmmm... interesting this one, so I tried this out on 8.14.0 and this behaviour is consistent especially when the dashboard has unsaved changes relating to panels,

I dug into this more, and it is specifically controls that are bugged - i.e. having control unsaved changes causes the entire dashboard panel state to be serialized into the URL. I also found the root of the problem - it's a regression caused by #184873 in this part of the code:

kibana/src/plugins/dashboard/public/dashboard_app/top_nav/share/show_share_modal.tsx

Lines 122 to 129 in 0434254

	const allUnsavedPanels = (() => {
	if (
	Object.keys(unsavedDashboardState?.panels ?? {}).length === 0 &&
	Object.keys(panelModifications ?? {}).length === 0
	) {
	// if this dashboard has no modifications or unsaved panels return early. No overrides needed.
	return;
	}

This needs to be changed to the following:

 const allUnsavedPanels = (() => { 
   if ( 
     Object.keys(unsavedDashboardState?.panels ?? {}).length === 0 && 
     Object.keys(omit(panelModifications ?? {}, PANELS_CONTROL_GROUP_KEY)).length === 0 
   ) { 
     // if this dashboard has no modifications or unsaved panels return early. No overrides needed. 
     return; 
   } 

Would it be possible for you to make this change in this PR? It would be greatly appreciated 🙇 And sorry for the noise.

Hey thanks for the suggestion, I tried the snippet you provided... it doesn't resolve the issue and I don't think it would except I'm missing something, testing with the bundled dashboards from sample data and simply shifting the panels around, one observes that the entire panel state as is to be passed along and this is without controls modification, in a dashboard with more panels the URL length would be even much longer.

[elasticmachine]

💚 Build Succeeded

• Buildkite Build
• Commit: 2492dd8

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	684.5KB	686.8KB	+2.3KB
lens	1.5MB	1.5MB	+480.0B
total			+2.8KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
share	15	16	+1

Page load bundle

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

id	before	after	diff
share	58.2KB	58.2KB	+10.0B

History

• 💚 Build #254030 succeeded 55730b4
• 💛 Build #253943 was flaky 4fc0882
• 💛 Build #253292 was flaky faff96a
• 💚 Build #252918 succeeded eb21952
• 💚 Build #251861 succeeded 11cf71f
• 💛 Build #248238 was flaky 1ae7345

cc @eokoneyo

[afharo]

l10n changes LGTM, it should not trigger reviews after #203650 is merged

[kibanamachine]

Starting backport for target branches: 8.15, 8.16, 8.17, 8.x

https://github.com/elastic/kibana/actions/runs/12273600239

[kibanamachine]

💔 Some backports could not be created

Status	Branch	Result
❌	8.15	Backport failed because of merge conflicts
❌	8.16	Backport failed because of merge conflicts
✅	8.17
✅	8.x

Note: Successful backport PRs will be merged automatically after passing CI.

Manual backport

To create the backport manually run:

node scripts/backport --pr 197484

Questions ?

Please refer to the Backport tool documentation

[mistic]

This PR didn't make it on time for the latest v8.17.0 BC. Updating the labels.