Resolve "Improve Auto DevOps settings flow for admin and project"

1 files changed, 5 insertions, 10 deletions

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 1faa59fb45b..8f5ac3d8082 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
@@ -23,17 +23,12 @@ document.addEventListener('DOMContentLoaded', () => {
     saveEndpoint: variableListEl.dataset.saveEndpoint,
   });
 
-  // hide extra auto devops settings based on data-attributes
-  const autoDevOpsSettings = document.querySelector('.js-auto-devops-settings');
+  // hide extra auto devops settings based checkbox state
   const autoDevOpsExtraSettings = document.querySelector('.js-extra-settings');
-
-  autoDevOpsSettings.addEventListener('click', event => {
+  const instanceDefaultBadge = document.querySelector('.js-instance-default-badge');
+  document.querySelector('.js-toggle-extra-settings').addEventListener('click', event => {
     const { target } = event;
-    if (target.classList.contains('js-toggle-extra-settings')) {
-      autoDevOpsExtraSettings.classList.toggle(
-        'hidden',
-        !!(target.dataset && target.dataset.hideExtraSettings),
-      );
-    }
+    if (instanceDefaultBadge) instanceDefaultBadge.style.display = 'none';
+    autoDevOpsExtraSettings.classList.toggle('hidden', !target.checked);
   });
 });