- display_issuable_type = issuable_display_type(issuable)
- button_action = issuable.closed? ? 'reopen' : 'close'
- display_button_action = button_action.capitalize
- button_responsive_class = 'd-none d-md-block'
- button_class = "#{button_responsive_class} btn btn-grouped js-issuable-close-button js-btn-issue-action issuable-close-button"
- toggle_class = "#{button_responsive_class} btn btn-nr dropdown-toggle js-issuable-close-toggle"
- add_blocked_class = false
- if defined? warn_before_close
  - add_blocked_class = !issuable.closed? && warn_before_close

.float-left.btn-group.gl-ml-3.issuable-close-dropdown.droplab-dropdown.js-issuable-close-dropdown
  %button{ class: "#{button_class} btn-#{button_action} #{(add_blocked_class ? 'btn-issue-blocked' : '')}", data: { testid: 'close-issue-button', qa_selector: 'close_issue_button', endpoint: close_reopen_issuable_path(issuable) } }
    #{display_button_action} #{display_issuable_type}

  = button_tag type: 'button', class: "#{toggle_class} btn-#{button_action}-color",
               data: { 'dropdown-trigger' => '#issuable-close-menu' }, 'aria-label' => _('Toggle dropdown') do
    = icon('caret-down', class: 'toggle-icon icon')

  %ul#issuable-close-menu.js-issuable-close-menu.dropdown-menu{ data: { dropdown: true } }
    %li.close-item{ class: "#{issuable_button_visibility(issuable, true) || 'droplab-item-selected'}",
                    data: { text: _("Close %{display_issuable_type}") % { display_issuable_type: display_issuable_type }, url: close_issuable_path(issuable),
                    button_class: "#{button_class} btn-close", toggle_class: "#{toggle_class} btn-close-color" } }
      %button.btn.btn-transparent
        = sprite_icon('check', css_class: 'icon')
        .description
          %strong.title
            = _('Close')
            = display_issuable_type

    %li.reopen-item{ class: "#{issuable_button_visibility(issuable, false) || 'droplab-item-selected'}",
                     data: { text: _("Reopen %{display_issuable_type}") % { display_issuable_type: display_issuable_type }, url: reopen_issuable_path(issuable),
                     button_class: "#{button_class} btn-reopen", toggle_class: "#{toggle_class} btn-reopen-color" } }
      %button.btn.btn-transparent
        = sprite_icon('check', css_class: 'icon')
        .description
          %strong.title
            = _('Reopen')
            = display_issuable_type

      %li.divider.droplab-item-ignore

      %li.report-item{ data: { text: _('Report abuse'), button_class: "#{button_class} btn-close-color", toggle_class: "#{toggle_class} btn-close-color", method: '' } }
        %a.report-abuse-link{ :href =>  new_abuse_report_path(user_id: issuable.author.id, ref_url: issuable_url(issuable)) }
          .description
            %strong.title= _('Report abuse')
            %p.text
              = _('Report %{display_issuable_type} that are abusive, inappropriate or spam.') % { display_issuable_type: display_issuable_type.pluralize }