diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js index 2a19794f..55f588f2 100644 --- a/src/components/structures/RightPanel.js +++ b/src/components/structures/RightPanel.js @@ -24,7 +24,7 @@ import sdk from 'matrix-react-sdk'; import dis from 'matrix-react-sdk/lib/dispatcher'; import { MatrixClient } from 'matrix-js-sdk'; import Analytics from 'matrix-react-sdk/lib/Analytics'; -import rate_limited_func from 'matrix-react-sdk/lib/ratelimitedfunc'; +import RateLimitedFunc from 'matrix-react-sdk/lib/ratelimitedfunc'; import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton'; import { showGroupInviteDialog, showGroupAddRoomDialog } from 'matrix-react-sdk/lib/GroupAddressPicker'; import GroupStoreCache from 'matrix-react-sdk/lib/stores/GroupStoreCache'; @@ -58,8 +58,8 @@ class HeaderButton extends React.Component {
{ this.props.badge ? this.props.badge :   }
- - { this.props.isHighlighted ?
:
} + + { this.props.isHighlighted ?
:
} ; } @@ -184,18 +184,17 @@ module.exports = React.createClass({ onRoomStateMember: function(ev, state, member) { // redraw the badge on the membership list - if (this.state.phase == this.Phase.RoomMemberList && member.roomId === this.props.roomId) { + if (this.state.phase === this.Phase.RoomMemberList && member.roomId === this.props.roomId) { this._delayedUpdate(); - } - else if (this.state.phase === this.Phase.RoomMemberInfo && member.roomId === this.props.roomId && + } else if (this.state.phase === this.Phase.RoomMemberInfo && member.roomId === this.props.roomId && member.userId === this.state.member.userId) { // refresh the member info (e.g. new power level) this._delayedUpdate(); } }, - _delayedUpdate: new rate_limited_func(function() { - this.forceUpdate(); + _delayedUpdate: new RateLimitedFunc(function() { + this.forceUpdate(); // eslint-disable-line babel/no-invalid-this }, 500), onAction: function(payload) { @@ -266,22 +265,23 @@ module.exports = React.createClass({ let inviteGroup; let membersBadge; - if ((this.state.phase == this.Phase.RoomMemberList || this.state.phase === this.Phase.RoomMemberInfo) + let membersTitle = _t('Members'); + if ((this.state.phase === this.Phase.RoomMemberList || this.state.phase === this.Phase.RoomMemberInfo) && this.props.roomId ) { const cli = this.context.matrixClient; const room = cli.getRoom(this.props.roomId); - let userIsInRoom; + let isUserInRoom; if (room) { - membersBadge = formatCount(room.getJoinedMembers().length); - userIsInRoom = room.hasMembershipState( - this.context.matrixClient.credentials.userId, 'join', - ); + const numMembers = room.getJoinedMembers().length; + membersTitle = _t('%(count)s Members', { count: numMembers }); + membersBadge =
{ formatCount(numMembers) }
; + isUserInRoom = room.hasMembershipState(this.context.matrixClient.credentials.userId, 'join'); } - if (userIsInRoom) { + if (isUserInRoom) { inviteGroup = - +
@@ -292,13 +292,13 @@ module.exports = React.createClass({ const isPhaseGroup = [ this.Phase.GroupMemberInfo, - this.Phase.GroupMemberList + this.Phase.GroupMemberList, ].includes(this.state.phase); let headerButtons = []; if (this.props.roomId) { headerButtons = [ - - +
, ); } let panel =
; if (!this.props.collapsed) { - if (this.props.roomId && this.state.phase == this.Phase.RoomMemberList) { + if (this.props.roomId && this.state.phase === this.Phase.RoomMemberList) { panel = ; - } else if (this.props.groupId && this.state.phase == this.Phase.GroupMemberList) { + } else if (this.props.groupId && this.state.phase === this.Phase.GroupMemberList) { panel = ; } else if (this.state.phase === this.Phase.GroupRoomList) { panel = ; - } else if (this.state.phase == this.Phase.RoomMemberInfo) { + } else if (this.state.phase === this.Phase.RoomMemberInfo) { panel = ; - } else if (this.state.phase == this.Phase.GroupMemberInfo) { + } else if (this.state.phase === this.Phase.GroupMemberInfo) { panel = ; - } else if (this.state.phase == this.Phase.GroupRoomInfo) { + } else if (this.state.phase === this.Phase.GroupRoomInfo) { panel = ; - } else if (this.state.phase == this.Phase.NotificationPanel) { + } else if (this.state.phase === this.Phase.NotificationPanel) { panel = ; - } else if (this.state.phase == this.Phase.FilePanel) { + } else if (this.state.phase === this.Phase.FilePanel) { panel = ; } } if (!panel) { - panel =
; + panel =
; } if (this.props.groupId && this.state.isUserPrivilegedInGroup) { inviteGroup = isPhaseGroup ? ( - +
{ _t('Invite to this community') }
) : ( - +
@@ -392,19 +392,16 @@ module.exports = React.createClass({ ); } - let classes = classNames( - "mx_RightPanel", "mx_fadable", - { - "collapsed": this.props.collapsed, - "mx_fadable_faded": this.props.disabled, - } - ); + const classes = classNames("mx_RightPanel", "mx_fadable", { + "collapsed": this.props.collapsed, + "mx_fadable_faded": this.props.disabled, + }); return (