From 5bc542e83438a7a8b0743d18da02c2be88bd0ee0 Mon Sep 17 00:00:00 2001
From: wandji <wbertrand10@gmail.com>
Date: Tue, 30 Jan 2024 14:35:44 +0100
Subject: [PATCH] Fix displayed comment counter for first comment in protocol
 steps and results [SCI-9573] (#7013)

---
 app/assets/javascripts/sitewide/comments_sidebar.js | 1 +
 app/javascript/vue/protocol/step.vue                | 2 +-
 app/javascript/vue/results/result.vue               | 2 +-
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/sitewide/comments_sidebar.js b/app/assets/javascripts/sitewide/comments_sidebar.js
index d6a35193a..c53344523 100644
--- a/app/assets/javascripts/sitewide/comments_sidebar.js
+++ b/app/assets/javascripts/sitewide/comments_sidebar.js
@@ -31,6 +31,7 @@ var CommentsSidebar = (function() {
       // Replace the number in comment element
       commentsCounter.text(commentsCounter.text().replace(/[\d\\+]+/g, commentsAmount));
       commentsCounter.removeClass('hidden');
+      commentsCounter.css('display', 'flex');
     }
   }
 
diff --git a/app/javascript/vue/protocol/step.vue b/app/javascript/vue/protocol/step.vue
index fe788a58f..4eabd6bcc 100644
--- a/app/javascript/vue/protocol/step.vue
+++ b/app/javascript/vue/protocol/step.vue
@@ -86,7 +86,7 @@
            @click="openCommentsSidebar"
            :data-object-id="step.id">
           <i class="sn-icon sn-icon-comments"></i>
-          <span class="comments-counter" v-if="step.attributes.comments_count"
+          <span class="comments-counter" v-show="step.attributes.comments_count"
                 :id="`comment-count-${step.id}`"
                 :class="{'unseen': step.attributes.unseen_comments}"
           >
diff --git a/app/javascript/vue/results/result.vue b/app/javascript/vue/results/result.vue
index 6e2e203d9..54daa5e43 100644
--- a/app/javascript/vue/results/result.vue
+++ b/app/javascript/vue/results/result.vue
@@ -71,7 +71,7 @@
             data-object-type="Result"
             :data-object-id="result.id">
             <i class="sn-icon sn-icon-comments"></i>
-            <span class="comments-counter" v-if="result.attributes.comments_count"
+            <span class="comments-counter" v-show="result.attributes.comments_count"
                   :id="`comment-count-${result.id}`">
                 {{ result.attributes.comments_count }}
             </span>