%li{ id: dom_id(merge_request), class: mr_css_classes(merge_request), data: { labels: merge_request.label_ids, id: merge_request.id } }
  - if @can_bulk_update
    .issue-check.gl-mr-3.hidden
      = render Pajamas::CheckboxTagComponent.new(name: dom_id(merge_request, "selected"),
        value: nil,
        checkbox_options: { 'data-id' => merge_request.id }) do |c|
        - c.with_label do
          %span.gl-sr-only
            = merge_request.title

  .issuable-info-container
    .issuable-main-info
      .merge-request-title.title
        %span.merge-request-title-text.js-onboarding-mr-item
          = hidden_merge_request_icon(merge_request)
          = link_to merge_request.title, merge_request_path(merge_request), class: 'js-prefetch-document'
        - if merge_request.tasks?
          %span.task-status.d-none.d-sm-inline-block.gl-font-sm
             
            = merge_request.task_status

      .issuable-info
        %span.issuable-reference
          #{issuable_reference(merge_request)}
        %span.issuable-authored.d-none.d-sm-inline-block.gl-text-gray-500!
          ·
          #{s_('IssueList|created %{timeAgoString} by %{user}').html_safe % { timeAgoString: time_ago_with_tooltip(merge_request.created_at, placement: 'bottom'), user: link_to_member(@project, merge_request.author, avatar: false, extra_class: 'gl-text-gray-500!') }}
        - if merge_request.milestone
          %span.issuable-milestone.d-none.d-sm-inline-block.gl-text-truncate.gl-max-w-26.gl-vertical-align-bottom
             
            = link_to project_merge_requests_path(merge_request.project, milestone_title: merge_request.milestone.title), class: 'gl-text-gray-500!', data: { html: 'true', toggle: 'tooltip', title: milestone_tooltip_due_date(merge_request.milestone) } do
              = sprite_icon('clock', size: 12, css_class: 'gl-vertical-align-text-bottom')
              = merge_request.milestone.title
        - if merge_request.target_project.default_branch != merge_request.target_branch
          %span.project-ref-path.has-tooltip.d-inline-block.gl-text-truncate.gl-max-w-26.gl-vertical-align-bottom{ title: _('Target branch: %{target_branch}') % {target_branch: merge_request.target_branch} }
             
            = link_to project_ref_path(merge_request.project, merge_request.target_branch), class: 'ref-name gl-text-gray-500!' do
              = sprite_icon('branch', size: 12, css_class: 'fork-sprite')
              = merge_request.target_branch
        - if merge_request.labels.any?
          .gl-mt-1{ role: 'group', 'aria-label': _('Labels') }
            - presented_labels_sorted_by_title(merge_request.labels, merge_request.project).each do |label|
              = link_to_label(label, type: :merge_request, small: true)

    .issuable-meta
      %ul.controls.d-flex.align-items-end
        - if merge_request.merged?
          - merged_at = merge_request.merged_at ? l(merge_request.merged_at.to_time) : _("Merge date & time could not be determined")
          %li.d-none.d-sm-flex
            %a.has-tooltip{ href: "#{merge_request_path(merge_request)}#widget-state", title: merged_at }
              = render Pajamas::BadgeComponent.new(_('Merged'), size: 'sm', variant: 'info')
        - elsif merge_request.closed?
          %li.d-none.d-sm-flex
            = render Pajamas::BadgeComponent.new(_('Closed'), size: 'sm', variant: 'danger')
        = render 'shared/merge_request_pipeline_status', merge_request: merge_request
        - if merge_request.open? && merge_request.broken?
          %li.issuable-pipeline-broken.d-none.d-sm-flex
            = link_to merge_request_path(merge_request), class: "has-tooltip", title: _('Cannot be merged automatically') do
              = sprite_icon('warning-solid')
        - if merge_request.assignees.any?
          %li.gl-display-flex.gl-align-items-center
            = render 'shared/issuable/assignees', project: merge_request.project, issuable: merge_request
        - if merge_request.reviewers.any?
          %li.gl-display-flex.issuable-reviewers
            = render 'shared/issuable/reviewers', project: merge_request.project, issuable: merge_request
        = render 'projects/merge_requests/approvals_count', merge_request: merge_request

        = render 'shared/issuable_meta_data', issuable: merge_request

      - if merge_request.updated_at != merge_request.created_at
        .float-right.issuable-updated-at.d-none.d-sm-inline-block.gl-text-gray-500
          %span
            = _('updated %{time_ago}').html_safe % { time_ago: time_ago_with_tooltip(merge_request.updated_at, placement: 'bottom', html_class: 'merge_request_updated_ago') }