[Dashboard] Warning Color & Tooltip for Unsaved Changes Badge

[jughosta]

Kibana version: 8.3

Description of the problem including expected versus actual behavior:

• Can we change "Unsaved changes" badge color to a warning color instead?
• It would be great to add a tooltip to the badge and suggest what to do to save those changes.

Steps to reproduce:

1. Create a dashboard and add a visualization
2. Edit visualization
3. Notice that "Unsaved changes" badge appeared at the top

[elasticmachine]

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

[ThomThomson]

I've been thinking about having a tooltip here for a while. The tooltip could elaborate on what exactly has changed on the dashboard, and could tell the user to click save to clear it.

@andreadelrio, what do you think about changing the unsaved changes badge to the warning color instead of secondary?

[andreadelrio]

I've been thinking about having a tooltip here for a while. The tooltip could elaborate on what exactly has changed on the dashboard, and could tell the user to click save to clear it.

@andreadelrio, what do you think about changing the unsaved changes badge to the warning color instead of secondary?

I think switching to the warning color makes a lot of sense. That secondary color also represents "success" so it's a bit misleading here.

[10xtechie]

Hello @ThomThomson, @jughosta, @andreadelrio
I have locally made the suitable codes changes for this enhancement - please see the screenshot below.

Please let me know exact what message you want to see on tooltip and what we should do for i18n translation of the tooltip message. Also, please assign this issue to me :)

[ThomThomson]

That looks great so far @10xtechie, would you mind opening a PR against the main branch for your change and we can discuss further there? So far, we don't have a system in place for showing the user exactly which pieces of the dashboard has changed, but I think it's still a good idea to have a tooltip that says something like:

"This dashboard has changed since the last time it was saved. To clear this message save the dashboard"

Tagging @KOTungseth for copywriting help with this!

[10xtechie]

@ThomThomson ,
I have updated the PR based your comment. Could you please review ?