1 files changed, 24 insertions, 15 deletions

diff --git a/app/assets/javascripts/clusters/clusters_bundle.js b/app/assets/javascripts/clusters/clusters_bundle.js
index 0fdf0c7a389..ebf76af5966 100644
--- a/app/assets/javascripts/clusters/clusters_bundle.js
+++ b/app/assets/javascripts/clusters/clusters_bundle.js
@@ -1,16 +1,12 @@
 import Visibility from 'visibilityjs';
 import Vue from 'vue';
+import initDismissableCallout from '~/dismissable_callout';
 import { s__, sprintf } from '../locale';
 import Flash from '../flash';
 import Poll from '../lib/utils/poll';
 import initSettingsPanels from '../settings_panels';
 import eventHub from './event_hub';
-import {
-  APPLICATION_STATUS,
-  REQUEST_LOADING,
-  REQUEST_SUCCESS,
-  REQUEST_FAILURE,
-} from './constants';
+import { APPLICATION_STATUS, REQUEST_LOADING, REQUEST_SUCCESS, REQUEST_FAILURE } from './constants';
 import ClustersService from './services/clusters_service';
 import ClustersStore from './stores/clusters_store';
 import applications from './components/applications.vue';
@@ -66,6 +62,7 @@ export default class Clusters {
     this.showTokenButton = document.querySelector('.js-show-cluster-token');
     this.tokenField = document.querySelector('.js-cluster-token');
 
+    initDismissableCallout('.js-cluster-security-warning');
     initSettingsPanels();
     setupToggleButtons(document.querySelector('.js-cluster-enable-toggle-area'));
     this.initApplications();
@@ -129,7 +126,8 @@ export default class Clusters {
     if (!Visibility.hidden()) {
       this.poll.makeRequest();
     } else {
-      this.service.fetchData()
+      this.service
+        .fetchData()
         .then(data => this.handleSuccess(data))
         .catch(() => Clusters.handleError());
     }
@@ -177,15 +175,21 @@ export default class Clusters {
 
   checkForNewInstalls(prevApplicationMap, newApplicationMap) {
     const appTitles = Object.keys(newApplicationMap)
-      .filter(appId => newApplicationMap[appId].status === APPLICATION_STATUS.INSTALLED &&
-        prevApplicationMap[appId].status !== APPLICATION_STATUS.INSTALLED &&
-        prevApplicationMap[appId].status !== null)
+      .filter(
+        appId =>
+          newApplicationMap[appId].status === APPLICATION_STATUS.INSTALLED &&
+          prevApplicationMap[appId].status !== APPLICATION_STATUS.INSTALLED &&
+          prevApplicationMap[appId].status !== null,
+      )
       .map(appId => newApplicationMap[appId].title);
 
     if (appTitles.length > 0) {
-      const text = sprintf(s__('ClusterIntegration|%{appList} was successfully installed on your Kubernetes cluster'), {
-        appList: appTitles.join(', '),
-      });
+      const text = sprintf(
+        s__('ClusterIntegration|%{appList} was successfully installed on your Kubernetes cluster'),
+        {
+          appList: appTitles.join(', '),
+        },
+      );
       Flash(text, 'notice', this.successApplicationContainer);
     }
   }
@@ -218,13 +222,18 @@ export default class Clusters {
     this.store.updateAppProperty(appId, 'requestStatus', REQUEST_LOADING);
     this.store.updateAppProperty(appId, 'requestReason', null);
 
-    this.service.installApplication(appId, data.params)
+    this.service
+      .installApplication(appId, data.params)
       .then(() => {
         this.store.updateAppProperty(appId, 'requestStatus', REQUEST_SUCCESS);
       })
       .catch(() => {
         this.store.updateAppProperty(appId, 'requestStatus', REQUEST_FAILURE);
-        this.store.updateAppProperty(appId, 'requestReason', s__('ClusterIntegration|Request to begin installing failed'));
+        this.store.updateAppProperty(
+          appId,
+          'requestReason',
+          s__('ClusterIntegration|Request to begin installing failed'),
+        );
       });
   }