1 files changed, 20 insertions, 26 deletions
diff --git a/app/views/clusters/clusters/index.html.haml b/app/views/clusters/clusters/index.html.haml
index 557ad1bf280..45287a01cc9 100644
--- a/app/views/clusters/clusters/index.html.haml
+++ b/app/views/clusters/clusters/index.html.haml
@@ -3,30 +3,24 @@
 
 = render_gcp_signup_offer
 
-.clusters-container
-  - if @clusters.empty?
-    = render "empty_state"
-  - else
-    .top-area.adjust
-      .nav-text
-        = s_('ClusterIntegration|Kubernetes clusters can be used to deploy applications and to provide Review Apps for this project')
-      = render 'clusters/clusters/buttons'
+.clusters-container.gl-my-2
+  - if display_cluster_agents?(clusterable)
+    .js-toggle-container
+      %ul.nav-links.nav-tabs.nav{ role: 'tablist' }
+        %li.nav-item{ role: 'presentation' }
+          %a.nav-link.active{ href: "#certificate-clusters-pane", id: "certificate-clusters-tab", data: { toggle: 'tab' }, role: 'tab' }
+            %span= s_('ClusterIntegration|Clusters connected with a certificate')
+
+        %li.nav-item{ role: 'presentation' }
+          %a.nav-link{ href: "#agent-clusters-pane", id: "agent-clusters-tab", data: { toggle: 'tab' }, role: 'tab' }
+            %span= s_('ClusterIntegration|GitLab Agent managed clusters')
+
+      .tab-content
+        .tab-pane.active{ id: 'certificate-clusters-pane', role: 'tabpanel' }
+          = render 'cluster_list', clusters: @clusters
 
-    - if Feature.enabled?(:clusters_list_redesign)
-      #js-clusters-list-app{ data: js_clusters_list_data(clusterable.index_path(format: :json)) }
-    - else
-      - if @has_ancestor_clusters
-        .bs-callout.bs-callout-info
-          = s_('ClusterIntegration|Clusters are utilized by selecting the nearest ancestor with a matching environment scope. For example, project clusters will override group clusters.')
-          %strong
-            = link_to _('More information'), help_page_path('user/group/clusters/index', anchor: 'cluster-precedence')
-      .clusters-table.js-clusters-list
-        .gl-responsive-table-row.table-row-header{ role: "row" }
-          .table-section.section-60{ role: "rowheader" }
-            = s_("ClusterIntegration|Kubernetes cluster")
-          .table-section.section-30{ role: "rowheader" }
-            = s_("ClusterIntegration|Environment scope")
-          .table-section.section-10{ role: "rowheader" }
-        - @clusters.each do |cluster|
-          = render "cluster", cluster: cluster.present(current_user: current_user)
-      = paginate @clusters, theme: "gitlab"
+        .tab-pane{ id: 'agent-clusters-pane', role: 'tabpanel' }
+          #js-cluster-agents-list{ data: js_cluster_agents_list_data(clusterable) }
+
+  - else
+    = render 'cluster_list', clusters: @clusters