Added collapsed hidden comments to author's article view

akashdotsrivastava · Jul 2, 2021 · 9373934 · 9373934
1 parent 83dc940
commit 9373934
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 23 deletions.
diff --git a/app/assets/javascripts/initializers/initializeCommentsPage.js.erb b/app/assets/javascripts/initializers/initializeCommentsPage.js.erb
@@ -183,6 +183,7 @@ function initializeCommentsPage() {
     }
   }
   listenForDetailsToggle();
+  hideCommentsHiddenByCommentableUser();
 }
 
 function toggleCodeOfConduct() {
@@ -535,28 +536,41 @@ function handleImageUpload(event, randomIdNumber) {
   }
 }
 
+function toggleItemSummaryHtml(item) {
+  var itemSummaryContent = item.getElementsByClassName("js-collapse-comment-content")[0];
+  var usernames = item.getElementsByClassName("js-comment-username");
+  var number = "";
+  if (usernames.length > 1) {
+    number = " + " + (usernames.length - 1) + " replies"
+  }
+  var itemUsername = usernames[0].textContent + number
+  if (item.open) {
+    itemSummaryContent.innerHTML = "";
+  } else {
+    itemSummaryContent.innerHTML = itemUsername;
+  }
+  item.getElementsByTagName("SUMMARY")[0].blur();
+}
+
 function listenForDetailsToggle() {
   var detailItems = document.querySelectorAll(".js-comment-wrapper");
   for (var i = 0; i < detailItems.length; i++) {
     detailItems[i].addEventListener("toggle", event => {
       var item = event.target;
-      var itemSummaryContent = item.getElementsByClassName("js-collapse-comment-content")[0];
-      var usernames = item.getElementsByClassName("js-comment-username");
-      var number = "";
-      if (usernames.length > 1) {
-        number = " + " + (usernames.length - 1) + " replies"
-      }
-      var itemUsername = usernames[0].textContent + number
-      if (item.open) {
-        itemSummaryContent.innerHTML = "";
-      } else {
-        itemSummaryContent.innerHTML = itemUsername;
-      }
-      item.getElementsByTagName("SUMMARY")[0].blur();
+      toggleItemSummaryHtml(item);
     });
   }
 }
 
+function hideCommentsHiddenByCommentableUser() {
+  var hiddenCommentDetailItems = document.querySelectorAll(".js-comment-wrapper.hidden-by-commentable-user");
+  for (var i = 0; i < hiddenCommentDetailItems.length; i++) {
+    var item = hiddenCommentDetailItems[i];
+    item.open = false;
+    toggleItemSummaryHtml(item);
+  }
+}
+
 /**
  * Increment comment, stored in `.js-comments-count`, count by one.
  */

diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb
@@ -1,5 +1,6 @@
 class CommentsController < ApplicationController
   before_action :set_comment, only: %i[update destroy]
+  before_action :set_current_user, only: %i[index]
   before_action :set_cache_control_headers, only: [:index]
   before_action :authenticate_user!, only: %i[preview create hide unhide]
   after_action :verify_authorized
@@ -292,4 +293,8 @@ def rate_limit_to_use
       :comment_creation
     end
   end
+
+  def set_current_user
+    @current_user = current_user
+  end
 end
diff --git a/app/helpers/comments_helper.rb b/app/helpers/comments_helper.rb
@@ -26,11 +26,20 @@ def get_ama_or_op_banner(commentable)
     commentable.decorate.cached_tag_list_array.include?("ama") ? "Ask Me Anything" : "Author"
   end
 
-  def tree_for(comment, sub_comments, commentable)
-    nested_comments(tree: { comment => sub_comments }, commentable: commentable, is_view_root: true)
+  def tree_for(comment, sub_comments, commentable, current_user)
+    nested_comments(tree: { comment => sub_comments },
+                    commentable: commentable,
+                    is_view_root: true,
+                    current_user: current_user)
   end
 
-  def should_be_hidden?(comment, root_comment)
+  def should_be_hidden?(comment, root_comment, current_user)
+    commentable = comment.commentable
+    has_commentable_of_current_user = [commentable.user_id, commentable.co_author_ids].flatten.any?(current_user.id)
+    should_be_collapsed?(comment, root_comment) && !has_commentable_of_current_user
+  end
+
+  def should_be_collapsed?(comment, root_comment)
     comment.hidden_by_commentable_user && comment != root_comment
   end
 
@@ -63,11 +72,14 @@ def like_button_text(comment)
 
   private
 
-  def nested_comments(tree:, commentable:, is_view_root: false)
+  def nested_comments(tree:, commentable:, current_user:, is_view_root: false)
     comments = tree.map do |comment, sub_comments|
       render("comments/comment", comment: comment, commentable: commentable,
                                  is_view_root: is_view_root, is_childless: sub_comments.empty?,
-                                 subtree_html: nested_comments(tree: sub_comments, commentable: commentable))
+                                 subtree_html: nested_comments(tree: sub_comments,
+                                                               commentable: commentable,
+                                                               current_user: current_user),
+                                 current_user: current_user)
     end
 
     safe_join(comments)

diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb
@@ -1,6 +1,6 @@
-<% if comment && comment.user && !should_be_hidden?(comment, @root_comment) %>
+<% if comment && comment.user && !should_be_hidden?(comment, @root_comment, current_user) %>
   <% if comment.depth < 3 %>
-    <details class="comment-wrapper js-comment-wrapper comment-wrapper--deep-<%= comment.depth %> <%= comment_class(comment, is_view_root: is_view_root) %>" open>
+    <details class="comment-wrapper js-comment-wrapper comment-wrapper--deep-<%= comment.depth %> <%= comment_class(comment, is_view_root: is_view_root) %> <%= should_be_collapsed?(comment, @root_comment) ? "hidden-by-commentable-user" : "" %>" open>
       <summary>
         <span class="<% if comment.depth > 0 %>mx-0<% else %>m:mx-1<% end %> inline-block align-middle">
           <%= inline_svg_tag("collapse.svg", aria: true, class: "crayons-icon expanded", title: "Collapse") %>

diff --git a/app/views/comments/index.html.erb b/app/views/comments/index.html.erb
@@ -121,16 +121,15 @@
                  commentable: @commentable,
                  commentable_type: "Article" %>
     <% end %>
-
     <div class="comments" id="comment-trees-container">
       <% if @root_comment.present? %>
         <% cache ["comment_root-view-root_#{user_signed_in?}", @root_comment] do %>
-          <%= tree_for(@root_comment, @root_comment.subtree.includes(:user).arrange[@root_comment], @commentable) %>
+          <%= tree_for(@root_comment, @root_comment.subtree.includes(:user).arrange[@root_comment], @commentable, @current_user) %>
         <% end %>
       <% else %>
         <% Comment.tree_for(@commentable).each do |comment, sub_comments| %>
           <% cache ["comment_root_#{user_signed_in?}", comment] do %>
-            <%= tree_for(comment, sub_comments, @commentable) %>
+            <%= tree_for(comment, sub_comments, @commentable, @current_user) %>
           <% end %>
         <% end %>
       <% end %>