diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index ca3efcef1c..dff6d5c8b5 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -217,22 +217,30 @@ var RoomSubList = React.createClass({ return roomNotifState != RoomNotifs.MUTE; }, - roomNotificationCount: function() { + /** + * Total up all the notification counts from the rooms + * + * @param {Number} If supplied will only total notifications for rooms outside the truncation number + * @returns {Array} The array takes the form [total, highlight] where highlight is a bool + */ + roomNotificationCount: function(truncateAt) { var self = this; - return this.props.list.reduce(function(result, room) { - var roomNotifState = RoomNotifs.getRoomNotifsState(room.roomId); - var highlight = room.getUnreadNotificationCount('highlight') > 0 || self.props.label === 'Invites'; - var notificationCount = room.getUnreadNotificationCount(); + return this.props.list.reduce(function(result, room, index) { + if (truncateAt === undefined || index >= truncateAt) { + var roomNotifState = RoomNotifs.getRoomNotifsState(room.roomId); + var highlight = room.getUnreadNotificationCount('highlight') > 0 || self.props.label === 'Invites'; + var notificationCount = room.getUnreadNotificationCount(); - const notifBadges = notificationCount > 0 && self._shouldShowNotifBadge(roomNotifState); - const mentionBadges = highlight && self._shouldShowMentionBadge(roomNotifState); - const badges = notifBadges || mentionBadges; + const notifBadges = notificationCount > 0 && self._shouldShowNotifBadge(roomNotifState); + const mentionBadges = highlight && self._shouldShowMentionBadge(roomNotifState); + const badges = notifBadges || mentionBadges; - if (badges) { - result[0] += notificationCount; - if (highlight) { - result[1] = true; + if (badges) { + result[0] += notificationCount; + if (highlight) { + result[1] = true; + } } } return result; @@ -423,11 +431,25 @@ var RoomSubList = React.createClass({ _createOverflowTile: function(overflowCount, totalCount) { var content =
; + + var overflowNotifications = this.roomNotificationCount(TRUNCATE_AT); + var overflowNotifCount = overflowNotifications[0]; + var overflowNotifHighlight = overflowNotifications[1]; + if (overflowNotifCount && !this.props.collapsed) { + content = overflowNotifCount; + } + + var badgeClasses = classNames({ + 'mx_RoomSubList_moreBadge': true, + 'mx_RoomSubList_moreBadgeNotify': overflowNotifCount && !this.props.collapsed, + 'mx_RoomSubList_moreBadgeHighlight': overflowNotifHighlight && !this.props.collapsed, + }); + return (