.block.labels
  .title.gl-h-5.gl-display-flex.gl-align-items-center
    = _("Labels")
    - if can_admin_issue?
      = loading_icon(css_class: 'gl-ml-2 block-loading')
      = link_to _("Edit"), "#", class: "js-sidebar-dropdown-toggle edit-link gl-ml-auto"
  .value.issuable-show-labels.dont-hide
    %span.no-value{ "v-if" => "issue.labels && issue.labels.length === 0" }
      = _("None")
    %span{ "v-for" => "label in issue.labels" }
      %gl-label{ ":key" => "label.id",
        ":background-color" => "label.color",
        ":title" => "label.title",
        ":description" => "label.description",
        ":scoped" => "showScopedLabels(label)" }

  - if can_admin_issue?
    .selectbox
      %input{ type: "hidden",
        name: "issue[label_names][]",
        "v-for" => "label in issue.labels",
        ":value" => "label.id" }
      .dropdown
        %button.dropdown-menu-toggle.js-label-select.js-multiselect.js-issue-board-sidebar{ type: "button",
          ":data-selected" => "selectedLabels",
          ":data-labels" => "issue.assignableLabelsEndpoint",
          data: label_dropdown_data(@project, namespace_path: @namespace_path, field_name: "issue[label_names][]") }
          %span.dropdown-toggle-text
            {{ labelDropdownTitle }}
          = sprite_icon('chevron-down', css_class: "dropdown-menu-toggle-icon gl-top-3")
        .dropdown-menu.dropdown-select.dropdown-menu-paging.dropdown-menu-labels.dropdown-menu-selectable.dropdown-extended-height
          = render partial: "shared/issuable/label_page_default"
          - if can?(current_user, :admin_label, current_board_parent)
            = render partial: "shared/issuable/label_page_create", locals: { show_add_list: true }