Set dropdowns for protected branches list

[ci skip]

app/assets/javascripts/protected_branch_access_dropdown.js.es6

@@ -26,6 +26,10 @@
           // Here because last selected item is not considered after first close
           this.activeIds = self.getActiveIds();
         },
+        setActiveIds() {
+          // Needed for pre select options
+          this.activeIds = self.getActiveIds();
+        },
         clicked(item, $el, e) {
           e.preventDefault();
           self.inputCount++;

app/assets/javascripts/protected_branch_edit.js.es6

@@ -13,14 +13,14 @@
     buildDropdowns() {
 
       // Allowed to merge dropdown
-      new gl.ProtectedBranchAccessDropdown({
+      new gl.allowedToMergeDropdown({
         $dropdown: this.$allowedToMergeDropdown,
         data: gon.merge_access_levels,
         onSelect: this.onSelect.bind(this)
       });
 
       // Allowed to push dropdown
-      new gl.ProtectedBranchAccessDropdown({
+      new gl.allowedToPushDropdown({
         $dropdown: this.$allowedToPushDropdown,
         data: gon.push_access_levels,
         onSelect: this.onSelect.bind(this)

app/views/projects/protected_branches/_access_level_dropdown.html.haml

+- if access_levels.present?
+  - access_levels.map.with_index do |level, i|
+    - if (level.type == :user)
+      - fieldKey = 'user_id' 
+      - value = level.user_id
+    - else
+      - fieldKey = 'access_level'
+      - value = level.access_level
+    %input{ type: 'hidden', name: "protected_branch[#{input_basic_name}][#{i}][#{fieldKey}]",
+                            value: value, data: { type: level.type } }
+
+= dropdown_tag('Select', options: { toggle_class: "#{toggle_class} js-multiselect", dropdown_class: 'dropdown-menu-user dropdown-menu-selectable', filter: true,
+                                    data: { input_id: input_basic_name, default_label: 'Select' } })

app/views/projects/protected_branches/_branches_list.html.haml

@@ -10,17 +10,18 @@
 
     %table.table.table-bordered
       %colgroup
-        %col{ width: "25%" }
-        %col{ width: "30%" }
-        %col{ width: "25%" }
         %col{ width: "20%" }
+        %col{ width: "20%" }
+        %col{ width: "20%" }
+        %col{ width: "20%" }
+        - if can_admin_project
+          %col
       %thead
         %tr
           %th Protected branch (#{@protected_branches.size})
           %th Last commit
           %th Allowed to merge
           %th Allowed to push
-          %th
           - if can_admin_project
             %th
       %tbody

app/views/projects/protected_branches/_create_protected_branch.html.haml

@@ -24,14 +24,14 @@
           .col-md-10
             = dropdown_tag('Select',
                            options: { toggle_class: 'js-allowed-to-merge wide js-multiselect', dropdown_class: 'dropdown-menu-user dropdown-menu-selectable', filter: true,
-                           data: { input_id: 'merge_access_levels_attributes', default_label: 'Select' }})
+                           data: { input_id: 'merge_access_levels_attributes', default_label: 'Select' } })
         .form-group
           %label.col-md-2.text-right{ for: 'push_access_levels_attributes' }
             Allowed to push:
           .col-md-10
             = dropdown_tag('Select',
                            options: { toggle_class: 'js-allowed-to-push wide js-multiselect', dropdown_class: 'dropdown-menu-user dropdown-menu-selectable', filter: true,
-                           data: { input_id: 'push_access_levels_attributes', default_label: 'Select' }})
+                           data: { input_id: 'push_access_levels_attributes', default_label: 'Select' } })
 
     .panel-footer
       = f.submit 'Protect', class: 'btn-create btn', disabled: true

app/views/projects/protected_branches/_protected_branch.html.haml

@@ -16,9 +16,6 @@
 
   = render partial: 'protected_branch_access_summary', locals: { protected_branch: protected_branch }
 
-  %td
-    = link_to "Settings", namespace_project_protected_branch_path(@project.namespace, @project, protected_branch), class: "btn btn-info"
-
   - if can_admin_project
     %td
       = link_to 'Unprotect', [@project.namespace.becomes(Namespace), @project, protected_branch], data: { confirm: 'Branch will be writable for developers. Are you sure?' }, method: :delete, class: 'btn btn-warning'

app/views/projects/protected_branches/_protected_branch_access_summary.html.haml

 %td
-  - access_by_type = protected_branch.merge_access_level_frequencies
-  - tooltip_text = protected_branch.merge_access_levels.map { |access_level| "<li>#{access_level.humanize}</li>" }.join
-  %span.has-tooltip{ title: tooltip_text, data: { container: "body", html: 1 } }= [pluralize(access_by_type[:user], 'user'), pluralize(access_by_type[:role], 'role')].to_sentence
+  = render partial: 'access_level_dropdown', locals: { protected_branch: protected_branch, access_levels: protected_branch.merge_access_levels, input_basic_name: 'merge_access_levels_attributes', toggle_class: 'js-allowed-to-merge' }
 
 %td
-  - access_by_type = protected_branch.push_access_level_frequencies
-  - tooltip_text = protected_branch.push_access_levels.map { |access_level| "<li>#{access_level.humanize}</li>" }.join
-  %span.has-tooltip{ title: tooltip_text, data: { container: "body", html: 1 } }= [pluralize(access_by_type[:user], 'user'), pluralize(access_by_type[:role], 'role')].to_sentence
+  = render partial: 'access_level_dropdown', locals: { protected_branch: protected_branch, access_levels: protected_branch.push_access_levels, input_basic_name: 'push_access_levels_attributes', toggle_class: 'js-allowed-to-push' }