Add live data split view tutorial

[mjamescompton]

Summary

References #7346

Changes

• Update users store field mask
• Update live view button stying
• Add Live view tutorial

Testing

Steps

View a gateway or application
Live view tutorial should be visible
Click the x to close the tutorial
Opening the page again will cause the tutorial to be visible again
Click either try it or got it to make the tutorial hide for ever.

How to reset tutorial.seen

Open db

tools/bin/mage dev:dbsql

Remove all console preoferences

UPDATE users SET console_preferences = NULL WHERE primary_email_address= '[email protected]';

Results

Screen.Recording.2024-12-04.at.14.18.16.mov

Regressions

...

Notes for Reviewers

Closing the tutorial, then opening and closes the live view causing the tutorial to show again. Show opening the live view make the tutorial hide for ever or should we wait until someone clicks got it or try it.

Checklist

• Scope: The referenced issue is addressed, there are no unrelated changes.
• Compatibility: The changes are backwards compatible with existing API, storage, configuration and CLI, according to the compatibility commitments in README.md for the chosen target branch.
• Documentation: Relevant documentation is added or updated.
• Testing: The steps/process to test this feature are clearly explained including testing for regressions.
• Infrastructure: If infrastructural changes (e.g., new RPC, configuration) are needed, a separate issue is created in the infrastructural repositories.
• Changelog: Significant features, behavior changes, deprecations and fixes are added to CHANGELOG.md.
• Commits: Commit messages follow guidelines in CONTRIBUTING.md, there are no fixup commits left.

[ryaplots]

I think it makes sense that if the user opens the split view, the tutorial disappears forever, because it's basically the same action as "Try it".

See my comments below.

[pierrephz]

@mjamescompton here is my review regarding the design of that feature:

https://www.figma.com/design/7pBLWK4tsjoAbyJq2viMAQ/console?node-id=6608-16341&t=aXv5IH07ZWfRBo8g-1

DM me for any question

[johanstokking]

Only reviewed API

[pierrephz]

Three things:

1. Make Try it a primary button and place it on the right.
   Make Got it a secondary button and place it on the left.
2. Got it button doesn't close the dialog for me.
   Try it and Live data buttons open the Split view, but when I close it, the dialog is still here.
3. Add shadow to the dialog, and to the button (you can send me screenshot to confirm).