Merge branch 'discussion-notes' into 'master'

Discussion notes update

- At the moment discussion notes are rendered in a list but arent actually a list item and that can cause overflow issues
- Moved the dates to be in the header like other notes
- Fixed overlapping issue on mobile

See merge request !3720

4 files changed, 6 insertions, 17 deletions

diff --git a/app/views/projects/notes/_discussion.html.haml b/app/views/projects/notes/_discussion.html.haml
index b8068835b3a..572b00a38c7 100644
--- a/app/views/projects/notes/_discussion.html.haml
+++ b/app/views/projects/notes/_discussion.html.haml
@@ -1,5 +1,5 @@
 - note = discussion_notes.first
-.timeline-entry
+%li.note.note-discussion.timeline-entry
   .timeline-entry-inner
     .timeline-icon
       = link_to user_path(note.author) do
diff --git a/app/views/projects/notes/discussions/_active.html.haml b/app/views/projects/notes/discussions/_active.html.haml
index cd8a5f0bd02..0ea8862a684 100644
--- a/app/views/projects/notes/discussions/_active.html.haml
+++ b/app/views/projects/notes/discussions/_active.html.haml
@@ -6,15 +6,11 @@
       = "#{note.author.to_reference} started a discussion"
       = link_to diffs_namespace_project_merge_request_path(note.project.namespace, note.project, note.noteable, anchor: note.line_code) do
         on the diff
+      = time_ago_with_tooltip(note.created_at, placement: "bottom", html_class: "discussion_updated_ago")
     .discussion-actions
       = link_to "#", class: "discussion-action-button discussion-toggle-button js-toggle-button" do
         %i.fa.fa-chevron-up
         Show/hide discussion
-    .last-update.hide.js-toggle-content
-      - last_note = discussion_notes.last
-      last updated by
-      = link_to_member(@project, last_note.author, avatar: false)
-      #{time_ago_with_tooltip(last_note.updated_at, placement: 'bottom', html_class: 'discussion_updated_ago')}
 
   .discussion-body.js-toggle-content
     = render "projects/notes/discussions/diff", discussion_notes: discussion_notes, note: note
diff --git a/app/views/projects/notes/discussions/_commit.html.haml b/app/views/projects/notes/discussions/_commit.html.haml
index 46f2ba4bbcf..2a2ead58eeb 100644
--- a/app/views/projects/notes/discussions/_commit.html.haml
+++ b/app/views/projects/notes/discussions/_commit.html.haml
@@ -8,21 +8,18 @@
       = "#{note.author.to_reference} started a discussion on #{commit_description}"
       - if commit
         = link_to(commit.short_id, namespace_project_commit_path(note.project.namespace, note.project, note.noteable), class: 'monospace')
+      = time_ago_with_tooltip(note.created_at, placement: "bottom", html_class: "discussion_updated_ago")
     .discussion-actions
       = link_to "#", class: "note-action-button discussion-toggle-button js-toggle-button" do
         %i.fa.fa-chevron-up
         Show/hide discussion
-    .last-update.hide.js-toggle-content
-      - last_note = discussion_notes.last
-      last updated by
-      = link_to_member(@project, last_note.author, avatar: false)
-      #{time_ago_with_tooltip(last_note.updated_at, placement: 'bottom', html_class: 'discussion_updated_ago')}
   .discussion-body.js-toggle-content
     - if note.for_diff_line?
       = render "projects/notes/discussions/diff", discussion_notes: discussion_notes, note: note
     - else
       .panel.panel-default
         .notes{ data: { discussion_id: discussion_notes.first.discussion_id } }
-          = render discussion_notes
+          %ul.notes.timeline
+            = render discussion_notes
         .discussion-reply-holder
           = link_to_reply_diff(discussion_notes.first)
diff --git a/app/views/projects/notes/discussions/_outdated.html.haml b/app/views/projects/notes/discussions/_outdated.html.haml
index f8e000b424f..45141bcd1df 100644
--- a/app/views/projects/notes/discussions/_outdated.html.haml
+++ b/app/views/projects/notes/discussions/_outdated.html.haml
@@ -5,14 +5,10 @@
     .inline.discussion-headline-light
       = "#{note.author.to_reference} started a discussion"
       on the outdated diff
+      = time_ago_with_tooltip(note.created_at, placement: "bottom", html_class: "discussion_updated_ago")
     .discussion-actions
       = link_to "#", class: "note-action-button discussion-toggle-button js-toggle-button" do
         %i.fa.fa-chevron-down
         Show/hide discussion
-    .last-update.hide.js-toggle-content
-      - last_note = discussion_notes.last
-      last updated by
-      = link_to_member(@project, last_note.author, avatar: false)
-      #{time_ago_with_tooltip(last_note.updated_at, placement: 'bottom', html_class: 'discussion_updated_ago')}
   .discussion-body.js-toggle-content.hide
     = render "projects/notes/discussions/diff", discussion_notes: discussion_notes, note: note