Move the cluster UI component under the environment detail page
Problem
Today, the cluster UI component is shown on the environment list page under a collapsible of a collapsible.
We should redesign the environment detail page, and move the cluster UI under the details view. This allows us more space in the future to grow out the Kubernetes Dashboard (including the tree view), as well as simplify the environment list view to what it should be - a list.
Together with it, we might need an "unconfigured" view to help with adoption.
UX Proposal
General Page Updates:
- Update the
Edit
button to sayEdit environment
. - Add two tabs to the top:
Kubernetes overview
andDeployment history
. - When Kubernetes is configured, show Kubernetes tab. If not, show Deployment tab.
Kubernetes Overview Tab Updates:
Page | Empty State |
---|---|
- Move cluster UI from Environment List View to the Kubernetes overview tab with slight layout adjustments.
- Remove Calendar icon and combine time with connection status for agent.
- Create an empty state with the following links:
- Get started: https://docs.gitlab.com/ee/ci/environments/kubernetes_dashboard.html
- Learn more about Kubernetes integration: https://docs.gitlab.com/ee/user/clusters/agent/
Deployment History Tab Updates:
Page | Empty State |
---|---|
- Add deployment count to deployment history tab.
- Adjust empty state with the following links:
- Get started: https://docs.gitlab.com/ee/ci/yaml/#environment
- Learn more about environments: https://docs.gitlab.com/ee/ci/environments/index.html
Implementation plan
The scope of the task is rather big. Work in separate MRs to reduce changes and speed up the review process.
-
Deployment history: - Add
GlTabs
to the environments details page. - Move the current deployments list under the 'deployment history' tab
- Update text and links for the empty state
- Update 'Edit' button
- Add
-
Add Kubernetes Overview to the details page: - Add a new tab for the 'Kubernetes overview'
- Move the current Kubernetes UI under this tab
- Create an empty state
-
Remove Kubernetes overview from the index page: - Remove the code
- Update the docs
-
Tabs logic - Update the tabs to show open the Kubernetes overview by default if it's configured and open Deployments history is the Kubernetes is not configured for an environment.
-
Deployments count - Add a count field to the deployments query
- Update the tab title to show the count
Release Notes
Refactor the environments list to display an easier to parse list, moving the details in a dedicated details page.
Edited by Nicolò Maria Mezzopera