From b3341e6664ccfaf76e2a8673fe9b26d7a19b74a7 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 27 Jun 2018 09:16:37 +0100
Subject: [PATCH] on click roomsublist notif badge, goto first room with notif

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 res/css/structures/_RoomSubList.scss     |  4 ++++
 src/components/structures/RoomSubList.js | 27 +++++++++++++++++++++++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/res/css/structures/_RoomSubList.scss b/res/css/structures/_RoomSubList.scss
index a2863460ad..6798f75a14 100644
--- a/res/css/structures/_RoomSubList.scss
+++ b/res/css/structures/_RoomSubList.scss
@@ -91,6 +91,10 @@ limitations under the License.
     background-color: $accent-color;
 }
 
+.mx_RoomSubList_label .mx_RoomSubList_badge:hover {
+    filter: brightness($focus-brightness);
+}
+
 /*
 .collapsed .mx_RoomSubList_badge {
     display: none;
diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index 0b6f7eaa45..db23466f9a 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -237,6 +237,29 @@ const RoomSubList = React.createClass({
         });
     },
 
+    _onNotifBadgeClick: function(e) {
+        // prevent the roomsublist collapsing
+        e.preventDefault();
+        e.stopPropagation();
+        // find first room which has notifications and switch to it
+        for (const room of this.state.sortedList) {
+            const roomNotifState = RoomNotifs.getRoomNotifsState(room.roomId);
+            const highlight = room.getUnreadNotificationCount('highlight') > 0;
+            const notificationCount = room.getUnreadNotificationCount();
+
+            const notifBadges = notificationCount > 0 && this._shouldShowNotifBadge(roomNotifState);
+            const mentionBadges = highlight && this._shouldShowMentionBadge(roomNotifState);
+
+            if (notifBadges || mentionBadges) {
+                dis.dispatch({
+                    action: 'view_room',
+                    room_id: room.roomId,
+                });
+                return;
+            }
+        }
+    },
+
     _getHeaderJsx: function() {
         const subListNotifications = this.roomNotificationCount();
         const subListNotifCount = subListNotifications[0];
@@ -258,7 +281,9 @@ const RoomSubList = React.createClass({
 
         let badge;
         if (subListNotifCount > 0) {
-            badge = <div className={badgeClasses}>{FormattingUtils.formatCount(subListNotifCount)}</div>;
+            badge = <div className={badgeClasses} onClick={this._onNotifBadgeClick}>
+                { FormattingUtils.formatCount(subListNotifCount) }
+            </div>;
         } else if (this.props.isInvite) {
             // no notifications but highlight anyway because this is an invite badge
             badge = <div className={badgeClasses}>!</div>;