[24.2] Fix inconsistent tab handling in invocation view

[ahmedhamidawan]

Fixes #19286

consistent_tabs_invocation_view_2.mp4

Initial (outdated) change, with the added badge to the export tab

consistent_tabs_invocation_view.mp4

How to test the changes?

(Select all options that apply)

• I've included appropriate automated tests.
• This is a refactoring of components with existing test coverage.
• Instructions for manual testing are as follows:
  1. [add testing steps and prerequisites here if you didn't write automated tests covering all your changes]

License

• I agree to license these and all my past contributions to the core galaxy codebase under the MIT license.

[mvdbeek]

nice!

[mvdbeek]

looks like a round of prettier is needed

[davelopez]

Thanks for the unification!

I personally think that the exclamation badge and disabling the tab is a bit confusing.
For these reasons:

• It draws a lot of attention "for a normal situation" and makes me think there is a problem in those tabs until I read the tooltip.
• The visual state for a disabled tab is not very noticeable (besides for the extra exclamation badge) and requires extra code and style.

Those are not meant to be a -1, just my subjective opinion on UX 😅

[ahmedhamidawan]

@davelopez @mvdbeek and folks in general, is this better?

There's even the primary variant:

[mvdbeek]

Still looks good to me, I think the primary variant is more appopriate ?

[ahmedhamidawan]

Moved the badge out to the tabs-end slot! ✅ @davelopez (updated screencast in description)
Hopefully this works better, I think it's an improvement!

[davelopez]

Yes, this looks way better to me! Thank you!

The export invocation selenium test might need an update to wait for the correct event now that the tab is disabled 😅

[jmchilton]

This is a very beautiful enhancement. So much polish!

[davelopez]

Thank you! 🙏