Add latest changes from gitlab-org/gitlab@13-11-stable-eev13.11.0-rc43

12 files changed, 99 insertions, 125 deletions

diff --git a/app/views/shared/issuable/_approved_by_dropdown.html.haml b/app/views/shared/issuable/_approved_by_dropdown.html.haml
index 8014545ab85..c64d34d0da4 100644
--- a/app/views/shared/issuable/_approved_by_dropdown.html.haml
+++ b/app/views/shared/issuable/_approved_by_dropdown.html.haml
@@ -1,10 +1,10 @@
 #js-dropdown-approved-by.filtered-search-input-dropdown-menu.dropdown-menu
   %ul{ data: { dropdown: true } }
     %li.filter-dropdown-item{ data: { value: 'None' } }
-      %button.btn.btn-link{ type: 'button' }
+      %button.gl-button.btn.btn-link{ type: 'button' }
         = _('None')
     %li.filter-dropdown-item{ data: { value: 'Any' } }
-      %button.btn.btn-link{ type: 'button' }
+      %button.gl-button.btn.btn-link{ type: 'button' }
         = _('Any')
     %li.divider.droplab-item-ignore
     - if current_user
diff --git a/app/views/shared/issuable/_board_create_list_dropdown.html.haml b/app/views/shared/issuable/_board_create_list_dropdown.html.haml
index 1a22a66d185..74b064648c0 100644
--- a/app/views/shared/issuable/_board_create_list_dropdown.html.haml
+++ b/app/views/shared/issuable/_board_create_list_dropdown.html.haml
@@ -1,5 +1,5 @@
 .dropdown.gl-display-flex.gl-align-items-center.gl-ml-3#js-add-list
-  %button.gl-button.btn.btn-confirm.btn-confirm-secondary.js-new-board-list{ type: "button", data: board_list_data }
+  %button.gl-button.btn.btn-confirm.js-new-board-list{ type: "button", data: board_list_data }
     Add list
   .dropdown-menu.dropdown-extended-height.dropdown-menu-paging.dropdown-menu-right.dropdown-menu-issues-board-new.dropdown-menu-selectable.js-tab-container-labels
     = render partial: "shared/issuable/label_page_default", locals: { show_footer: true, show_create: true, show_boards_content: true, title: "Add list" }
diff --git a/app/views/shared/issuable/_bulk_update_sidebar.html.haml b/app/views/shared/issuable/_bulk_update_sidebar.html.haml
index b6fc1f4955b..bbbb728d048 100644
--- a/app/views/shared/issuable/_bulk_update_sidebar.html.haml
+++ b/app/views/shared/issuable/_bulk_update_sidebar.html.haml
@@ -6,7 +6,7 @@
     = form_tag [:bulk_update, @project, type], method: :post, class: "bulk-update" do
       .block.issuable-sidebar-header
         .filter-item.inline.update-issues-btn.float-left
-          = button_tag _('Update all'), class: "gl-button btn update-selected-issues btn-info", disabled: true
+          = button_tag _('Update all'), class: "gl-button btn update-selected-issues btn-confirm", disabled: true
         = button_tag _('Cancel'), class: "gl-button btn btn-default js-bulk-update-menu-hide float-right"
       - if params[:state] != 'merged'
         .block
diff --git a/app/views/shared/issuable/_form.html.haml b/app/views/shared/issuable/_form.html.haml
index 41b7d7e9e1b..de657e39453 100644
--- a/app/views/shared/issuable/_form.html.haml
+++ b/app/views/shared/issuable/_form.html.haml
@@ -62,26 +62,24 @@
 
 - is_footer = !(issuable.is_a?(MergeRequest) && issuable.new_record?)
 .row-content-block{ class: (is_footer ? "footer-block" : "middle-block") }
