From c81051d6a40ea7c2b7b87326faa3dddb54648304 Mon Sep 17 00:00:00 2001
From: Jean Brito <jeanfbrito@gmail.com>
Date: Fri, 26 Jun 2026 09:31:47 -0300
Subject: [PATCH] fix: stop server sidebar tile rendering a literal "0" badge
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The per-server sidebar tile rendered a literal "0" overlay whenever a
server's unread badge was the number 0.

PR #3369 (restore unread badge on 7.8.0+ servers) made injected.ts emit
setBadge(0) explicitly via `setBadge(alertIndicator ?? 0)`, so servers
now carry `badge: 0` where they previously carried `undefined`.
SideBar/index.tsx maps that to `mentionCount={0}`, and ServerButton
guarded the Badge with `{mentionCount && <Badge>...}`. Because
`0 && <Badge>` evaluates to `0`, React renders the number as a text
node — the stray "0" on the tile.

Coerce the guard to a boolean (`!!mentionCount`) so a zero count renders
nothing. Add a regression test asserting mentionCount={0} produces no
"0" text.

The aggregate badge sinks (selectGlobalBadge, tray title, dock) already
collapse an all-zero state to undefined, so only the per-server tile was
affected and they are left unchanged.
---
 src/ui/components/SideBar/ServerButton.spec.tsx | 6 ++++++
 src/ui/components/SideBar/ServerButton.tsx      | 4 +++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/ui/components/SideBar/ServerButton.spec.tsx b/src/ui/components/SideBar/ServerButton.spec.tsx
index 64eeb26a6b..3bab6966df 100644
--- a/src/ui/components/SideBar/ServerButton.spec.tsx
+++ b/src/ui/components/SideBar/ServerButton.spec.tsx
@@ -99,6 +99,12 @@ describe('ServerButton', () => {
     expect(screen.getByText('3')).toBeInTheDocument();
   });
 
+  it('does not render a literal "0" badge when the mention count is zero', () => {
+    renderButton({ mentionCount: 0, hasUnreadMessages: true });
+
+    expect(screen.queryByText('0')).not.toBeInTheDocument();
+  });
+
   it('shows a warning badge when the user is not logged in', () => {
     renderButton({ userLoggedIn: false });
 
diff --git a/src/ui/components/SideBar/ServerButton.tsx b/src/ui/components/SideBar/ServerButton.tsx
index 8ceb4438db..800f1ffc3b 100644
--- a/src/ui/components/SideBar/ServerButton.tsx
+++ b/src/ui/components/SideBar/ServerButton.tsx
@@ -204,7 +204,9 @@ const ServerButton = ({
               transform: translate(30%, -30%);
             `}
           >
-            {mentionCount && <Badge variant='secondary'>{mentionCount}</Badge>}
+            {!!mentionCount && (
+              <Badge variant='secondary'>{mentionCount}</Badge>
+            )}
             {!userLoggedIn && <Badge variant='warning'>!</Badge>}
           </Box>
         </IconButton>