Add latest changes from gitlab-org/gitlab@master

2 files changed, 28 insertions, 18 deletions

diff --git a/app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js b/app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js
index 8a5300c9266..479c82265f2 100644
--- a/app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js
+++ b/app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js
@@ -1,17 +1,22 @@
 import initSettingsPanels from '~/settings_panels';
 import AjaxVariableList from '~/ci_variable_list/ajax_variable_list';
+import initVariableList from '~/ci_variable_list';
 
 document.addEventListener('DOMContentLoaded', () => {
   // Initialize expandable settings panels
   initSettingsPanels();
 
-  const variableListEl = document.querySelector('.js-ci-variable-list-section');
-  // eslint-disable-next-line no-new
-  new AjaxVariableList({
-    container: variableListEl,
-    saveButton: variableListEl.querySelector('.js-ci-variables-save-button'),
-    errorBox: variableListEl.querySelector('.js-ci-variable-error-box'),
-    saveEndpoint: variableListEl.dataset.saveEndpoint,
-    maskableRegex: variableListEl.dataset.maskableRegex,
-  });
+  if (gon.features.newVariablesUi) {
+    initVariableList();
+  } else {
+    const variableListEl = document.querySelector('.js-ci-variable-list-section');
+    // eslint-disable-next-line no-new
+    new AjaxVariableList({
+      container: variableListEl,
+      saveButton: variableListEl.querySelector('.js-ci-variables-save-button'),
+      errorBox: variableListEl.querySelector('.js-ci-variable-error-box'),
+      saveEndpoint: variableListEl.dataset.saveEndpoint,
+      maskableRegex: variableListEl.dataset.maskableRegex,
+    });
+  }
 });
diff --git a/app/assets/javascripts/pages/projects/settings/ci_cd/show/index.js b/app/assets/javascripts/pages/projects/settings/ci_cd/show/index.js
index b4aac8eea2b..e08d0407245 100644
--- a/app/assets/javascripts/pages/projects/settings/ci_cd/show/index.js
+++ b/app/assets/javascripts/pages/projects/settings/ci_cd/show/index.js
@@ -2,6 +2,7 @@ import initSettingsPanels from '~/settings_panels';
 import SecretValues from '~/behaviors/secret_values';
 import AjaxVariableList from '~/ci_variable_list/ajax_variable_list';
 import registrySettingsApp from '~/registry/settings/registry_settings_bundle';
+import initVariableList from '~/ci_variable_list';
 
 document.addEventListener('DOMContentLoaded', () => {
   // Initialize expandable settings panels
@@ -15,15 +16,19 @@ document.addEventListener('DOMContentLoaded', () => {
     runnerTokenSecretValue.init();
   }
 
-  const variableListEl = document.querySelector('.js-ci-variable-list-section');
-  // eslint-disable-next-line no-new
-  new AjaxVariableList({
-    container: variableListEl,
-    saveButton: variableListEl.querySelector('.js-ci-variables-save-button'),
-    errorBox: variableListEl.querySelector('.js-ci-variable-error-box'),
-    saveEndpoint: variableListEl.dataset.saveEndpoint,
-    maskableRegex: variableListEl.dataset.maskableRegex,
-  });
+  if (gon.features.newVariablesUi) {
+    initVariableList();
+  } else {
+    const variableListEl = document.querySelector('.js-ci-variable-list-section');
+    // eslint-disable-next-line no-new
+    new AjaxVariableList({
+      container: variableListEl,
+      saveButton: variableListEl.querySelector('.js-ci-variables-save-button'),
+      errorBox: variableListEl.querySelector('.js-ci-variable-error-box'),
+      saveEndpoint: variableListEl.dataset.saveEndpoint,
+      maskableRegex: variableListEl.dataset.maskableRegex,
+    });
+  }
 
   // hide extra auto devops settings based checkbox state
   const autoDevOpsExtraSettings = document.querySelector('.js-extra-settings');