Making sure that the sub list count always stays up to date, including when people read the outstanding notifications

pull/2028/head
wmwragg 2016-08-23 13:24:02 +01:00
parent 65d7d01dfa
commit d2e8201d79
1 changed files with 11 additions and 12 deletions

View File

@ -82,15 +82,11 @@ var RoomSubList = React.createClass({
}, },
getInitialState: function() { getInitialState: function() {
var subListNotifications = this.roomNotificationCount();
return { return {
hidden: this.props.startAsHidden || false, hidden: this.props.startAsHidden || false,
capTruncate: this.props.list.length > TRUNCATE_AT, capTruncate: this.props.list.length > TRUNCATE_AT,
truncateAt: this.props.list.length > TRUNCATE_AT ? TRUNCATE_AT : -1, truncateAt: this.props.list.length > TRUNCATE_AT ? TRUNCATE_AT : -1,
sortedList: [], sortedList: [],
subListNotifCount: subListNotifications[0],
subListNotifHighlight: subListNotifications[1],
}; };
}, },
@ -260,11 +256,10 @@ var RoomSubList = React.createClass({
}, },
_updateSubListCount: function() { _updateSubListCount: function() {
var subListNotifications = this.roomNotificationCount(); // Force an update by setting the state to the current state
this.setState({ // Doing it this way rather than using forceUpdate(), so that the shouldComponentUpdate()
subListNotifCount: subListNotifications[0], // method is honoured
subListNotifHighlight: subListNotifications[1] this.setState(this.state);
});
}, },
moveRoomTile: function(room, atIndex) { moveRoomTile: function(room, atIndex) {
@ -383,6 +378,10 @@ var RoomSubList = React.createClass({
_getHeaderJsx: function() { _getHeaderJsx: function() {
var TintableSvg = sdk.getComponent("elements.TintableSvg"); var TintableSvg = sdk.getComponent("elements.TintableSvg");
var subListNotifications = this.roomNotificationCount();
var subListNotifCount = subListNotifications[0];
var subListNotifHighlight = subListNotifications[1];
var roomCount = this.props.list.length > 0 ? this.props.list.length : ''; var roomCount = this.props.list.length > 0 ? this.props.list.length : '';
var isTruncatable = this.props.list.length > TRUNCATE_AT; var isTruncatable = this.props.list.length > TRUNCATE_AT;
if (!this.state.hidden && this.state.capTruncate && isTruncatable) { if (!this.state.hidden && this.state.capTruncate && isTruncatable) {
@ -398,12 +397,12 @@ var RoomSubList = React.createClass({
var badgeClasses = classNames({ var badgeClasses = classNames({
'mx_RoomSubList_badge': true, 'mx_RoomSubList_badge': true,
'mx_RoomSubList_badgeHighlight': this.state.subListNotifHighlight, 'mx_RoomSubList_badgeHighlight': subListNotifHighlight,
}); });
var badge; var badge;
if (this.state.subListNotifCount > 0) { if (subListNotifCount > 0) {
badge = <div className={badgeClasses}>{this.state.subListNotifCount}</div>; badge = <div className={badgeClasses}>{subListNotifCount}</div>;
} }
return ( return (