Merge branch '213233_remove_code_duplications' into 'master'

Avoid code duplication in CE&EE for projects services initialization

See merge request gitlab-org/gitlab!28819

app/assets/javascripts/pages/projects/services/edit/index.js

 import IntegrationSettingsForm from '~/integrations/integration_settings_form';
-import PrometheusMetrics from '~/prometheus_metrics/prometheus_metrics';
+import PrometheusMetrics from 'ee_else_ce/prometheus_metrics/prometheus_metrics';
 import PrometheusAlerts from '~/prometheus_alerts';
 import initAlertsSettings from '~/alerts_service_settings';
 
 document.addEventListener('DOMContentLoaded', () => {
-  const prometheusSettingsWrapper = document.querySelector('.js-prometheus-metrics-monitoring');
   const integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
   integrationSettingsForm.init();
 
+  const prometheusSettingsSelector = '.js-prometheus-metrics-monitoring';
+  const prometheusSettingsWrapper = document.querySelector(prometheusSettingsSelector);
   if (prometheusSettingsWrapper) {
-    const prometheusMetrics = new PrometheusMetrics('.js-prometheus-metrics-monitoring');
-    prometheusMetrics.loadActiveMetrics();
+    const prometheusMetrics = new PrometheusMetrics(prometheusSettingsSelector);
+    prometheusMetrics.init();
   }
 
   PrometheusAlerts();

app/assets/javascripts/prometheus_metrics/prometheus_metrics.js

@@ -28,6 +28,10 @@ export default class PrometheusMetrics {
     this.$panelToggle.on('click', e => this.handlePanelToggle(e));
   }
 
+  init() {
+    this.loadActiveMetrics();
+  }
+
   /* eslint-disable class-methods-use-this */
   handlePanelToggle(e) {
     const $toggleBtn = $(e.currentTarget);

ee/app/assets/javascripts/pages/projects/services/edit/index.js

-import PrometheusMetrics from 'ee/prometheus_metrics/prometheus_metrics';
-import PrometheusAlerts from '~/prometheus_alerts';
-import IntegrationSettingsForm from '~/integrations/integration_settings_form';
-import initAlertsSettings from '~/alerts_service_settings';
-
-document.addEventListener('DOMContentLoaded', () => {
-  const integrationSettingsForm = new IntegrationSettingsForm('.js-integration-settings-form');
-  integrationSettingsForm.init();
-
-  const prometheusSettingsWrapper = document.querySelector('.js-prometheus-metrics-monitoring');
-  if (prometheusSettingsWrapper) {
-    const prometheusMetrics = new PrometheusMetrics('.js-prometheus-metrics-monitoring');
-    if (prometheusMetrics.isServiceActive) {
-      prometheusMetrics.loadActiveCustomMetrics();
-    } else {
-      prometheusMetrics.setNoIntegrationActiveState();
-    }
-  }
-
-  PrometheusAlerts();
-  initAlertsSettings(document.querySelector('.js-alerts-service-settings'));
-});

ee/app/assets/javascripts/prometheus_metrics/prometheus_metrics.js

@@ -55,6 +55,14 @@ export default class EEPrometheusMetrics extends PrometheusMetrics {
     this.isServiceActive = this.$monitoredCustomMetricsPanel.data('service-active');
   }
 
+  init() {
+    if (this.isServiceActive) {
+      this.loadActiveCustomMetrics();
+    } else {
+      this.setNoIntegrationActiveState();
+    }
+  }
+
   // eslint-disable-next-line class-methods-use-this
   setHidden(els) {
     els.forEach(el => el.addClass('hidden'));