[16234][fleet] better determine target clusters

[marcelofukumoto]

Summary

Fixes #16234

Occurred changes and/or fixed issues

• JIRA: SURE-8120 request to improve visibility of the clusters.
• We used a Drawer similar to used on Show Configuration
• The Drawer contains 3 tabs: Clusters, Resources, Source (we moved Source inside as requested by the design and confirm with the fleet team)
• Create reusable components used on Show Configuration, and used the Drawer Component.
• Fixed one alignment issue

Files changed:
shell/assets/translations/en-us.yaml - Added new translation for the tabs
shell/components/Drawer/Chrome.vue - Remove footer option and some alignment (small changes)
shell/components/Drawer/DrawerCard.vue - New file for the DrawerCard from the other usage
shell/components/Drawer/ResourceDetailDrawer/ConfigTab.vue - Change to use DrawerCard
shell/components/Drawer/ResourceDetailDrawer/tests/ConfigTab.test.ts - Fixed the test since changed reference
shell/components/Drawer/ResourceDetailDrawer/index.vue - Option to remove the borders added
shell/components/Drawer/types.ts - Added removeFooter option
shell/components/Tabbed/index.vue - Added removeBorder option
shell/components/fleet/FleetClusters.vue - Remove subRows added to remove errors, removeReadyColumns as well to remove those options
shell/components/fleet/FleetResources.vue - Added groupOptions for the FleetResource for the Clusters
shell/components/fleet/dashboard/ResourceDetails.vue - Biggest change, change the entire UI adding the Drawer and the Tabs
shell/components/formatter/FleetSummaryGraph.vue - Added the option to filter the data on the cluster table
shell/models/fleet-application.js - Changed the model to pass the data filtered on the targetClusters
shell/pages/c/_cluster/fleet/index.vue - Added the new options to make the Drawer similar to the other one

Technical notes summary

• The branch is created from 16308 so we need to wait for the merge of 16308 to merge this one and see the separated code.
• Many changes to the ResourceDetailDrawer which are only new options to share the usage with the ResourceDetail

Areas or cases that should be tested

• Normal ResourceDetailDrawer like the Show Configuration one for Regression
• The Fleet card Drawer on the Dashboard

Areas which could experience regressions

• The ResourceDetailDrawer

Screenshot/Video

Issue 16234 UI_220f18162ce34150acb4a14b707f35cc-130126-1550-8.pdf

Checklist

• The PR is linked to an issue and the linked issue has a Milestone, or no issue is needed
• The PR has a Milestone
• The PR template has been filled out
• The PR has been self reviewed
• The PR has a reviewer assigned
• The PR has automated tests or clear instructions for manual tests and the linked issue has appropriate QA labels, or tests are not needed
• The PR has reviewed with UX and tested in light and dark mode, or there are no UX changes
• The PR has been reviewed in terms of Accessibility
• The PR has considered, and if applicable tested with, the three Global Roles Admin, Standard User and User Base
• Special case - Wait for 16308 to be merged PR: [16308][fleet][shell] Changed slideIn shellAPI to receive Props as a property inste… #16349

[torchiaf]

LGTM - see the comment below

[torchiaf]

We should double-check if this is changing the workspace switch logic.

[marcelofukumoto]

Let me do a full report of this case here.

It just prioritizes if the workspace exists in the data.
If it is the default or empty, it should return to the first element.

The LAST_NAMESPACE is used to remember the previous one select and used after creation. It is set only in one place. So the default is only changed when there is a edit of a resounrce.

I thought about using the LAST_NAMESPACE which means I would need to keep setting it.
this.workspace remembers the previous option and select the correct one in case of navigation as well. I thought about removing the LAST_NAMESPACE completely but I was not so sure if there is a specific use case for that one, so I kept as an alternative.

In the end, if the this.workspace is not there, it will be the option selected anyway, and if it is there it would go to empty and than to the first option on the array, now, instead it will go to this.workspace. Which means the usual case of this.workspace empty is still the same.

If you can let me know if there is any case I am not aware of. Or if there were recents problems on this feature.