Fix navbar CSS

app/assets/javascripts/clusters/clusters_index.js

@@ -28,7 +28,7 @@ const toggleValue = (button) => {
  *
  * When the user clicks the toggle button for each cluster, it:
  * - toggles the button
- * - shows a loading and disabled state
+ * - shows a loading and disables button
  * - Makes a put request to the given endpoint
  * Once we receive the response, either:
  * 1) Show updated status in case of successfull response

app/assets/stylesheets/pages/clusters.scss

@@ -17,4 +17,8 @@
   .empty-state .svg-content img {
     width: 145px;
   }
+
+  .top-area .nav-controls > .btn.btn-add-cluster {
+    margin-right: 0;
+  }
 }

app/views/projects/clusters/_tabs.html.haml

@@ -14,5 +14,5 @@
       = link_to project_clusters_path(@project), class: "js-all-tab" do
         = s_("ClusterIntegration|All")
         %span.badge= @all_count
-  .pull-right.nav-bar-right
-    = link_to s_("ClusterIntegration|Add cluster"), new_project_cluster_path(@project), class: "btn btn-success disabled has-tooltip js-add-cluster", title: s_("ClusterIntegration|Multiple clusters are available in GitLab Entreprise Edition Premium and Ultimate")
+  .nav-controls
+    = link_to s_("ClusterIntegration|Add cluster"), new_project_cluster_path(@project), class: "btn btn-success btn-add-cluster disabled has-tooltip js-add-cluster", title: s_("ClusterIntegration|Multiple clusters are available in GitLab Entreprise Edition Premium and Ultimate")

spec/features/projects/clusters_spec.rb

@@ -122,12 +122,13 @@ feature 'Clusters', :js do
         context 'with sucessfull request' do
           it 'user sees updated cluster' do
-            expect do
-              page.find('.js-toggle-cluster-list').click
-              wait_for_requests
-            end.to change { cluster.enabled }
-            expect(page).not_to have_selector('.is-checked')
+            expect(page).to have_selector('.js-toggle-cluster-list.is-checked')
+            # Cluster is enabled
+            page.find('.js-toggle-cluster-list').click
+            wait_for_requests
+            # Cluster must be disabled
+            expect(page).not_to have_selector('.js-toggle-cluster-list.is-checked')
           end
         end
@@ -137,7 +138,7 @@ feature 'Clusters', :js do
             page.find('.js-toggle-cluster-list').click
             Clusters::Cluster.last.provider.make_errored!('Something wrong!')
-
+            # Cluster must still be disabled
             expect(page).not_to have_selector('.js-toggle-cluster-list.is-checked')
           end
         end