Merge pull request #2161 from matrix-org/bwindels/dontupdatememberlistwhileloading

avoid updating the memberlist while the spinner is shown
pull/21833/head
Bruno Windels 2018-09-11 10:57:29 +02:00 committed by GitHub
commit ecaabd6b75
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 27 additions and 21 deletions

View File

@ -32,8 +32,6 @@ module.exports = React.createClass({
displayName: 'MemberList', displayName: 'MemberList',
getInitialState: function() { getInitialState: function() {
this.memberDict = this.getMemberDict();
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
if (cli.hasLazyLoadMembersEnabled()) { if (cli.hasLazyLoadMembersEnabled()) {
return {loading: true}; return {loading: true};
@ -43,6 +41,20 @@ module.exports = React.createClass({
}, },
componentWillMount: function() { componentWillMount: function() {
this._mounted = false;
const cli = MatrixClientPeg.get();
if (!cli.hasLazyLoadMembersEnabled()) {
this._listenForMembersChanges();
}
const enablePresenceByHsUrl = SdkConfig.get()["enable_presence_by_hs_url"];
const hsUrl = MatrixClientPeg.get().baseUrl;
this._showPresence = true;
if (enablePresenceByHsUrl && enablePresenceByHsUrl[hsUrl] !== undefined) {
this._showPresence = enablePresenceByHsUrl[hsUrl];
}
},
_listenForMembersChanges: function() {
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
cli.on("RoomState.members", this.onRoomStateMember); cli.on("RoomState.members", this.onRoomStateMember);
cli.on("RoomMember.name", this.onRoomMemberName); cli.on("RoomMember.name", this.onRoomMemberName);
@ -53,25 +65,22 @@ module.exports = React.createClass({
// the information contained in presence events). // the information contained in presence events).
cli.on("User.lastPresenceTs", this.onUserLastPresenceTs); cli.on("User.lastPresenceTs", this.onUserLastPresenceTs);
// cli.on("Room.timeline", this.onRoomTimeline); // cli.on("Room.timeline", this.onRoomTimeline);
const enablePresenceByHsUrl = SdkConfig.get()["enable_presence_by_hs_url"];
const hsUrl = MatrixClientPeg.get().baseUrl;
this._showPresence = true;
if (enablePresenceByHsUrl && enablePresenceByHsUrl[hsUrl] !== undefined) {
this._showPresence = enablePresenceByHsUrl[hsUrl];
}
}, },
componentDidMount: async function() { componentDidMount: async function() {
this._mounted = true;
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
if (cli.hasLazyLoadMembersEnabled()) { if (cli.hasLazyLoadMembersEnabled()) {
await this._waitForMembersToLoad(); await this._waitForMembersToLoad();
if (this._mounted) {
this.setState(this._getMembersState()); this.setState(this._getMembersState());
this._listenForMembersChanges();
}
} }
}, },
componentWillUnmount: function() { componentWillUnmount: function() {
this._mounted = false;
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
if (cli) { if (cli) {
cli.removeListener("RoomState.members", this.onRoomStateMember); cli.removeListener("RoomState.members", this.onRoomStateMember);
@ -187,8 +196,6 @@ module.exports = React.createClass({
_updateList: new rate_limited_func(function() { _updateList: new rate_limited_func(function() {
// console.log("Updating memberlist"); // console.log("Updating memberlist");
this.memberDict = this.getMemberDict();
const newState = { const newState = {
members: this.roomMembers(), members: this.roomMembers(),
}; };
@ -197,15 +204,15 @@ module.exports = React.createClass({
this.setState(newState); this.setState(newState);
}, 500), }, 500),
getMemberDict: function() { getMembersWithUser: function() {
if (!this.props.roomId) return {}; if (!this.props.roomId) return [];
const cli = MatrixClientPeg.get(); const cli = MatrixClientPeg.get();
const room = cli.getRoom(this.props.roomId); const room = cli.getRoom(this.props.roomId);
if (!room) return {}; if (!room) return [];
const all_members = room.currentState.members; const allMembers = Object.values(room.currentState.members);
Object.values(all_members).forEach(function(member) { allMembers.forEach(function(member) {
// work around a race where you might have a room member object // work around a race where you might have a room member object
// before the user object exists. This may or may not cause // before the user object exists. This may or may not cause
// https://github.com/vector-im/vector-web/issues/186 // https://github.com/vector-im/vector-web/issues/186
@ -217,14 +224,13 @@ module.exports = React.createClass({
// the right solution here is to fix the race rather than leave it as 0 // the right solution here is to fix the race rather than leave it as 0
}); });
return all_members; return allMembers;
}, },
roomMembers: function() { roomMembers: function() {
const ConferenceHandler = CallHandler.getConferenceHandler(); const ConferenceHandler = CallHandler.getConferenceHandler();
const allMembersDict = this.memberDict || {}; const allMembers = this.getMembersWithUser();
const allMembers = Object.values(allMembersDict);
const filteredAndSortedMembers = allMembers.filter((m) => { const filteredAndSortedMembers = allMembers.filter((m) => {
return ( return (
m.membership === 'join' || m.membership === 'invite' m.membership === 'join' || m.membership === 'invite'