- return unless note.author
- return unless note.readable_by?(current_user)

- show_image_comment_badge = local_assigns.fetch(:show_image_comment_badge, false)
- note_editable = can?(current_user, :admin_note, note)
- note_counter = local_assigns.fetch(:note_counter, 0)

%li.timeline-entry.note-wrapper{ id: dom_id(note),
  class: ["note", "note-comment", "note-row-#{note.id}", ('system-note' if note.system)],
  data: { author_id: note.author.id,
    editable: note_editable,
    note_id: note.id } }
  .timeline-entry-inner
    - if note.system
      .timeline-icon
        = icon_for_system_note(note)
    - else
      .timeline-avatar.gl-float-left
        %a.image-diff-avatar-link{ href: user_path(note.author) }
          = render Pajamas::AvatarComponent.new(note.author, size: 32, alt: '')
          - if note.is_a?(DiffNote) && note.on_image?
            - if show_image_comment_badge && note_counter == 0
              -# Only show this for the first comment in the discussion
              %span.image-comment-badge
                = sprite_icon('image-comment-dark')
            - elsif note_counter == 0
              - counter = badge_counter if local_assigns[:badge_counter]
              - badge_class = "hidden" if @fresh_discussion || counter.nil?
              %span.gl-display-flex.gl-align-items-center.gl-justify-content-center.gl-font-sm.design-note-pin.small.user-avatar{ class: badge_class }
                = counter
    .timeline-content
      .note-header
        .note-header-info
          %a{ href: user_path(note.author) }
            %span.note-header-author-name.bold
              = note.author.name
            = user_status(note.author)
            %spannote-headline-light{ data: { qa_selector: 'note_author_content' } }
              = note.author.to_reference
          %span.note-headline-ligh.note-headline-meta
            - if note.system
              %span.system-note-message
                = markdown_field(note, :note)
            - if note.created_at
              %span.system-note-separator
                ·
              %a.system-note-separator{ href: "##{dom_id(note)}" }= time_ago_with_tooltip(note.created_at, placement: 'bottom', html_class: 'note-created-ago')
        - unless note.system?
          .note-actions
            - if note.for_personal_snippet?
              = render 'snippets/notes/actions', note: note, note_editable: note_editable
            - else
              = render 'projects/notes/actions', note: note, note_editable: note_editable
      .note-body{ class: note_editable ? 'js-task-list-container' : '' }
        .note-text.md{ data: { qa_selector: 'note_content' } }
          = markdown_field(note, :note)
        = edited_time_ago_with_tooltip(note, placement: 'bottom', html_class: 'note_edited_ago')
        .original-note-content.hidden{ data: { post_url: note_url(note), target_id: note.noteable.id, target_type: note.noteable.class.name.underscore } }
          #{note.note}
        - if note_editable
          = render 'shared/notes/edit', note: note
        .note-awards
          = render 'award_emoji/awards_block', awardable: note, inline: false
        - if note.system
          .system-note-commit-list-toggler.hide
            = _("Toggle commit list")
            = sprite_icon('chevron-down', css_class: 'js-chevron-down gl-ml-1 gl-vertical-align-text-bottom')
            = sprite_icon('chevron-up', css_class: 'js-chevron-up gl-ml-1 gl-vertical-align-text-bottom gl-display-none')
      - if note.attachment.url
        .note-attachment
          - if note.attachment.image?
            = link_to note.attachment.url, target: '_blank' do
              = image_tag note.attachment.url, class: 'note-image-attach col-lg-4'
          .attachment
            = link_to note.attachment.url, target: '_blank' do
              = sprite_icon('paperclip')
              = note.attachment_identifier
              = link_to delete_attachment_project_note_path(note.project, note),
                title: _('Delete this attachment'), method: :delete, remote: true, data: { confirm: _('Are you sure you want to remove the attachment?') }, class: 'danger js-note-attachment-delete' do
                = sprite_icon('remove', css_class: 'cred')