Skip to content

Move navigation and actions on clusters page to Vue

What does this MR do and why?

This MR is a part of the revisiting the Kubernetes section issue that contains the following steps:

  1. Move clusters_empty_state component to Vue --> !73064 (merged)
  2. Change the navigation for the new cluster page --> !73163 (merged)
  3. Change the copy and empty state illustrations in the existing components --> !73586 (merged)
  4. Add an empty state variant for the Install new Agent modal --> !73636 (merged)
  5. Change the navigation on the clusters page to Vue and actions button on the top of the page (introducing the clusters_main_view and clusters_actions components <-- \textcolor{#FC6D26}{\textsf{You are here}}
  6. Add the 'All' tab

More information is in the main MR(!71482 (closed))

Screenshots or screen recordings

As part of the current MR, we changed the tabs order and actions dropdown.

Before After
Screenshot_2021-11-03_at_01.43.26 Screenshot_2021-11-10_at_02.26.42
Screenshot_2021-11-03_at_01.44.25 Screenshot_2021-11-10_at_02.31.17
Screenshot_2021-11-08_at_01.03.07 Screenshot_2021-11-08_at_01.05.56
Screenshot_2021-11-08_at_01.03.23 Screenshot_2021-11-08_at_01.05.38

In the Actions dropdown, the default option is opening a modal for registering a new Agent. The split button opens dropdown, where:

  • Create new cluster leads to the new certificate based cluster page (/clusters/new?tab=create)
  • Connect with Agent opens the Agent registration modal
  • Connect with certificate leads to the connect existing certificate based cluster page (/clusters/new?tab=add)

Screenshot_2021-11-08_at_01.04.54

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

  1. Visit the Infrastructure -> Kubernetes clusters section
  2. To add content to the view follow these guides:

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #340759 (closed)

Edited by Anna Vovchenko

Merge request reports