OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #1560 from matrix-org/luke/groups-expose-ready-state 

Display whether the group summary/room list is loading
pull/21833/head
David Baker 2017-10-31 17:29:36 +00:00 committed by GitHub
parent f24c64f071 16dca08b77
commit 273aae207a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/structures/GroupView.js
View File

@ -407,6 +407,10 @@ export default React.createClass({
getInitialState: function() {
return {
summary: null,
isGroupPublicised: null,
isUserPrivileged: null,
groupRooms: null,
groupRoomsLoading: null,
error: null,
editing: false,
saving: false,
@ -458,8 +462,11 @@ export default React.createClass({
}
this.setState({
summary,
summaryLoading: !this._groupStore.isStateReady(GroupStore.STATE_KEY.Summary),
isGroupPublicised: this._groupStore.getGroupPublicity(),
isUserPrivileged: this._groupStore.isUserPrivileged(),
groupRooms: this._groupStore.getGroupRooms(),
groupRoomsLoading: !this._groupStore.isStateReady(GroupStore.STATE_KEY.GroupRooms),
isUserMember: this._groupStore.getGroupMembers().some(
(m) => m.userId === MatrixClientPeg.get().credentials.userId,
),
@ -653,6 +660,7 @@ export default React.createClass({
const RoomDetailList = sdk.getComponent('rooms.RoomDetailList');
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const TintableSvg = sdk.getComponent('elements.TintableSvg');
const Spinner = sdk.getComponent('elements.Spinner');
const addRoomRow = this.state.editing ?
(<AccessibleButton className="mx_GroupView_rooms_header_addRow"
@ -670,7 +678,10 @@ export default React.createClass({
<h3>{ _t('Rooms') }</h3>
{ addRoomRow }
</div>
<RoomDetailList rooms={this._groupStore.getGroupRooms()} />
{ this.state.groupRoomsLoading ?
<Spinner /> :
<RoomDetailList rooms={this.state.groupRooms} />
}
</div>;
},
@ -866,7 +877,7 @@ export default React.createClass({
const Spinner = sdk.getComponent("elements.Spinner");
const TintableSvg = sdk.getComponent("elements.TintableSvg");
if (this.state.summary === null && this.state.error === null || this.state.saving) {
if (this.state.summaryLoading && this.state.error === null || this.state.saving) {
return <Spinner />;
} else if (this.state.summary) {
const summary = this.state.summary;

21
src/stores/GroupStore.js
View File

@ -23,12 +23,23 @@ import FlairStore from './FlairStore';
* other useful group APIs that may have an effect on the group summary.
*/
export default class GroupStore extends EventEmitter {
static STATE_KEY = {
GroupMembers: 'GroupMembers',
GroupInvitedMembers: 'GroupInvitedMembers',
Summary: 'Summary',
GroupRooms: 'GroupRooms',
};
constructor(matrixClient, groupId) {
super();
this.groupId = groupId;
this._matrixClient = matrixClient;
this._summary = {};
this._rooms = [];
this._members = [];
this._invitedMembers = [];
this._ready = {};
this.on('error', (err) => {
console.error(`GroupStore for ${this.groupId} encountered error`, err);
@ -40,6 +51,7 @@ export default class GroupStore extends EventEmitter {
this._members = result.chunk.map((apiMember) => {
return groupMemberFromApiObject(apiMember);
});
this._ready[GroupStore.STATE_KEY.GroupMembers] = true;
this._notifyListeners();
}).catch((err) => {
console.error("Failed to get group member list: " + err);
@ -50,6 +62,7 @@ export default class GroupStore extends EventEmitter {
this._invitedMembers = result.chunk.map((apiMember) => {
return groupMemberFromApiObject(apiMember);
});
this._ready[GroupStore.STATE_KEY.GroupInvitedMembers] = true;
this._notifyListeners();
}).catch((err) => {
// Invited users not visible to non-members
@ -64,6 +77,7 @@ export default class GroupStore extends EventEmitter {
_fetchSummary() {
this._matrixClient.getGroupSummary(this.groupId).then((resp) => {
this._summary = resp;
this._ready[GroupStore.STATE_KEY.Summary] = true;
this._notifyListeners();
}).catch((err) => {
this.emit('error', err);
@ -75,6 +89,7 @@ export default class GroupStore extends EventEmitter {
this._rooms = resp.chunk.map((apiRoom) => {
return groupRoomFromApiObject(apiRoom);
});
this._ready[GroupStore.STATE_KEY.GroupRooms] = true;
this._notifyListeners();
}).catch((err) => {
this.emit('error', err);
@ -87,6 +102,8 @@ export default class GroupStore extends EventEmitter {
registerListener(fn) {
this.on('update', fn);
// Call to set initial state (before fetching starts)
this.emit('update');
this._fetchSummary();
this._fetchRooms();
this._fetchMembers();
@ -96,6 +113,10 @@ export default class GroupStore extends EventEmitter {
this.removeListener('update', fn);
}
isStateReady(id) {
return this._ready[id];
}
getSummary() {
return this._summary;
}