-  .float-right
-    - if issuable.new_record?
-      = link_to _('Cancel'), polymorphic_path([@project, issuable.class]), class: 'gl-button btn btn-cancel'
-    - else
-      - if can?(current_user, :"destroy_#{issuable.to_ability_name}", @project)
-        = link_to 'Delete', polymorphic_path([@project, issuable], params: { destroy_confirm: true }), data: { confirm: "#{issuable.human_class_name} will be removed! Are you sure?" }, method: :delete, class: 'btn btn-danger btn-grouped'
-      = link_to _('Cancel'), polymorphic_path([@project, issuable]), class: 'gl-button btn btn-grouped btn-default btn-cancel'
-
-  %span.gl-mr-3
-    - if issuable.new_record?
-      = form.submit "Submit #{issuable.class.model_name.human.downcase}", class: 'gl-button btn btn-confirm', data: { qa_selector: 'issuable_create_button' }
-    - else
-      = form.submit 'Save changes', class: 'gl-button btn btn-confirm'
-
   - if !issuable.persisted? && !issuable.project.empty_repo? && (guide_url = issuable.project.present.contribution_guide_path)
-    .inline.gl-mt-3
+    .gl-mb-5
       Please review the
       %strong= link_to('contribution guidelines', guide_url)
       for this project.
 
+  - if issuable.new_record?
+    = form.submit "Create #{issuable.class.model_name.human.downcase}", class: 'gl-button btn btn-confirm gl-mr-2', data: { qa_selector: 'issuable_create_button' }
+  - else
+    = form.submit 'Save changes', class: 'gl-button btn btn-confirm gl-mr-2'
+
+  - if issuable.new_record?
+    = link_to _('Cancel'), polymorphic_path([@project, issuable.class]), class: 'btn gl-button btn-default'
+  - else
+    = link_to _('Cancel'), polymorphic_path([@project, issuable]), class: 'gl-button btn btn-default'
+    - if can?(current_user, :"destroy_#{issuable.to_ability_name}", @project)
+      = link_to 'Delete', polymorphic_path([@project, issuable], params: { destroy_confirm: true }), data: { confirm: _('%{issuableType} will be removed! Are you sure?') % { issuableType: issuable.human_class_name } }, method: :delete, class: 'btn gl-button btn-danger btn-danger-secondary gl-float-right'
+
 = render_if_exists 'shared/issuable/remove_approver'
 
 - if issuable.respond_to?(:issue_type)
diff --git a/app/views/shared/issuable/_invite_members_trigger.html.haml b/app/views/shared/issuable/_invite_members_trigger.html.haml
new file mode 100644
index 00000000000..5dd6ec0addf
--- /dev/null
+++ b/app/views/shared/issuable/_invite_members_trigger.html.haml
@@ -0,0 +1,8 @@
+- return unless can_import_members?
+
+.js-invite-members-modal{ data: { id: project.id,
+  name: project.name,
+  is_project: 'true',
+  access_levels: ProjectMember.access_level_roles.to_json,
+  default_access_level: Gitlab::Access::GUEST,
+  help_link: help_page_url('user/permissions') } }
diff --git a/app/views/shared/issuable/_nav.html.haml b/app/views/shared/issuable/_nav.html.haml
index a3d6a2c8e04..cff50eef88b 100644
--- a/app/views/shared/issuable/_nav.html.haml
+++ b/app/views/shared/issuable/_nav.html.haml
@@ -1,6 +1,6 @@
 - type = local_assigns.fetch(:type, :issues)
 - page_context_word = type.to_s.humanize(capitalize: false)
-- display_count = local_assigns.fetch(:display_count, :true)
+- display_count = local_assigns.fetch(:display_count, true)
 
 %ul.nav-links.issues-state-filters.mobile-separator.nav.nav-tabs
   %li{ class: active_when(params[:state] == 'opened') }>
