From bdf56ea2a1dbf7585a7e4ebff8417323d3c0652d Mon Sep 17 00:00:00 2001
From: ajugo <andrej.jugovic7@gmail.com>
Date: Thu, 27 Oct 2022 14:41:35 +0200
Subject: [PATCH] Add comments to the experiment table view [SCI-7217] (#4583)

---
 app/assets/javascripts/experiments/table.js   |  8 +++++--
 .../javascripts/sitewide/comments_sidebar.js  |  5 +++--
 app/assets/stylesheets/experiment/table.scss  | 21 +++++++++++++++++++
 app/helpers/comment_helper.rb                 |  4 ++++
 .../experiments/table_view_service.rb         |  7 ++++++-
 5 files changed, 40 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/experiments/table.js b/app/assets/javascripts/experiments/table.js
index 426f57b8f..a34aa77e9 100644
--- a/app/assets/javascripts/experiments/table.js
+++ b/app/assets/javascripts/experiments/table.js
@@ -93,8 +93,12 @@ ExperimnetTable.render.tags = function(data) {
 };
 
 ExperimnetTable.render.comments = function(data) {
-  const value = parseInt(data, 10) === 0 ? '+' : data;
-  return `<a href="">${value}</a>`;
+  return `<a href="#" 
+    class="open-comments-sidebar" id="comment-count-${data.id}" 
+    data-object-type="MyModule" data-object-id="${data.id}">
+      ${data.count > 0 ? data.count : '+'}
+      ${data.count_unseen > 0 ? `<span class="unseen-comments"> ${data.count_unseen} </span>` : ''}
+  </a>`;
 };
 
 ExperimnetTable.init();
diff --git a/app/assets/javascripts/sitewide/comments_sidebar.js b/app/assets/javascripts/sitewide/comments_sidebar.js
index 3f6b5e3f4..538c466e4 100644
--- a/app/assets/javascripts/sitewide/comments_sidebar.js
+++ b/app/assets/javascripts/sitewide/comments_sidebar.js
@@ -28,7 +28,7 @@ var CommentsSidebar = (function() {
     var commentsAmount = $(SIDEBAR).find('.comments-list .comment-container').length;
     if (commentsCounter.length) {
       // Replace the number in comment element
-      commentsCounter.text(commentsCounter.text().replace(/\d+/g, commentsAmount));
+      commentsCounter.text(commentsCounter.text().replace(/[\d\\+]+/g, commentsAmount));
     }
   }
 
@@ -37,6 +37,7 @@ var CommentsSidebar = (function() {
       commentsCounter = $(`#comment-count-${$(this).data('objectId')}`);
       closeCallback = $(this).data('closeCallback');
       CommentsSidebar.open($(this).data('objectType'), $(this).data('objectId'));
+      $(this).parent().find('.unseen-comments').remove();
       e.preventDefault();
     });
   }
@@ -152,7 +153,7 @@ var CommentsSidebar = (function() {
     open: function(objectType, objectId) {
       $(SIDEBAR).find('.comments-subject-title').empty();
       $(SIDEBAR).find('.comments-list').empty();
-      $(SIDEBAR).find('.comment-input-field').val('');
+      $(SIDEBAR).find('.comment-input-field').val('').focus();
       $('.error-container').empty();
       $(SIDEBAR).find('.sidebar-footer').removeClass('update');
       $(SIDEBAR).data('object-type', objectType).data('object-id', objectId);
diff --git a/app/assets/stylesheets/experiment/table.scss b/app/assets/stylesheets/experiment/table.scss
index 1302ef708..098c7ab20 100644
--- a/app/assets/stylesheets/experiment/table.scss
+++ b/app/assets/stylesheets/experiment/table.scss
@@ -115,4 +115,25 @@
     }
 
   }
+
+  .unseen-comments {
+    @include font-small;
+    align-items: center;
+    background-color: $brand-complementary;
+    border: 2px solid $color-white;
+    border-radius: 50%;
+    color: $color-black;
+    display: flex;
+    font-weight: bold;
+    height: 16px;
+    justify-content: center;
+    margin-bottom: 10px;
+    margin-left: -1px;
+    min-width: 16px;
+  }
+
+  .open-comments-sidebar {
+    display: contents;
+    margin-bottom: 0;
+  }
 }
diff --git a/app/helpers/comment_helper.rb b/app/helpers/comment_helper.rb
index 346747dae..0b23c8417 100644
--- a/app/helpers/comment_helper.rb
+++ b/app/helpers/comment_helper.rb
@@ -278,4 +278,8 @@ module CommentHelper
   def has_unseen_comments?(commentable)
     commentable.comments.any? { |comment| comment.unseen_by.include?(current_user.id) }
   end
+
+  def count_unseen_comments(commentable, current_user)
+    commentable.comments.count { |comment| comment.unseen_by.include?(current_user.id) }
+  end
 end
diff --git a/app/services/experiments/table_view_service.rb b/app/services/experiments/table_view_service.rb
index e2f4d77fd..7f832c1b1 100644
--- a/app/services/experiments/table_view_service.rb
+++ b/app/services/experiments/table_view_service.rb
@@ -4,6 +4,7 @@ module Experiments
   class TableViewService
     include Rails.application.routes.url_helpers
     include ActionView::Helpers::DateHelper
+    include CommentHelper
     include ProjectsHelper
     include InputSanitizeHelper
     include Canaid::Helpers::PermissionsHelper
@@ -117,7 +118,11 @@ module Experiments
     end
 
     def comments_presenter(my_module)
-      my_module.task_comments.length
+      {
+        id: my_module.id,
+        count: my_module.comments.count,
+        count_unseen: count_unseen_comments(my_module, @user)
+      }
     end
   end
 end