1 files changed, 9 insertions, 12 deletions

diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js
index 637d0dbde23..b070a59cf15 100644
--- a/app/assets/javascripts/clusters/clusters_bundle.js
+++ b/app/assets/javascripts/clusters/clusters_bundle.js
@@ -14,6 +14,7 @@ import {
 import ClustersService from './services/clusters_service';
 import ClustersStore from './stores/clusters_store';
 import applications from './components/applications.vue';
+import setupToggleButtons from '../toggle_buttons';
 
 /**
  * Cluster page has 2 separate parts:
@@ -31,13 +32,16 @@ export default class Clusters {
       installIngressPath,
       installRunnerPath,
       installPrometheusPath,
+      managePrometheusPath,
       clusterStatus,
       clusterStatusReason,
       helpPath,
+      ingressHelpPath,
     } = document.querySelector('.js-edit-cluster-form').dataset;
 
     this.store = new ClustersStore();
-    this.store.setHelpPath(helpPath);
+    this.store.setHelpPaths(helpPath, ingressHelpPath);
+    this.store.setManagePrometheusPath(managePrometheusPath);
     this.store.updateStatus(clusterStatus);
     this.store.updateStatusReason(clusterStatusReason);
     this.service = new ClustersService({
@@ -48,12 +52,9 @@ export default class Clusters {
       installPrometheusEndpoint: installPrometheusPath,
     });
 
-    this.toggle = this.toggle.bind(this);
     this.installApplication = this.installApplication.bind(this);
     this.showToken = this.showToken.bind(this);
 
-    this.toggleButton = document.querySelector('.js-toggle-cluster');
-    this.toggleInput = document.querySelector('.js-toggle-input');
     this.errorContainer = document.querySelector('.js-cluster-error');
     this.successContainer = document.querySelector('.js-cluster-success');
     this.creatingContainer = document.querySelector('.js-cluster-creating');
@@ -63,6 +64,7 @@ export default class Clusters {
     this.tokenField = document.querySelector('.js-cluster-token');
 
     initSettingsPanels();
+    setupToggleButtons(document.querySelector('.js-cluster-enable-toggle-area'));
     this.initApplications();
 
     if (this.store.state.status !== 'created') {
@@ -94,6 +96,8 @@ export default class Clusters {
           props: {
             applications: this.state.applications,
             helpPath: this.state.helpPath,
+            ingressHelpPath: this.state.ingressHelpPath,
+            managePrometheusPath: this.state.managePrometheusPath,
           },
         });
       },
@@ -101,13 +105,11 @@ export default class Clusters {
   }
 
   addListeners() {
-    this.toggleButton.addEventListener('click', this.toggle);
     if (this.showTokenButton) this.showTokenButton.addEventListener('click', this.showToken);
     eventHub.$on('installApplication', this.installApplication);
   }
 
   removeListeners() {
-    this.toggleButton.removeEventListener('click', this.toggle);
     if (this.showTokenButton) this.showTokenButton.removeEventListener('click', this.showToken);
     eventHub.$off('installApplication', this.installApplication);
   }
@@ -151,11 +153,6 @@ export default class Clusters {
     this.updateContainer(prevStatus, this.store.state.status, this.store.state.statusReason);
   }
 
-  toggle() {
-    this.toggleButton.classList.toggle('is-checked');
-    this.toggleInput.setAttribute('value', this.toggleButton.classList.contains('is-checked').toString());
-  }
-
   showToken() {
     const type = this.tokenField.getAttribute('type');
 
@@ -180,7 +177,7 @@ export default class Clusters {
       .map(appId => newApplicationMap[appId].title);
 
     if (appTitles.length > 0) {
-      const text = sprintf(s__('ClusterIntegration|%{appList} was successfully installed on your cluster'), {
+      const text = sprintf(s__('ClusterIntegration|%{appList} was successfully installed on your Kubernetes cluster'), {
         appList: appTitles.join(', '),
       });
       Flash(text, 'notice', this.successApplicationContainer);