diff --git a/app/views/shared/issuable/_search_bar.html.haml b/app/views/shared/issuable/_search_bar.html.haml
index f5b2868aa6c..1e340f033a1 100644
--- a/app/views/shared/issuable/_search_bar.html.haml
+++ b/app/views/shared/issuable/_search_bar.html.haml
@@ -3,15 +3,15 @@
 - show_sorting_dropdown = local_assigns.fetch(:show_sorting_dropdown, true)
 - disable_target_branch = local_assigns.fetch(:disable_target_branch, false)
 - placeholder = local_assigns[:placeholder] || _('Search or filter results...')
-- is_not_boards_modal_or_productivity_analytics = type != :boards_modal && type != :productivity_analytics
-- block_css_class = is_not_boards_modal_or_productivity_analytics ? 'row-content-block second-block' : ''
-- if board && board.to_type == "EpicBoard"
+- block_css_class = type != :productivity_analytics ? 'row-content-block second-block' : ''
+- is_epic_board = board&.to_type == "EpicBoard"
+- if is_epic_board
   - user_can_admin_list = can?(current_user, :admin_epic_board_list, board.resource_parent)
 - elsif board
   - user_can_admin_list = can?(current_user, :admin_issue_board_list, board.resource_parent)
 
-.issues-filters{ class: ("w-100" if type == :boards_modal) }
-  .issues-details-filters.filtered-search-block.d-flex.flex-column.flex-lg-row{ class: block_css_class, "v-pre" => type == :boards_modal }
+.issues-filters
+  .issues-details-filters.filtered-search-block.d-flex.flex-column.flex-lg-row{ class: block_css_class }
     .d-flex.flex-column.flex-md-row.flex-grow-1.mb-lg-0.mb-md-2.mb-sm-0.w-100
       - if type == :boards
         = render "shared/boards/switcher", board: board
@@ -21,16 +21,16 @@
         - if @can_bulk_update
           .check-all-holder.d-none.d-sm-block.hidden
             = check_box_tag "check-all-issues", nil, false, class: "check-all-issues left"
-        - if Feature.enabled?(:boards_filtered_search, @group)
+        - if Feature.enabled?(:boards_filtered_search, @group) && is_epic_board
           #js-board-filtered-search
         - else
           .issues-other-filters.filtered-search-wrapper.d-flex.flex-column.flex-md-row
             .filtered-search-box
-              - if type != :boards_modal && type != :boards
+              - if type != :boards
                 - text = tag.span(sprite_icon('history'), class: "d-md-none") + tag.span(_('Recent searches'), class: "d-none d-md-inline")
                 = dropdown_tag(text,
                   options: { wrapper_class: "filtered-search-history-dropdown-wrapper",
-                  toggle_class: "btn filtered-search-history-dropdown-toggle-button",
+                  toggle_class: "gl-button btn btn-default filtered-search-history-dropdown-toggle-button",
                   dropdown_class: "filtered-search-history-dropdown",
                   content_class: "filtered-search-history-dropdown-content" }) do
                   .js-filtered-search-history-dropdown{ data: { full_path: search_history_storage_prefix } }
