From b6d9577b489ba243416f0ffa45f373ef15b5b406 Mon Sep 17 00:00:00 2001
From: Aman Agrawal <amanagr@zulip.com>
Date: Fri, 9 Apr 2021 14:40:09 +0000
Subject: [PATCH] stream_list: Use `unread_counts` class for showing unread
 count.

---
 static/js/stream_list.js                | 10 +++-------
 static/styles/left_sidebar.css          |  4 +---
 static/templates/stream_sidebar_row.hbs |  2 +-
 3 files changed, 5 insertions(+), 11 deletions(-)

diff --git a/static/js/stream_list.js b/static/js/stream_list.js
index b420c1401f..58d08687ad 100644
--- a/static/js/stream_list.js
+++ b/static/js/stream_list.js
@@ -20,6 +20,7 @@ import * as stream_sort from "./stream_sort";
 import * as topic_list from "./topic_list";
 import * as topic_zoom from "./topic_zoom";
 import * as ui from "./ui";
+import * as ui_util from "./ui_util";
 import * as unread from "./unread";
 
 export let stream_cursor;
@@ -27,24 +28,19 @@ export let stream_cursor;
 let has_scrolled = false;
 
 export function update_count_in_dom(unread_count_elem, count) {
-    const count_span = unread_count_elem.find(".count");
-    const value_span = count_span.find(".value");
+    ui_util.update_unread_count_in_dom(unread_count_elem, count);
 
+    const count_span = unread_count_elem.find(".unread_count");
     if (count === 0) {
-        count_span.hide();
         if (count_span.parent().hasClass("subscription_block")) {
             count_span.parent(".subscription_block").removeClass("stream-with-count");
         }
-        value_span.text("");
         return;
     }
 
-    count_span.show();
-
     if (count_span.parent().hasClass("subscription_block")) {
         count_span.parent(".subscription_block").addClass("stream-with-count");
     }
-    value_span.text(count);
 }
 
 class StreamSidebar {
diff --git a/static/styles/left_sidebar.css b/static/styles/left_sidebar.css
index 440e079710..18325d67c6 100644
--- a/static/styles/left_sidebar.css
+++ b/static/styles/left_sidebar.css
@@ -100,7 +100,7 @@ li.show-more-topics {
         }
     }
 
-    .count {
+    .subscription_block .unread_count {
         margin-right: 15px;
     }
 
@@ -289,7 +289,6 @@ li.top_left_recent_topics {
     font-size: 13px;
 }
 
-#stream_filters .count,
 .topic-unread-count,
 .private_message_count {
     float: right;
@@ -313,7 +312,6 @@ li.top_left_recent_topics {
 }
 
 /* These are true "unread" counts. */
-#stream_filters .count,
 .topic-unread-count,
 .private_message_count {
     background-color: hsl(105, 2%, 50%);
diff --git a/static/templates/stream_sidebar_row.hbs b/static/templates/stream_sidebar_row.hbs
index 687dfc9c9b..eec5b2a597 100644
--- a/static/templates/stream_sidebar_row.hbs
+++ b/static/templates/stream_sidebar_row.hbs
@@ -10,7 +10,7 @@
 
             <a href="{{uri}}" title="{{name}}" class="stream-name">{{name}}</a>
 
-            <div class="count"><div class="value"></div></div>
+            <span class="unread_count"></span>
         </div>
         <span class="stream-sidebar-menu-icon"><i class="zulip-icon ellipsis-v-solid" aria-hidden="true"></i></span>
     </div>