Render add-diff-note button with server.

This commit moves the rendering of the button back to the server, and
shows/hides it using opacity rather than display. It also removes the
transform applied to the button on hover (scale). Previously, both of these
factors automatically triggered a reflow, which creates a performance
bottleneck on pages with larger DOM size.

MR: !12103

1 files changed, 12 insertions, 0 deletions

diff --git a/app/helpers/notes_helper.rb b/app/helpers/notes_helper.rb
index 64ad7b280cb..ecc6cd6c6c5 100644
--- a/app/helpers/notes_helper.rb
+++ b/app/helpers/notes_helper.rb
@@ -47,6 +47,18 @@ module NotesHelper
     data
   end
 
+  def add_diff_note_button(line_code, position, line_type)
+    return if @diff_notes_disabled
+
+    button_tag '',
+      class: 'add-diff-note js-add-diff-note-button',
+      type: 'submit', name: 'button',
+      data: diff_view_line_data(line_code, position, line_type),
+      title: 'Add a comment to this line' do
+      icon('comment-o')
+    end
+  end
+
   def link_to_reply_discussion(discussion, line_type = nil)
     return unless current_user