Surface unsent messages on the sublist notification badge too

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}

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}
                         />
                     );
 

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