- @content_class = "limit-container-width" unless fluid_layout
- add_to_breadcrumbs "Issues", project_issues_path(@project)
- breadcrumb_title @issue.to_reference
- page_title           "#{@issue.title} (#{@issue.to_reference})", "Issues"
- page_description     @issue.description
- page_card_attributes @issue.card_attributes

- can_update_issue = can?(current_user, :update_issue, @issue)
- can_reopen_issue = can?(current_user, :reopen_issue, @issue)
- can_report_spam = @issue.submittable_as_spam_by?(current_user)
- can_create_issue = show_new_issue_link?(@project)

.detail-page-header
  .detail-page-header-body
    .issuable-status-box.status-box.status-box-issue-closed{ class: issue_button_visibility(@issue, false) }
      = sprite_icon('mobile-issue-close', size: 16, css_class: 'd-block d-sm-none')
      %span.d-none.d-sm-block
        Closed
    .issuable-status-box.status-box.status-box-open{ class: issue_button_visibility(@issue, true) }
      = sprite_icon('issue-open-m', size: 16, css_class: 'd-block d-sm-none')
      %span.d-none.d-sm-block Open

    .issuable-meta
      - if @issue.confidential
        .issuable-warning-icon.inline= sprite_icon('eye-slash', size: 16, css_class: 'icon')
      - if @issue.discussion_locked?
        .issuable-warning-icon.inline= sprite_icon('lock', size: 16, css_class: 'icon')
      = issuable_meta(@issue, @project, "Issue")

    %a.btn.btn-default.float-right.d-block.d-sm-none.gutter-toggle.issuable-gutter-toggle.js-sidebar-toggle{ href: "#" }
      = icon('angle-double-left')

  .detail-page-header-actions.js-issuable-actions
    .clearfix.issue-btn-group.dropdown
      %button.btn.btn-default.float-left.d-md-none.d-lg-none.d-xl-none{ type: "button", data: { toggle: "dropdown" } }
        Options
        = icon('caret-down')
      .dropdown-menu.dropdown-menu-right.d-lg-none.d-xl-none
        %ul
          - unless current_user == @issue.author
            %li= link_to 'Report abuse', new_abuse_report_path(user_id: @issue.author.id, ref_url: issue_url(@issue))
          - if can_update_issue
            %li= link_to 'Close issue', issue_path(@issue, issue: { state_event: :close }, format: 'json'), class: "btn-close js-btn-issue-action #{issue_button_visibility(@issue, true)}", title: 'Close issue'
          - if can_reopen_issue
            %li= link_to 'Reopen issue', issue_path(@issue, issue: { state_event: :reopen }, format: 'json'), class: "btn-reopen js-btn-issue-action #{issue_button_visibility(@issue, false)}", title: 'Reopen issue'
          - if can_report_spam
            %li= link_to 'Submit as spam', mark_as_spam_project_issue_path(@project, @issue), method: :post, class: 'btn-spam', title: 'Submit as spam'
          - if can_create_issue
            - if can_update_issue || can_report_spam
              %li.divider
            %li= link_to 'New issue', new_project_issue_path(@project), title: 'New issue', id: 'new_issue_link'

    = render 'shared/issuable/close_reopen_button', issuable: @issue, can_update: can_update_issue, can_reopen: can_reopen_issue

    - if can_report_spam
      = link_to 'Submit as spam', mark_as_spam_project_issue_path(@project, @issue), method: :post, class: 'd-none d-sm-none d-md-block btn btn-grouped btn-spam', title: 'Submit as spam'
    - if can_create_issue
      = link_to new_project_issue_path(@project), class: 'd-none d-sm-none d-md-block btn btn-grouped btn-success btn-inverted', title: 'New issue', id: 'new_issue_link' do
        New issue

.issue-details.issuable-details
  .detail-page-description.content-block
    -# haml-lint:disable InlineJavaScript
    %script#js-issuable-app-initial-data{ type: "application/json" }= issuable_initial_data(@issue).to_json
    #js-issuable-app
      %h2.title= markdown_field(@issue, :title)
      - if @issue.description.present?
        .description{ class: can?(current_user, :update_issue, @issue) ? 'js-task-list-container' : '' }
          .wiki= markdown_field(@issue, :description)
          %textarea.hidden.js-task-list-field= @issue.description

      = edited_time_ago_with_tooltip(@issue, placement: 'bottom', html_class: 'issue-edited-ago js-issue-edited-ago')

    #merge-requests{ data: { url: referenced_merge_requests_project_issue_path(@project, @issue) } }
      // This element is filled in using JavaScript.

    #related-branches{ data: { url: related_branches_project_issue_path(@project, @issue) } }
      // This element is filled in using JavaScript.

  .content-block.emoji-block.emoji-block-sticky
    .row
      .col-md-12.col-lg-6.js-noteable-awards
        = render 'award_emoji/awards_block', awardable: @issue, inline: true
      .col-md-12.col-lg-6.new-branch-col
        #js-vue-discussion-filter{ data: { default_filter: current_user&.notes_filter_for(@issue), notes_filters: UserPreference.notes_filters.to_json } }
        = render 'new_branch' unless @issue.confidential?

  %section.issuable-discussion
    = render 'projects/issues/discussion'

= render 'shared/issuable/sidebar', issuable_sidebar: @issuable_sidebar, assignees: @issue.assignees