Add latest changes from gitlab-org/gitlab@master

1 files changed, 30 insertions, 23 deletions

diff --git a/app/views/ci/variables/_index.html.haml b/app/views/ci/variables/_index.html.haml
index 7ae5c48b93c..f11c730eba6 100644
--- a/app/views/ci/variables/_index.html.haml
+++ b/app/views/ci/variables/_index.html.haml
@@ -5,27 +5,34 @@
     - link_start = '<a href="%{url}">'.html_safe % { url: help_page_path('ci/variables/README', anchor: 'protected-variables') }
     = s_('Environment variables are configured by your administrator to be %{link_start}protected%{link_end} by default').html_safe % { link_start: link_start, link_end: '</a>'.html_safe }
 
-.row
-  .col-lg-12.js-ci-variable-list-section{ data: { save_endpoint: save_endpoint, maskable_regex: ci_variable_maskable_regex } }
-    .hide.alert.alert-danger.js-ci-variable-error-box
+- if Feature.enabled?(:new_variables_ui, @project || @group)
+  - is_group = !@group.nil?
 
-    %ul.ci-variable-list
-      = render 'ci/variables/variable_header'
-      - @variables.each.each do |variable|
-        = render 'ci/variables/variable_row', form_field: 'variables', variable: variable
-      = render 'ci/variables/variable_row', form_field: 'variables'
-    .prepend-top-20
-      %button.btn.btn-success.js-ci-variables-save-button{ type: 'button' }
-        %span.hide.js-ci-variables-save-loading-icon
-          = icon('spinner spin')
-        = _('Save variables')
-      %button.btn.btn-info.btn-inverted.prepend-left-10.js-secret-value-reveal-button{ type: 'button', data: { secret_reveal_status: "#{@variables.size == 0}" } }
-        - if @variables.size == 0
-          = n_('Hide value', 'Hide values', @variables.size)
-        - else
-          = n_('Reveal value', 'Reveal values', @variables.size)
-    - if !@group && @project.group
-      .settings-header.border-top.prepend-top-20
-        = render 'ci/group_variables/header'
-      .settings-content.pr-0
-        = render 'ci/group_variables/index'
+  #js-ci-project-variables{ data: { endpoint: save_endpoint, project_id: @project&.id || '', group: is_group.to_s, maskable_regex: ci_variable_maskable_regex} }
+
+- else
+  .row
+    .col-lg-12.js-ci-variable-list-section{ data: { save_endpoint: save_endpoint, maskable_regex: ci_variable_maskable_regex } }
+      .hide.alert.alert-danger.js-ci-variable-error-box
+
+      %ul.ci-variable-list
+        = render 'ci/variables/variable_header'
+        - @variables.each.each do |variable|
+          = render 'ci/variables/variable_row', form_field: 'variables', variable: variable
+        = render 'ci/variables/variable_row', form_field: 'variables'
+      .prepend-top-20
+        %button.btn.btn-success.js-ci-variables-save-button{ type: 'button' }
+          %span.hide.js-ci-variables-save-loading-icon
+            = icon('spinner spin')
+          = _('Save variables')
+        %button.btn.btn-info.btn-inverted.prepend-left-10.js-secret-value-reveal-button{ type: 'button', data: { secret_reveal_status: "#{@variables.size == 0}" } }
+          - if @variables.size == 0
+            = n_('Hide value', 'Hide values', @variables.size)
+          - else
+            = n_('Reveal value', 'Reveal values', @variables.size)
+
+- if !@group && @project.group
+  .settings-header.border-top.prepend-top-20
+    = render 'ci/group_variables/header'
+  .settings-content.pr-0
+    = render 'ci/group_variables/index'