From aff9be6120a0714532f6675b1aa7b5afc63cbebf Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Fri, 10 Sep 2021 10:58:13 +0100
Subject: [PATCH] Surface unsent messages on the sublist notification badge too

---
 src/components/views/rooms/NotificationBadge.tsx  | 9 +++++----
 src/components/views/rooms/RoomSublist.tsx        | 1 +
 src/stores/notifications/ListNotificationState.ts | 9 +++++----
 3 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/components/views/rooms/NotificationBadge.tsx b/src/components/views/rooms/NotificationBadge.tsx
index a70ff93bd2..a97d51fc90 100644
--- a/src/components/views/rooms/NotificationBadge.tsx
+++ b/src/components/views/rooms/NotificationBadge.tsx
@@ -143,15 +143,16 @@ export default class NotificationBadge extends React.PureComponent<XOR<IProps, I
         });
 
         if (onClick) {
-            let tooltip;
+            let label: string;
+            let tooltip: JSX.Element;
             if (showUnsentTooltip && this.state.showTooltip && notification.color === NotificationColor.Unsent) {
-                tooltip = (
-                    <Tooltip className="mx_RoleButton_tooltip" label={_t("Message didn't send. Click for info.")} />
-                );
+                label = _t("Message didn't send. Click for info.");
+                tooltip = <Tooltip className="mx_RoleButton_tooltip" label={label} />;
             }
 
             return (
                 <AccessibleButton
+                    aria-label={label}
                     {...props}
                     className={classes}
                     onClick={onClick}
diff --git a/src/components/views/rooms/RoomSublist.tsx b/src/components/views/rooms/RoomSublist.tsx
index cf82040793..3c9f0ea65e 100644
--- a/src/components/views/rooms/RoomSublist.tsx
+++ b/src/components/views/rooms/RoomSublist.tsx
@@ -670,6 +670,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
                             onClick={this.onBadgeClick}
                             tabIndex={tabIndex}
                             aria-label={ariaLabel}
+                            showUnsentTooltip={true}
                         />
                     );
 
diff --git a/src/stores/notifications/ListNotificationState.ts b/src/stores/notifications/ListNotificationState.ts
index 6c67dbdd08..4168fe80b6 100644
--- a/src/stores/notifications/ListNotificationState.ts
+++ b/src/stores/notifications/ListNotificationState.ts
@@ -31,10 +31,6 @@ export class ListNotificationState extends NotificationState {
         super();
     }
 
-    public get symbol(): string {
-        return null; // This notification state doesn't support symbols
-    }
-
     public setRooms(rooms: Room[]) {
         // If we're only concerned about the tile count, don't bother setting up listeners.
         if (this.byTileCount) {
@@ -82,6 +78,7 @@ export class ListNotificationState extends NotificationState {
     private calculateTotalState() {
         const snapshot = this.snapshot();
 
+        this._symbol = null;
         if (this.byTileCount) {
             this._color = NotificationColor.Red;
             this._count = this.rooms.length;
@@ -92,6 +89,10 @@ export class ListNotificationState extends NotificationState {
                 this._count += state.count;
                 this._color = Math.max(this.color, state.color);
             }
+
+            if (this._color === NotificationColor.Unsent) {
+                this._symbol = "!";
+            }
         }
 
         // finally, publish an update if needed