@@ -42,7 +42,7 @@
                 #js-dropdown-hint.filtered-search-input-dropdown-menu.dropdown-menu.hint-dropdown
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item{ data: {hint: "#{'{{hint}}'}", tag: "#{'{{tag}}'}", action: "#{'{{hint === \'search\' ? \'submit\' : \'\' }}'}" } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         -# Encapsulate static class name `{{icon}}` inside #{} to bypass
                         -# haml lint's ClassAttributeWithStaticValue
                         %svg
@@ -52,7 +52,7 @@
                 #js-dropdown-operator.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul.filter-dropdown{ data: { dropdown: true, dynamic: true } }
                     %li.filter-dropdown-item{ data: { value: "{{ title }}" } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         {{ title }}
                         %span.btn-helptext
                           {{ help }}
@@ -68,10 +68,10 @@
                 #js-dropdown-assignee.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.divider.droplab-item-ignore
                     - if current_user
@@ -84,10 +84,10 @@
                 #js-dropdown-reviewer.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.divider.droplab-item-ignore
                     - if current_user
@@ -102,92 +102,92 @@
                 #js-dropdown-milestone.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.filter-dropdown-item{ data: { value: 'Upcoming' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Upcoming')
                     %li.filter-dropdown-item{ data: { value: 'Started' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Started')
                     %li.divider.droplab-item-ignore
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item
-                      %button.btn.btn-link.js-data-value{ type: 'button' }
+                      %button.gl-button.btn.btn-link.js-data-value{ type: 'button' }
                         {{title}}
                 = render_if_exists 'shared/issuable/filter_iteration', type: type
                 #js-dropdown-release.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.divider.droplab-item-ignore
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item
-                      %button.btn.btn-link.js-data-value{ type: 'button' }
+                      %button.gl-button.btn.btn-link.js-data-value{ type: 'button' }
                         {{title}}
                 #js-dropdown-label.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.divider.droplab-item-ignore
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         %span.dropdown-label-box{ style: 'background: {{color}}' }
                         %span.label-title.js-data-value
                           {{title}}
                 #js-dropdown-my-reaction.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'None' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('None')
                     %li.filter-dropdown-item{ data: { value: 'Any' } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Any')
                     %li.divider.droplab-item-ignore
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         %gl-emoji
                         %span.js-data-value.gl-ml-3
                           {{name}}
                 #js-dropdown-wip.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul.filter-dropdown{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'yes', capitalize: true } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Yes')
                     %li.filter-dropdown-item{ data: { value: 'no', capitalize: true } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('No')
                 #js-dropdown-confidential.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul.filter-dropdown{ data: { dropdown: true } }
                     %li.filter-dropdown-item{ data: { value: 'yes', capitalize: true } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('Yes')
                     %li.filter-dropdown-item{ data: { value: 'no', capitalize: true } }
-                      %button.btn.btn-link{ type: 'button' }
+                      %button.gl-button.btn.btn-link{ type: 'button' }
                         = _('No')
                 - unless disable_target_branch
                   #js-dropdown-target-branch.filtered-search-input-dropdown-menu.dropdown-menu
                     %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                       %li.filter-dropdown-item
-                        %button.btn.btn-link.js-data-value.monospace
+                        %button.gl-button.btn.btn-link.js-data-value.monospace
                           {{title}}
                 #js-dropdown-environment.filtered-search-input-dropdown-menu.dropdown-menu
                   %ul.filter-dropdown{ data: { dynamic: true, dropdown: true } }
                     %li.filter-dropdown-item
-                      %button.btn.btn-link.js-data-value{ type: 'button' }
+                      %button.gl-button.btn.btn-link.js-data-value{ type: 'button' }
                         {{title}}
 
                 = render_if_exists 'shared/issuable/filter_weight', type: type
@@ -207,8 +207,6 @@
             .js-create-column-trigger{ data: board_list_data }
           - else
             = render 'shared/issuable/board_create_list_dropdown', board: board
-          - if @project
-            #js-add-issues-btn{ data: { can_admin_list: can?(current_user, :admin_issue_board_list, @project) } }
         #js-toggle-focus-btn
-      - elsif is_not_boards_modal_or_productivity_analytics && show_sorting_dropdown
+      - elsif type != :productivity_analytics && show_sorting_dropdown
         = render 'shared/issuable/sort_dropdown'
diff --git a/app/views/shared/issuable/_sidebar.html.haml b/app/views/shared/issuable/_sidebar.html.haml
index 787d9db1192..fb2019bef15 100644
--- a/app/views/shared/issuable/_sidebar.html.haml
+++ b/app/views/shared/issuable/_sidebar.html.haml
@@ -34,7 +34,7 @@
 
       - if issuable_sidebar[:supports_milestone]
         - milestone = issuable_sidebar[:milestone] || {}
-        .block.milestone{ class: 'gl-border-b-0!', data: { qa_selector: 'milestone_block' } }
+        .block.milestone{ :class => ("gl-border-b-0!" if issuable_sidebar[:supports_iterations]), data: { qa_selector: 'milestone_block' } }
           .sidebar-collapsed-icon.has-tooltip{ title: sidebar_milestone_tooltip_label(milestone), data: { container: 'body', html: 'true', placement: 'left', boundary: 'viewport' } }
             = sprite_icon('clock')
             %span.milestone-title.collapse-truncated-title
@@ -70,41 +70,7 @@
             = _('Time tracking')
             = loading_icon(css_class: 'gl-vertical-align-text-bottom')
       - if issuable_sidebar.has_key?(:due_date)
-        .block.due_date
-          .sidebar-collapsed-icon.has-tooltip{ data: { placement: 'left', container: 'body', html: 'true', boundary: 'viewport' }, title: sidebar_due_date_tooltip_label(issuable_sidebar[:due_date]) }
-            = sprite_icon('calendar')
-            %span.js-due-date-sidebar-value
-              = issuable_sidebar[:due_date].try(:to_s, :medium) || _('None')
-          .title.hide-collapsed
-            = _('Due date')
-            = loading_icon(css_class: 'gl-vertical-align-text-bottom hidden block-loading')
-            - if can_edit_issuable
-              = link_to _('Edit'), '#', class: 'js-sidebar-dropdown-toggle edit-link float-right', data: { track_label: "right_sidebar", track_property: "due_date", track_event: "click_edit_button", track_value: "" }
-          .value.hide-collapsed
-            %span.value-content
-              - if issuable_sidebar[:due_date]
-                %span.bold= issuable_sidebar[:due_date].to_s(:medium)
-              - else
-                %span.no-value
-                  = _('None')
-            - if can_edit_issuable
-              %span.no-value.js-remove-due-date-holder{ class: ("hidden" if issuable_sidebar[:due_date].nil?) }
-                \-
-                %a.js-remove-due-date{ href: "#", role: "button" }
-                  = _('remove due date')
-          - if can_edit_issuable
-            .selectbox.hide-collapsed
-              = f.hidden_field :due_date, value: issuable_sidebar[:due_date].try(:strftime, 'yy-mm-dd')
-              .dropdown
-                %button.dropdown-menu-toggle.js-due-date-select{ type: 'button', data: { toggle: 'dropdown', field_name: "#{issuable_type}[due_date]", ability_name: issuable_type, issue_update: issuable_sidebar[:issuable_json_path], display: 'static' } }
-                  %span.dropdown-toggle-text
-                    = _('Due date')
-                  = sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
-                .dropdown-menu.dropdown-menu-due-date
-                  = dropdown_title(_('Due date'))
-                  = dropdown_content do
-                    .js-due-date-calendar
-
+        #js-due-date-entry-point
 
       .js-sidebar-labels{ data: sidebar_labels_data(issuable_sidebar, @project) }
 
@@ -133,12 +99,12 @@
       .block.with-sub-blocks
         #js-reference-entry-point
         - if issuable_type == 'merge_request'
-          .sidebar-source-branch.sub-block
+          .sub-block.js-sidebar-source-branch
             .sidebar-collapsed-icon.dont-change-state
               = clipboard_button(text: source_branch, title: _('Copy branch name'), placement: "left", boundary: 'viewport')
-            .sidebar-mr-source-branch.hide-collapsed
-              %span
-                = _('Source branch: %{source_branch_open}%{source_branch}%{source_branch_close}').html_safe % { source_branch_open: "<cite class='ref-name' title='#{html_escape(source_branch)}'>".html_safe, source_branch_close: "</cite>".html_safe, source_branch: html_escape(source_branch) }
+            .gl-display-flex.gl-align-items-center.gl-justify-content-space-between.gl-mb-2.hide-collapsed
+              %span.gl-overflow-hidden.gl-text-overflow-ellipsis.gl-white-space-nowrap
+                = _('Source branch: %{source_branch_open}%{source_branch}%{source_branch_close}').html_safe % { source_branch_open: "<span class='gl-font-monospace' data-testid='ref-name' title='#{html_escape(source_branch)}'>".html_safe, source_branch_close: "</span>".html_safe, source_branch: html_escape(source_branch) }
               = clipboard_button(text: source_branch, title: _('Copy branch name'), placement: "left", boundary: 'viewport')
 
       - if show_forwarding_email
diff --git a/app/views/shared/issuable/_sidebar_assignees.html.haml b/app/views/shared/issuable/_sidebar_assignees.html.haml
index 26986c913f0..47e7ff0e4bc 100644
--- a/app/views/shared/issuable/_sidebar_assignees.html.haml
+++ b/app/views/shared/issuable/_sidebar_assignees.html.haml
@@ -1,6 +1,7 @@
 - issuable_type = issuable_sidebar[:type]
+- dropdown_options = assignees_dropdown_options(issuable_type)
 
-#js-vue-sidebar-assignees{ data: { field: issuable_type, signed_in: signed_in } }
+#js-vue-sidebar-assignees{ data: { field: issuable_type, signed_in: signed_in, max_assignees: dropdown_options[:data][:"max-select"], directly_invite_members: directly_invite_members?, indirectly_invite_members: indirectly_invite_members? } }
   .title.hide-collapsed
     = _('Assignee')
     = loading_icon(css_class: 'gl-vertical-align-text-bottom')
@@ -29,7 +30,6 @@
       null_user: true,
       display: 'static' } }
 
-  - dropdown_options = assignees_dropdown_options(issuable_type)
   - title = dropdown_options[:title]
   - options[:toggle_class] += ' js-multiselect js-save-user-data'
   - data = { field_name: "#{issuable_type}[assignee_ids][]" }
@@ -53,10 +53,10 @@
       %ul.dropdown-footer-list
         %li
           - if directly_invite_members?
-            = link_to invite_text,
-              project_project_members_path(@project),
-              title: invite_text,
-              data: { 'is-link': true, 'track-event': 'click_invite_members', 'track-label': track_label }
+            .js-invite-members-trigger{ data: { trigger_element: 'anchor',
+              display_text: invite_text,
+              event: 'click_invite_members',
+              label: track_label } }
           - else
             .js-invite-member-trigger{ data: { display_text: invite_text, event: 'click_invite_members_version_b', label: track_label } }
   - else
diff --git a/app/views/shared/issuable/_sort_dropdown.html.haml b/app/views/shared/issuable/_sort_dropdown.html.haml
index f60be3f3e4a..9e3caf62d77 100644
--- a/app/views/shared/issuable/_sort_dropdown.html.haml
+++ b/app/views/shared/issuable/_sort_dropdown.html.haml
@@ -5,7 +5,7 @@
 .dropdown.inline.gl-ml-3.issue-sort-dropdown
   .btn-group{ role: 'group' }
     .btn-group{ role: 'group' }
-      %button.dropdown-menu-toggle{ type: 'button', data: { toggle: 'dropdown', display: 'static' }, class: 'btn btn-default' }
+      %button.dropdown-menu-toggle{ type: 'button', data: { toggle: 'dropdown', display: 'static' }, class: 'gl-button btn btn-default' }
         = sort_title
         = sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
       %ul.dropdown-menu.dropdown-menu-right.dropdown-menu-selectable.dropdown-menu-sort
diff --git a/app/views/shared/issuable/_user_dropdown_item.html.haml b/app/views/shared/issuable/_user_dropdown_item.html.haml
index 4a3547e9e70..b3bc7ba85ad 100644
--- a/app/views/shared/issuable/_user_dropdown_item.html.haml
+++ b/app/views/shared/issuable/_user_dropdown_item.html.haml
@@ -2,7 +2,7 @@
 - avatar = local_assigns.fetch(:avatar, { })
 
 %li.filter-dropdown-item{ class: ('js-current-user' if user == current_user) }
-  %button.btn.btn-link.dropdown-user{ type: :button }
+  %button.gl-button.btn.btn-link.dropdown-user{ type: :button }
     .avatar-container.s40
       = user_avatar_without_link(user: user, lazy: avatar[:lazy], url: avatar[:url], size: 40, has_tooltip: false)
     .dropdown-user-details
diff --git a/app/views/shared/issuable/form/_type_selector.html.haml b/app/views/shared/issuable/form/_type_selector.html.haml
index 67bc4019a82..b5c5e2fa091 100644
--- a/app/views/shared/issuable/form/_type_selector.html.haml
+++ b/app/views/shared/issuable/form/_type_selector.html.haml
@@ -3,26 +3,30 @@
 .form-group.row.gl-mb-0
   = form.label :type, 'Type', class: 'col-form-label col-sm-2'
   .col-sm-10
-    .issuable-form-select-holder.selectbox.form-group.gl-mb-0
-      .dropdown.js-issuable-type-filter-dropdown-wrap
-        %button.dropdown-menu-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
-          %span.dropdown-toggle-text.is-default
-            = issuable.issue_type.capitalize || _("Select type")
-          = sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
-        .dropdown-menu.dropdown-menu-selectable.dropdown-select
-          .dropdown-title.gl-display-flex
-            %span.gl-ml-auto
-              = _("Select type")
-            %button.dropdown-title-button.dropdown-menu-close.gl-ml-auto{ type: 'button', "aria-label" => _('Close') }
-              = sprite_icon('close', size: 16, css_class: 'dropdown-menu-close-icon')
-          .dropdown-content
-            %ul
-              %li.js-filter-issuable-type
-                = link_to new_project_issue_path(@project), class: ("is-active" if issuable.issue?) do
-                  = _("Issue")
-              %li.js-filter-issuable-type{ data: { track: { event: "select_issue_type_incident", label: "select_issue_type_incident_dropdown_option" } } }
-                = link_to new_project_issue_path(@project, { issuable_template: 'incident', issue: { issue_type: 'incident' } }), class: ("is-active" if issuable.incident?) do
-                  = _("Incident")
+    .gl-display-flex.gl-align-items-center
+      .issuable-form-select-holder.selectbox.form-group.gl-mb-0
+        .dropdown.js-issuable-type-filter-dropdown-wrap
+          %button.dropdown-menu-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
+            %span.dropdown-toggle-text.is-default
+              = issuable.issue_type.capitalize || _("Select type")
+            = sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
+          .dropdown-menu.dropdown-menu-selectable.dropdown-select
+            .dropdown-title.gl-display-flex
+              %span.gl-ml-auto
+                = _("Select type")
+              %button.dropdown-title-button.dropdown-menu-close.gl-ml-auto{ type: 'button', "aria-label" => _('Close') }
+                = sprite_icon('close', size: 16, css_class: 'dropdown-menu-close-icon')
+            .dropdown-content
+              %ul
+                %li.js-filter-issuable-type
+                  = link_to new_project_issue_path(@project), class: ("is-active" if issuable.issue?) do
+                    = _("Issue")
+                %li.js-filter-issuable-type{ data: { track: { event: "select_issue_type_incident", label: "select_issue_type_incident_dropdown_option" } } }
+                  = link_to new_project_issue_path(@project, { issuable_template: 'incident', issue: { issue_type: 'incident' } }), class: ("is-active" if issuable.incident?) do
+                    = _("Incident")
+
+      #js-type-popover
+
     - if issuable.incident?
       %p.form-text.text-muted
         - incident_docs_url = help_page_path('operations/incident_management/incidents.md')