From e384381796bb7cbfa1ffe35ef581a10ae0c5783c Mon Sep 17 00:00:00 2001
From: Germain <germain@souquet.com>
Date: Tue, 25 Oct 2022 10:49:35 +0100
Subject: [PATCH] Only render NotificationBadge when needed

---
 cypress/e2e/sliding-sync/sliding-sync.ts         | 2 +-
 src/components/views/rooms/NotificationBadge.tsx | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/cypress/e2e/sliding-sync/sliding-sync.ts b/cypress/e2e/sliding-sync/sliding-sync.ts
index ebc90443f34..e0e7c974a77 100644
--- a/cypress/e2e/sliding-sync/sliding-sync.ts
+++ b/cypress/e2e/sliding-sync/sliding-sync.ts
@@ -235,7 +235,7 @@ describe("Sliding Sync", () => {
             "Test Room", "Dummy",
         ]);
 
-        cy.contains(".mx_RoomTile", "Test Room").get(".mx_NotificationBadge").should("not.be.visible");
+        cy.contains(".mx_RoomTile", "Test Room").get(".mx_NotificationBadge").should("not.exist");
     });
 
     it("should update user settings promptly", () => {
diff --git a/src/components/views/rooms/NotificationBadge.tsx b/src/components/views/rooms/NotificationBadge.tsx
index 3555582298b..dccf8b11906 100644
--- a/src/components/views/rooms/NotificationBadge.tsx
+++ b/src/components/views/rooms/NotificationBadge.tsx
@@ -111,7 +111,12 @@ export default class NotificationBadge extends React.PureComponent<XOR<IProps, I
 
     public render(): React.ReactElement {
         /* eslint @typescript-eslint/no-unused-vars: ["error", { "ignoreRestSiblings": true }] */
-        const { notification, showUnsentTooltip, onClick } = this.props;
+        const { notification, showUnsentTooltip, forceCount, onClick } = this.props;
+
+        if (notification.isIdle) return null;
+        if (forceCount) {
+            if (!notification.hasUnreadCount) return null; // Can't render a badge
+        }
 
         let label: string;
         let tooltip: JSX.Element;