2015-11-30 19:55:00 +03:00
|
|
|
/*
|
2016-01-07 07:06:39 +03:00
|
|
|
Copyright 2015, 2016 OpenMarket Ltd
|
2017-05-04 17:46:24 +03:00
|
|
|
Copyright 2017 Vector Creations Ltd
|
2015-11-30 19:55:00 +03:00
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
|
|
|
'use strict';
|
2017-10-11 19:56:17 +03:00
|
|
|
const React = require("react");
|
|
|
|
const ReactDOM = require("react-dom");
|
2017-12-26 04:03:18 +03:00
|
|
|
import PropTypes from 'prop-types';
|
2017-11-13 22:19:33 +03:00
|
|
|
import { _t } from '../../../languageHandler';
|
2017-10-11 19:56:17 +03:00
|
|
|
const MatrixClientPeg = require("../../../MatrixClientPeg");
|
|
|
|
const CallHandler = require('../../../CallHandler');
|
|
|
|
const dis = require("../../../dispatcher");
|
|
|
|
const sdk = require('../../../index');
|
|
|
|
const rate_limited_func = require('../../../ratelimitedfunc');
|
2018-01-26 00:16:03 +03:00
|
|
|
import * as Rooms from '../../../Rooms';
|
2016-10-02 14:57:45 +03:00
|
|
|
import DMRoomMap from '../../../utils/DMRoomMap';
|
2017-10-11 19:56:17 +03:00
|
|
|
const Receipt = require('../../../utils/Receipt');
|
2018-01-03 14:33:59 +03:00
|
|
|
import TagOrderStore from '../../../stores/TagOrderStore';
|
2018-01-26 00:16:03 +03:00
|
|
|
import RoomListStore from '../../../stores/RoomListStore';
|
2017-11-29 19:35:16 +03:00
|
|
|
import GroupStoreCache from '../../../stores/GroupStoreCache';
|
2015-11-30 19:55:00 +03:00
|
|
|
|
2017-04-26 20:59:16 +03:00
|
|
|
const HIDE_CONFERENCE_CHANS = true;
|
2018-02-16 20:11:04 +03:00
|
|
|
const STANDARD_TAGS_REGEX = /^(m\.(favourite|lowpriority)|im\.vector\.fake\.(invite|recent|direct|archived))$/;
|
2017-04-26 20:59:16 +03:00
|
|
|
|
2017-06-19 19:49:22 +03:00
|
|
|
function phraseForSection(section) {
|
|
|
|
switch (section) {
|
|
|
|
case 'm.favourite':
|
2017-10-15 17:57:13 +03:00
|
|
|
return _t('Drop here to favourite');
|
2017-06-19 19:49:22 +03:00
|
|
|
case 'im.vector.fake.direct':
|
2017-10-15 17:57:13 +03:00
|
|
|
return _t('Drop here to tag direct chat');
|
2017-06-19 19:49:22 +03:00
|
|
|
case 'im.vector.fake.recent':
|
2017-10-15 17:57:13 +03:00
|
|
|
return _t('Drop here to restore');
|
2017-06-19 19:49:22 +03:00
|
|
|
case 'm.lowpriority':
|
2017-10-15 17:57:13 +03:00
|
|
|
return _t('Drop here to demote');
|
2017-06-19 19:49:22 +03:00
|
|
|
default:
|
|
|
|
return _t('Drop here to tag %(section)s', {section: section});
|
|
|
|
}
|
2017-10-11 19:56:17 +03:00
|
|
|
}
|
2015-11-30 19:55:00 +03:00
|
|
|
|
|
|
|
module.exports = React.createClass({
|
|
|
|
displayName: 'RoomList',
|
|
|
|
|
|
|
|
propTypes: {
|
2017-12-26 04:03:18 +03:00
|
|
|
ConferenceHandler: PropTypes.any,
|
|
|
|
collapsed: PropTypes.bool.isRequired,
|
|
|
|
searchFilter: PropTypes.string,
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
getInitialState: function() {
|
|
|
|
return {
|
2015-12-18 18:13:59 +03:00
|
|
|
isLoadingLeftRooms: false,
|
2017-04-26 20:59:16 +03:00
|
|
|
totalRoomCount: null,
|
2015-11-30 19:55:00 +03:00
|
|
|
lists: {},
|
2015-12-17 05:49:09 +03:00
|
|
|
incomingCall: null,
|
2017-11-29 19:35:16 +03:00
|
|
|
selectedTags: [],
|
2017-01-20 17:22:27 +03:00
|
|
|
};
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
componentWillMount: function() {
|
2017-05-18 19:33:32 +03:00
|
|
|
this.mounted = false;
|
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
const cli = MatrixClientPeg.get();
|
2017-12-05 14:25:30 +03:00
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
cli.on("Room", this.onRoom);
|
2015-12-16 19:27:46 +03:00
|
|
|
cli.on("deleteRoom", this.onDeleteRoom);
|
2017-04-19 00:36:54 +03:00
|
|
|
cli.on("Room.receipt", this.onRoomReceipt);
|
2015-11-30 19:55:00 +03:00
|
|
|
cli.on("RoomMember.name", this.onRoomMemberName);
|
2017-09-12 16:47:26 +03:00
|
|
|
cli.on("Event.decrypted", this.onEventDecrypted);
|
2016-09-07 19:46:45 +03:00
|
|
|
cli.on("accountData", this.onAccountData);
|
2017-09-21 18:28:49 +03:00
|
|
|
cli.on("Group.myMembership", this._onGroupMyMembership);
|
2015-11-30 19:55:00 +03:00
|
|
|
|
2017-12-14 19:34:49 +03:00
|
|
|
const dmRoomMap = DMRoomMap.shared();
|
2017-11-29 19:35:16 +03:00
|
|
|
this._groupStores = {};
|
2017-12-15 17:12:21 +03:00
|
|
|
this._groupStoreTokens = [];
|
2017-12-14 19:17:06 +03:00
|
|
|
// A map between tags which are group IDs and the room IDs of rooms that should be kept
|
|
|
|
// in the room list when filtering by that tag.
|
2017-12-15 20:29:06 +03:00
|
|
|
this._visibleRoomsForGroup = {
|
2017-12-14 19:17:06 +03:00
|
|
|
// $groupId: [$roomId1, $roomId2, ...],
|
|
|
|
};
|
2018-01-05 15:33:26 +03:00
|
|
|
// All rooms that should be kept in the room list when filtering.
|
|
|
|
// By default, show all rooms.
|
|
|
|
this._visibleRooms = MatrixClientPeg.get().getRooms();
|
2017-11-29 19:35:16 +03:00
|
|
|
// When the selected tags are changed, initialise a group store if necessary
|
2018-01-03 14:33:59 +03:00
|
|
|
this._tagStoreToken = TagOrderStore.addListener(() => {
|
2018-01-03 17:12:28 +03:00
|
|
|
(TagOrderStore.getOrderedTags() || []).forEach((tag) => {
|
2017-11-29 19:35:16 +03:00
|
|
|
if (tag[0] !== '+' || this._groupStores[tag]) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
this._groupStores[tag] = GroupStoreCache.getGroupStore(tag);
|
2017-12-15 17:12:21 +03:00
|
|
|
this._groupStoreTokens.push(
|
|
|
|
this._groupStores[tag].registerListener(() => {
|
|
|
|
// This group's rooms or members may have updated, update rooms for its tag
|
2018-01-02 22:26:56 +03:00
|
|
|
this.updateVisibleRoomsForTag(dmRoomMap, tag);
|
|
|
|
this.updateVisibleRooms();
|
2017-12-15 17:12:21 +03:00
|
|
|
}),
|
|
|
|
);
|
2017-11-29 19:35:16 +03:00
|
|
|
});
|
2017-12-05 14:25:30 +03:00
|
|
|
// Filters themselves have changed, refresh the selected tags
|
2017-12-15 20:29:06 +03:00
|
|
|
this.updateVisibleRooms();
|
2017-11-29 19:35:16 +03:00
|
|
|
});
|
|
|
|
|
2018-01-26 00:16:03 +03:00
|
|
|
this._roomListStoreToken = RoomListStore.addListener(() => {
|
|
|
|
this._delayedRefreshRoomList();
|
|
|
|
});
|
|
|
|
|
2017-04-26 20:59:16 +03:00
|
|
|
this.refreshRoomList();
|
|
|
|
|
|
|
|
// order of the sublists
|
|
|
|
//this.listOrder = [];
|
|
|
|
|
|
|
|
// loop count to stop a stack overflow if the user keeps waggling the
|
|
|
|
// mouse for >30s in a row, or if running under mocha
|
2017-10-11 19:56:17 +03:00
|
|
|
this._delayedRefreshRoomListLoopCount = 0;
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
componentDidMount: function() {
|
|
|
|
this.dispatcherRef = dis.register(this.onAction);
|
2016-08-30 14:29:25 +03:00
|
|
|
// Initialise the stickyHeaders when the component is created
|
2016-08-26 17:09:13 +03:00
|
|
|
this._updateStickyHeaders(true);
|
2017-05-18 19:33:32 +03:00
|
|
|
|
|
|
|
this.mounted = true;
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
2017-05-18 19:35:22 +03:00
|
|
|
componentDidUpdate: function() {
|
2016-08-30 14:29:25 +03:00
|
|
|
// Reinitialise the stickyHeaders when the component is updated
|
2016-08-26 17:09:13 +03:00
|
|
|
this._updateStickyHeaders(true);
|
2016-09-15 17:33:08 +03:00
|
|
|
this._repositionIncomingCallBox(undefined, false);
|
2016-08-25 21:46:01 +03:00
|
|
|
},
|
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
onAction: function(payload) {
|
|
|
|
switch (payload.action) {
|
|
|
|
case 'view_tooltip':
|
|
|
|
this.tooltip = payload.tooltip;
|
2015-12-17 05:49:09 +03:00
|
|
|
break;
|
|
|
|
case 'call_state':
|
|
|
|
var call = CallHandler.getCall(payload.room_id);
|
|
|
|
if (call && call.call_state === 'ringing') {
|
|
|
|
this.setState({
|
2017-10-11 19:56:17 +03:00
|
|
|
incomingCall: call,
|
2015-12-17 05:49:09 +03:00
|
|
|
});
|
|
|
|
this._repositionIncomingCallBox(undefined, true);
|
2017-10-11 19:56:17 +03:00
|
|
|
} else {
|
2015-12-17 05:49:09 +03:00
|
|
|
this.setState({
|
2017-10-11 19:56:17 +03:00
|
|
|
incomingCall: null,
|
2016-04-15 19:55:00 +03:00
|
|
|
});
|
2015-12-17 05:49:09 +03:00
|
|
|
}
|
|
|
|
break;
|
2015-11-30 19:55:00 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
componentWillUnmount: function() {
|
2017-05-18 19:33:32 +03:00
|
|
|
this.mounted = false;
|
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
dis.unregister(this.dispatcherRef);
|
|
|
|
if (MatrixClientPeg.get()) {
|
|
|
|
MatrixClientPeg.get().removeListener("Room", this.onRoom);
|
2016-02-04 18:55:24 +03:00
|
|
|
MatrixClientPeg.get().removeListener("deleteRoom", this.onDeleteRoom);
|
2017-04-19 00:36:54 +03:00
|
|
|
MatrixClientPeg.get().removeListener("Room.receipt", this.onRoomReceipt);
|
2016-02-04 18:55:24 +03:00
|
|
|
MatrixClientPeg.get().removeListener("RoomMember.name", this.onRoomMemberName);
|
2017-09-12 16:47:26 +03:00
|
|
|
MatrixClientPeg.get().removeListener("Event.decrypted", this.onEventDecrypted);
|
2016-09-07 19:46:45 +03:00
|
|
|
MatrixClientPeg.get().removeListener("accountData", this.onAccountData);
|
2017-09-21 18:28:49 +03:00
|
|
|
MatrixClientPeg.get().removeListener("Group.myMembership", this._onGroupMyMembership);
|
2015-11-30 19:55:00 +03:00
|
|
|
}
|
2017-11-29 19:35:16 +03:00
|
|
|
|
2018-01-03 14:33:59 +03:00
|
|
|
if (this._tagStoreToken) {
|
|
|
|
this._tagStoreToken.remove();
|
2017-11-29 19:35:16 +03:00
|
|
|
}
|
|
|
|
|
2018-02-15 14:23:00 +03:00
|
|
|
if (this._roomListStoreToken) {
|
|
|
|
this._roomListStoreToken.remove();
|
|
|
|
}
|
|
|
|
|
2017-12-15 17:12:21 +03:00
|
|
|
if (this._groupStoreTokens.length > 0) {
|
|
|
|
// NB: GroupStore is not a Flux.Store
|
|
|
|
this._groupStoreTokens.forEach((token) => token.unregister());
|
|
|
|
}
|
|
|
|
|
2016-08-10 15:39:47 +03:00
|
|
|
// cancel any pending calls to the rate_limited_funcs
|
|
|
|
this._delayedRefreshRoomList.cancelPendingCall();
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
onRoom: function(room) {
|
2018-01-05 15:33:26 +03:00
|
|
|
this.updateVisibleRooms();
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
2015-12-16 19:27:46 +03:00
|
|
|
onDeleteRoom: function(roomId) {
|
2018-01-05 15:33:26 +03:00
|
|
|
this.updateVisibleRooms();
|
2015-12-16 19:27:46 +03:00
|
|
|
},
|
|
|
|
|
2016-08-30 13:55:51 +03:00
|
|
|
onArchivedHeaderClick: function(isHidden, scrollToPosition) {
|
2015-12-18 14:55:43 +03:00
|
|
|
if (!isHidden) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
2015-12-18 18:13:59 +03:00
|
|
|
this.setState({ isLoadingLeftRooms: true });
|
2016-08-30 13:55:51 +03:00
|
|
|
|
|
|
|
// Try scrolling to position
|
|
|
|
this._updateStickyHeaders(true, scrollToPosition);
|
|
|
|
|
2015-12-18 14:55:43 +03:00
|
|
|
// we don't care about the response since it comes down via "Room"
|
|
|
|
// events.
|
|
|
|
MatrixClientPeg.get().syncLeftRooms().catch(function(err) {
|
|
|
|
console.error("Failed to sync left rooms: %s", err);
|
|
|
|
console.error(err);
|
2015-12-18 18:13:59 +03:00
|
|
|
}).finally(function() {
|
|
|
|
self.setState({ isLoadingLeftRooms: false });
|
2015-12-18 14:55:43 +03:00
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2016-08-26 17:09:13 +03:00
|
|
|
onSubListHeaderClick: function(isHidden, scrollToPosition) {
|
2016-08-26 11:56:07 +03:00
|
|
|
// The scroll area has expanded or contracted, so re-calculate sticky headers positions
|
2016-08-26 17:09:13 +03:00
|
|
|
this._updateStickyHeaders(true, scrollToPosition);
|
2016-08-26 11:56:07 +03:00
|
|
|
},
|
|
|
|
|
2015-12-18 20:51:17 +03:00
|
|
|
onRoomReceipt: function(receiptEvent, room) {
|
|
|
|
// because if we read a notification, it will affect notification count
|
2016-01-07 13:38:44 +03:00
|
|
|
// only bother updating if there's a receipt from us
|
2016-09-09 18:59:59 +03:00
|
|
|
if (Receipt.findReadReceiptFromUserId(receiptEvent, MatrixClientPeg.get().credentials.userId)) {
|
2017-05-16 18:11:01 +03:00
|
|
|
this._delayedRefreshRoomList();
|
2016-01-07 13:38:44 +03:00
|
|
|
}
|
2015-12-18 20:51:17 +03:00
|
|
|
},
|
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
onRoomMemberName: function(ev, member) {
|
2017-05-16 18:11:01 +03:00
|
|
|
this._delayedRefreshRoomList();
|
2015-12-18 18:13:59 +03:00
|
|
|
},
|
|
|
|
|
2017-09-12 16:47:26 +03:00
|
|
|
onEventDecrypted: function(ev) {
|
|
|
|
// An event being decrypted may mean we need to re-order the room list
|
|
|
|
this._delayedRefreshRoomList();
|
|
|
|
},
|
|
|
|
|
2016-09-07 19:46:45 +03:00
|
|
|
onAccountData: function(ev) {
|
|
|
|
if (ev.getType() == 'm.direct') {
|
2017-04-24 17:44:45 +03:00
|
|
|
this._delayedRefreshRoomList();
|
2017-04-20 03:12:57 +03:00
|
|
|
}
|
2016-09-07 19:46:45 +03:00
|
|
|
},
|
|
|
|
|
2017-09-21 18:28:49 +03:00
|
|
|
_onGroupMyMembership: function(group) {
|
|
|
|
this.forceUpdate();
|
|
|
|
},
|
|
|
|
|
2016-02-04 21:06:24 +03:00
|
|
|
_delayedRefreshRoomList: new rate_limited_func(function() {
|
2017-05-16 18:11:01 +03:00
|
|
|
this.refreshRoomList();
|
2016-02-04 21:06:24 +03:00
|
|
|
}, 500),
|
2015-11-30 19:55:00 +03:00
|
|
|
|
2017-12-15 20:21:20 +03:00
|
|
|
// Update which rooms and users should appear in RoomList for a given group tag
|
2017-12-15 20:29:06 +03:00
|
|
|
updateVisibleRoomsForTag: function(dmRoomMap, tag) {
|
2017-11-29 19:35:16 +03:00
|
|
|
if (!this.mounted) return;
|
2017-12-15 17:23:35 +03:00
|
|
|
// For now, only handle group tags
|
|
|
|
const store = this._groupStores[tag];
|
|
|
|
if (!store) return;
|
|
|
|
|
2017-12-15 20:29:06 +03:00
|
|
|
this._visibleRoomsForGroup[tag] = [];
|
|
|
|
store.getGroupRooms().forEach((room) => this._visibleRoomsForGroup[tag].push(room.roomId));
|
2017-12-15 17:23:35 +03:00
|
|
|
store.getGroupMembers().forEach((member) => {
|
|
|
|
if (member.userId === MatrixClientPeg.get().credentials.userId) return;
|
|
|
|
dmRoomMap.getDMRoomsForUserId(member.userId).forEach(
|
2017-12-15 20:29:06 +03:00
|
|
|
(roomId) => this._visibleRoomsForGroup[tag].push(roomId),
|
2017-12-15 17:23:35 +03:00
|
|
|
);
|
2017-12-05 14:25:30 +03:00
|
|
|
});
|
2017-12-15 17:23:35 +03:00
|
|
|
// TODO: Check if room has been tagged to the group by the user
|
|
|
|
},
|
2017-11-29 19:35:16 +03:00
|
|
|
|
2017-12-15 20:30:21 +03:00
|
|
|
// Update which rooms and users should appear according to which tags are selected
|
2017-12-15 20:29:06 +03:00
|
|
|
updateVisibleRooms: function() {
|
2018-01-05 13:23:20 +03:00
|
|
|
const selectedTags = TagOrderStore.getSelectedTags();
|
|
|
|
const visibleGroupRooms = [];
|
2018-01-04 14:50:33 +03:00
|
|
|
selectedTags.forEach((tag) => {
|
2017-12-15 20:29:06 +03:00
|
|
|
(this._visibleRoomsForGroup[tag] || []).forEach(
|
2018-01-05 13:23:20 +03:00
|
|
|
(roomId) => visibleGroupRooms.push(roomId),
|
2017-11-29 19:35:16 +03:00
|
|
|
);
|
|
|
|
});
|
2017-12-05 14:25:30 +03:00
|
|
|
|
2018-01-04 14:50:33 +03:00
|
|
|
// If there are any tags selected, constrain the rooms listed to the
|
|
|
|
// visible rooms as determined by visibleGroupRooms. Here, we
|
|
|
|
// de-duplicate and filter out rooms that the client doesn't know
|
|
|
|
// about (hence the Set and the null-guard on `room`).
|
|
|
|
if (selectedTags.length > 0) {
|
|
|
|
const roomSet = new Set();
|
|
|
|
visibleGroupRooms.forEach((roomId) => {
|
|
|
|
const room = MatrixClientPeg.get().getRoom(roomId);
|
|
|
|
if (room) {
|
|
|
|
roomSet.add(room);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
this._visibleRooms = Array.from(roomSet);
|
|
|
|
} else {
|
|
|
|
// Show all rooms
|
2018-01-05 15:33:26 +03:00
|
|
|
this._visibleRooms = MatrixClientPeg.get().getRooms();
|
2018-01-04 14:50:33 +03:00
|
|
|
}
|
2018-01-15 17:42:41 +03:00
|
|
|
this._delayedRefreshRoomList();
|
2017-11-29 19:35:16 +03:00
|
|
|
},
|
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
refreshRoomList: function() {
|
2017-04-26 20:59:16 +03:00
|
|
|
// TODO: ideally we'd calculate this once at start, and then maintain
|
|
|
|
// any changes to it incrementally, updating the appropriate sublists
|
|
|
|
// as needed.
|
|
|
|
// Alternatively we'd do something magical with Immutable.js or similar.
|
|
|
|
const lists = this.getRoomLists();
|
|
|
|
let totalRooms = 0;
|
|
|
|
for (const l of Object.values(lists)) {
|
|
|
|
totalRooms += l.length;
|
|
|
|
}
|
|
|
|
this.setState({
|
2018-01-26 00:16:03 +03:00
|
|
|
lists,
|
2017-04-26 20:59:16 +03:00
|
|
|
totalRoomCount: totalRooms,
|
2018-01-15 17:42:41 +03:00
|
|
|
// Do this here so as to not render every time the selected tags
|
|
|
|
// themselves change.
|
|
|
|
selectedTags: TagOrderStore.getSelectedTags(),
|
2017-04-26 20:59:16 +03:00
|
|
|
});
|
2017-05-16 16:49:55 +03:00
|
|
|
|
2017-04-15 15:23:52 +03:00
|
|
|
// this._lastRefreshRoomListTs = Date.now();
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
|
|
|
getRoomLists: function() {
|
2018-01-26 00:16:03 +03:00
|
|
|
const lists = RoomListStore.getRoomLists();
|
2015-11-30 19:55:00 +03:00
|
|
|
|
2018-01-26 00:16:03 +03:00
|
|
|
const filteredLists = {};
|
2018-01-03 20:12:31 +03:00
|
|
|
|
2018-02-06 12:55:58 +03:00
|
|
|
const isRoomVisible = {
|
|
|
|
// $roomId: true,
|
|
|
|
};
|
|
|
|
|
|
|
|
this._visibleRooms.forEach((r) => {
|
|
|
|
isRoomVisible[r.roomId] = true;
|
|
|
|
});
|
|
|
|
|
2018-01-26 00:16:03 +03:00
|
|
|
Object.keys(lists).forEach((tagName) => {
|
2018-02-16 20:11:04 +03:00
|
|
|
const filteredRooms = lists[tagName].filter((taggedRoom) => {
|
2018-01-26 00:16:03 +03:00
|
|
|
// Somewhat impossible, but guard against it anyway
|
|
|
|
if (!taggedRoom) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
const me = taggedRoom.getMember(MatrixClientPeg.get().credentials.userId);
|
|
|
|
if (HIDE_CONFERENCE_CHANS && Rooms.isConfCallRoom(taggedRoom, me, this.props.ConferenceHandler)) {
|
|
|
|
return;
|
2016-08-11 18:45:19 +03:00
|
|
|
}
|
2017-04-18 04:43:29 +03:00
|
|
|
|
2018-02-12 21:35:13 +03:00
|
|
|
return Boolean(isRoomVisible[taggedRoom.roomId]);
|
2018-01-26 00:16:03 +03:00
|
|
|
});
|
2018-03-21 15:00:56 +03:00
|
|
|
|
2018-02-16 20:11:04 +03:00
|
|
|
if (filteredRooms.length > 0 || tagName.match(STANDARD_TAGS_REGEX)) {
|
|
|
|
filteredLists[tagName] = filteredRooms;
|
|
|
|
}
|
2018-01-26 00:16:03 +03:00
|
|
|
});
|
2017-04-26 20:59:16 +03:00
|
|
|
|
2018-01-26 00:16:03 +03:00
|
|
|
return filteredLists;
|
2015-11-30 19:55:00 +03:00
|
|
|
},
|
|
|
|
|
2015-12-17 05:49:09 +03:00
|
|
|
_getScrollNode: function() {
|
2017-05-18 19:33:32 +03:00
|
|
|
if (!this.mounted) return null;
|
2017-10-11 19:56:17 +03:00
|
|
|
const panel = ReactDOM.findDOMNode(this);
|
2015-12-17 05:49:09 +03:00
|
|
|
if (!panel) return null;
|
|
|
|
|
2017-05-18 21:03:51 +03:00
|
|
|
if (panel.classList.contains('gm-prevented')) {
|
|
|
|
return panel;
|
|
|
|
} else {
|
|
|
|
return panel.children[2]; // XXX: Fragile!
|
|
|
|
}
|
2015-12-17 05:49:09 +03:00
|
|
|
},
|
|
|
|
|
2016-08-25 21:46:01 +03:00
|
|
|
_whenScrolling: function(e) {
|
2016-09-03 14:44:55 +03:00
|
|
|
this._hideTooltip(e);
|
2015-12-17 05:49:09 +03:00
|
|
|
this._repositionIncomingCallBox(e, false);
|
2016-08-26 17:09:13 +03:00
|
|
|
this._updateStickyHeaders(false);
|
2015-12-17 05:49:09 +03:00
|
|
|
},
|
|
|
|
|
2016-09-03 14:44:55 +03:00
|
|
|
_hideTooltip: function(e) {
|
|
|
|
// Hide tooltip when scrolling, as we'll no longer be over the one we were on
|
|
|
|
if (this.tooltip && this.tooltip.style.display !== "none") {
|
|
|
|
this.tooltip.style.display = "none";
|
2015-12-17 05:49:09 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
_repositionIncomingCallBox: function(e, firstTime) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const incomingCallBox = document.getElementById("incomingCallBox");
|
2015-12-17 05:49:09 +03:00
|
|
|
if (incomingCallBox && incomingCallBox.parentElement) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollArea = this._getScrollNode();
|
2017-05-18 19:33:32 +03:00
|
|
|
if (!scrollArea) return;
|
2016-09-15 16:39:34 +03:00
|
|
|
// Use the offset of the top of the scroll area from the window
|
|
|
|
// as this is used to calculate the CSS fixed top position for the stickies
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollAreaOffset = scrollArea.getBoundingClientRect().top + window.pageYOffset;
|
2017-04-22 19:28:28 +03:00
|
|
|
// Use the offset of the top of the component from the window
|
2016-09-15 17:33:08 +03:00
|
|
|
// as this is used to calculate the CSS fixed top position for the stickies
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollAreaHeight = ReactDOM.findDOMNode(this).getBoundingClientRect().height;
|
2016-09-15 16:39:34 +03:00
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
let top = (incomingCallBox.parentElement.getBoundingClientRect().top + window.pageYOffset);
|
2016-09-15 17:33:08 +03:00
|
|
|
// Make sure we don't go too far up, if the headers aren't sticky
|
|
|
|
top = (top < scrollAreaOffset) ? scrollAreaOffset : top;
|
|
|
|
// make sure we don't go too far down, if the headers aren't sticky
|
2017-10-11 19:56:17 +03:00
|
|
|
const bottomMargin = scrollAreaOffset + (scrollAreaHeight - 45);
|
2016-09-15 17:33:08 +03:00
|
|
|
top = (top > bottomMargin) ? bottomMargin : top;
|
2016-02-19 05:21:17 +03:00
|
|
|
|
2015-12-17 05:49:09 +03:00
|
|
|
incomingCallBox.style.top = top + "px";
|
2016-09-15 17:33:08 +03:00
|
|
|
incomingCallBox.style.left = scrollArea.offsetLeft + scrollArea.offsetWidth + 12 + "px";
|
2015-11-30 19:55:00 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2016-08-30 14:29:25 +03:00
|
|
|
// Doing the sticky headers as raw DOM, for speed, as it gets very stuttery if done
|
2016-08-30 12:45:17 +03:00
|
|
|
// properly through React
|
2016-08-26 17:09:13 +03:00
|
|
|
_initAndPositionStickyHeaders: function(initialise, scrollToPosition) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollArea = this._getScrollNode();
|
2017-05-18 19:33:32 +03:00
|
|
|
if (!scrollArea) return;
|
2016-08-28 13:39:47 +03:00
|
|
|
// Use the offset of the top of the scroll area from the window
|
|
|
|
// as this is used to calculate the CSS fixed top position for the stickies
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollAreaOffset = scrollArea.getBoundingClientRect().top + window.pageYOffset;
|
2017-05-18 21:03:51 +03:00
|
|
|
// Use the offset of the top of the componet from the window
|
2016-08-28 21:18:41 +03:00
|
|
|
// as this is used to calculate the CSS fixed top position for the stickies
|
2017-10-11 19:56:17 +03:00
|
|
|
const scrollAreaHeight = ReactDOM.findDOMNode(this).getBoundingClientRect().height;
|
2016-08-25 21:46:01 +03:00
|
|
|
|
2016-08-26 11:56:07 +03:00
|
|
|
if (initialise) {
|
2016-08-30 12:45:17 +03:00
|
|
|
// Get a collection of sticky header containers references
|
|
|
|
this.stickies = document.getElementsByClassName("mx_RoomSubList_labelContainer");
|
2016-08-26 13:01:04 +03:00
|
|
|
|
2016-08-30 17:22:52 +03:00
|
|
|
if (!this.stickies.length) return;
|
|
|
|
|
2016-08-30 14:29:25 +03:00
|
|
|
// Make sure there is sufficient space to do sticky headers: 120px plus all the sticky headers
|
2016-08-30 12:45:17 +03:00
|
|
|
this.scrollAreaSufficient = (120 + (this.stickies[0].getBoundingClientRect().height * this.stickies.length)) < scrollAreaHeight;
|
2016-08-26 13:01:04 +03:00
|
|
|
|
2016-08-26 17:52:57 +03:00
|
|
|
// Initialise the sticky headers
|
2016-08-30 12:45:17 +03:00
|
|
|
if (typeof this.stickies === "object" && this.stickies.length > 0) {
|
2016-08-28 14:02:20 +03:00
|
|
|
// Initialise the sticky headers
|
2016-08-30 12:45:17 +03:00
|
|
|
Array.prototype.forEach.call(this.stickies, function(sticky, i) {
|
2016-08-28 14:02:20 +03:00
|
|
|
// Save the positions of all the stickies within scroll area.
|
|
|
|
// These positions are relative to the LHS Panel top
|
|
|
|
sticky.dataset.originalPosition = sticky.offsetTop - scrollArea.offsetTop;
|
|
|
|
|
|
|
|
// Save and set the sticky heights
|
2017-10-11 19:56:17 +03:00
|
|
|
const originalHeight = sticky.getBoundingClientRect().height;
|
2016-08-28 14:02:20 +03:00
|
|
|
sticky.dataset.originalHeight = originalHeight;
|
|
|
|
sticky.style.height = originalHeight;
|
|
|
|
|
|
|
|
return sticky;
|
|
|
|
});
|
2016-08-25 21:46:01 +03:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
|
|
|
let scrollStuckOffset = 0;
|
2016-08-28 21:18:41 +03:00
|
|
|
// Scroll to the passed in position, i.e. a header was clicked and in a scroll to state
|
|
|
|
// rather than a collapsable one (see RoomSubList.isCollapsableOnClick method for details)
|
2016-08-26 17:09:13 +03:00
|
|
|
if (scrollToPosition !== undefined) {
|
|
|
|
scrollArea.scrollTop = scrollToPosition;
|
2016-08-26 16:36:39 +03:00
|
|
|
}
|
2016-08-26 17:52:57 +03:00
|
|
|
// Stick headers to top and bottom, or free them
|
2016-08-30 12:45:17 +03:00
|
|
|
Array.prototype.forEach.call(this.stickies, function(sticky, i, stickyWrappers) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const stickyPosition = sticky.dataset.originalPosition;
|
|
|
|
const stickyHeight = sticky.dataset.originalHeight;
|
|
|
|
const stickyHeader = sticky.childNodes[0];
|
|
|
|
const topStuckHeight = stickyHeight * i;
|
|
|
|
const bottomStuckHeight = stickyHeight * (stickyWrappers.length - i);
|
2016-08-25 21:46:01 +03:00
|
|
|
|
2016-08-26 17:52:57 +03:00
|
|
|
if (self.scrollAreaSufficient && stickyPosition < (scrollArea.scrollTop + topStuckHeight)) {
|
2016-08-25 21:46:01 +03:00
|
|
|
// Top stickies
|
2016-08-26 16:36:39 +03:00
|
|
|
sticky.dataset.stuck = "top";
|
2016-08-25 21:46:01 +03:00
|
|
|
stickyHeader.classList.add("mx_RoomSubList_fixed");
|
2016-08-26 20:31:02 +03:00
|
|
|
stickyHeader.style.top = scrollAreaOffset + topStuckHeight + "px";
|
2016-08-26 17:52:57 +03:00
|
|
|
// If stuck at top adjust the scroll back down to take account of all the stuck headers
|
2016-08-26 17:36:16 +03:00
|
|
|
if (scrollToPosition !== undefined && stickyPosition === scrollToPosition) {
|
|
|
|
scrollStuckOffset = topStuckHeight;
|
|
|
|
}
|
2016-08-28 21:18:41 +03:00
|
|
|
} else if (self.scrollAreaSufficient && stickyPosition > ((scrollArea.scrollTop + scrollAreaHeight) - bottomStuckHeight)) {
|
2016-08-25 21:46:01 +03:00
|
|
|
/// Bottom stickies
|
2016-08-26 16:36:39 +03:00
|
|
|
sticky.dataset.stuck = "bottom";
|
2016-08-25 21:46:01 +03:00
|
|
|
stickyHeader.classList.add("mx_RoomSubList_fixed");
|
2016-08-26 20:31:02 +03:00
|
|
|
stickyHeader.style.top = (scrollAreaOffset + scrollAreaHeight) - bottomStuckHeight + "px";
|
2016-08-25 21:46:01 +03:00
|
|
|
} else {
|
|
|
|
// Not sticky
|
2016-08-26 16:36:39 +03:00
|
|
|
sticky.dataset.stuck = "none";
|
2016-08-25 21:46:01 +03:00
|
|
|
stickyHeader.classList.remove("mx_RoomSubList_fixed");
|
|
|
|
stickyHeader.style.top = null;
|
|
|
|
}
|
|
|
|
});
|
2016-08-26 17:52:57 +03:00
|
|
|
// Adjust the scroll to take account of top stuck headers
|
2016-08-26 17:09:13 +03:00
|
|
|
if (scrollToPosition !== undefined) {
|
|
|
|
scrollArea.scrollTop -= scrollStuckOffset;
|
|
|
|
}
|
2016-08-25 21:46:01 +03:00
|
|
|
},
|
|
|
|
|
2016-08-26 17:09:13 +03:00
|
|
|
_updateStickyHeaders: function(initialise, scrollToPosition) {
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
2016-08-25 21:46:01 +03:00
|
|
|
|
2016-08-26 11:56:07 +03:00
|
|
|
if (initialise) {
|
2016-08-26 13:01:04 +03:00
|
|
|
// Useing setTimeout to ensure that the code is run after the painting
|
|
|
|
// of the newly rendered object as using requestAnimationFrame caused
|
|
|
|
// artefacts to appear on screen briefly
|
|
|
|
window.setTimeout(function() {
|
2016-08-26 17:09:13 +03:00
|
|
|
self._initAndPositionStickyHeaders(initialise, scrollToPosition);
|
2016-08-25 21:46:01 +03:00
|
|
|
});
|
|
|
|
} else {
|
2016-08-26 17:09:13 +03:00
|
|
|
this._initAndPositionStickyHeaders(initialise, scrollToPosition);
|
2016-08-25 21:46:01 +03:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2016-01-22 18:46:38 +03:00
|
|
|
onShowMoreRooms: function() {
|
|
|
|
// kick gemini in the balls to get it to wake up
|
|
|
|
// XXX: uuuuuuugh.
|
2018-03-21 18:58:14 +03:00
|
|
|
if (!this._gemScroll) return;
|
|
|
|
this._gemScroll.forceUpdate();
|
2016-01-22 18:46:38 +03:00
|
|
|
},
|
|
|
|
|
2017-04-26 20:59:16 +03:00
|
|
|
_getEmptyContent: function(section) {
|
2017-11-29 19:35:16 +03:00
|
|
|
if (this.state.selectedTags.length > 0) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2017-05-04 20:08:04 +03:00
|
|
|
const RoomDropTarget = sdk.getComponent('rooms.RoomDropTarget');
|
|
|
|
|
|
|
|
if (this.props.collapsed) {
|
|
|
|
return <RoomDropTarget label="" />;
|
|
|
|
}
|
|
|
|
|
2017-05-05 16:25:18 +03:00
|
|
|
const StartChatButton = sdk.getComponent('elements.StartChatButton');
|
|
|
|
const RoomDirectoryButton = sdk.getComponent('elements.RoomDirectoryButton');
|
|
|
|
const CreateRoomButton = sdk.getComponent('elements.CreateRoomButton');
|
2017-05-30 18:14:27 +03:00
|
|
|
|
2018-02-15 17:11:45 +03:00
|
|
|
let tip = null;
|
|
|
|
|
2017-05-30 18:14:27 +03:00
|
|
|
switch (section) {
|
|
|
|
case 'im.vector.fake.direct':
|
2018-02-15 17:11:45 +03:00
|
|
|
tip = <div className="mx_RoomList_emptySubListTip">
|
2017-11-13 22:19:33 +03:00
|
|
|
{ _t(
|
2017-06-19 19:20:16 +03:00
|
|
|
"Press <StartChatButton> to start a chat with someone",
|
2017-11-13 22:19:33 +03:00
|
|
|
{},
|
2017-11-14 22:09:52 +03:00
|
|
|
{ 'StartChatButton': <StartChatButton size="16" callout={true} /> },
|
2017-10-11 19:56:17 +03:00
|
|
|
) }
|
2017-05-30 18:14:27 +03:00
|
|
|
</div>;
|
2018-02-15 17:11:45 +03:00
|
|
|
break;
|
2017-05-30 18:14:27 +03:00
|
|
|
case 'im.vector.fake.recent':
|
2018-02-15 17:11:45 +03:00
|
|
|
tip = <div className="mx_RoomList_emptySubListTip">
|
2017-11-13 22:19:33 +03:00
|
|
|
{ _t(
|
2017-06-19 19:20:16 +03:00
|
|
|
"You're not in any rooms yet! Press <CreateRoomButton> to make a room or"+
|
2017-06-19 19:22:23 +03:00
|
|
|
" <RoomDirectoryButton> to browse the directory",
|
2017-11-13 22:19:33 +03:00
|
|
|
{},
|
|
|
|
{
|
2017-11-14 22:09:52 +03:00
|
|
|
'CreateRoomButton': <CreateRoomButton size="16" callout={true} />,
|
|
|
|
'RoomDirectoryButton': <RoomDirectoryButton size="16" callout={true} />,
|
2017-11-13 22:19:33 +03:00
|
|
|
},
|
2017-10-11 19:56:17 +03:00
|
|
|
) }
|
2017-05-30 18:14:27 +03:00
|
|
|
</div>;
|
2018-02-15 17:11:45 +03:00
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (tip) {
|
|
|
|
return <div className="mx_RoomList_emptySubListTip_container">
|
|
|
|
{ tip }
|
|
|
|
</div>;
|
2017-04-26 20:59:16 +03:00
|
|
|
}
|
|
|
|
|
2017-06-01 12:08:02 +03:00
|
|
|
// We don't want to display drop targets if there are no room tiles to drag'n'drop
|
2017-05-25 15:55:37 +03:00
|
|
|
if (this.state.totalRoomCount === 0) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2017-06-19 19:49:22 +03:00
|
|
|
const labelText = phraseForSection(section);
|
2017-04-26 20:59:16 +03:00
|
|
|
|
2017-04-28 13:20:29 +03:00
|
|
|
return <RoomDropTarget label={labelText} />;
|
2017-04-26 20:59:16 +03:00
|
|
|
},
|
|
|
|
|
2017-05-04 15:55:52 +03:00
|
|
|
_getHeaderItems: function(section) {
|
2017-05-05 16:25:18 +03:00
|
|
|
const StartChatButton = sdk.getComponent('elements.StartChatButton');
|
|
|
|
const RoomDirectoryButton = sdk.getComponent('elements.RoomDirectoryButton');
|
|
|
|
const CreateRoomButton = sdk.getComponent('elements.CreateRoomButton');
|
2017-05-04 15:55:52 +03:00
|
|
|
switch (section) {
|
|
|
|
case 'im.vector.fake.direct':
|
|
|
|
return <span className="mx_RoomList_headerButtons">
|
2017-05-05 19:51:14 +03:00
|
|
|
<StartChatButton size="16" />
|
2017-05-04 15:55:52 +03:00
|
|
|
</span>;
|
|
|
|
case 'im.vector.fake.recent':
|
|
|
|
return <span className="mx_RoomList_headerButtons">
|
2017-05-05 19:51:14 +03:00
|
|
|
<RoomDirectoryButton size="16" />
|
|
|
|
<CreateRoomButton size="16" />
|
2017-05-04 15:55:52 +03:00
|
|
|
</span>;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2017-08-18 13:22:50 +03:00
|
|
|
_makeGroupInviteTiles() {
|
|
|
|
const ret = [];
|
|
|
|
|
|
|
|
const GroupInviteTile = sdk.getComponent('groups.GroupInviteTile');
|
|
|
|
for (const group of MatrixClientPeg.get().getGroups()) {
|
|
|
|
if (group.myMembership !== 'invite') continue;
|
|
|
|
|
|
|
|
ret.push(<GroupInviteTile key={group.groupId} group={group} />);
|
|
|
|
}
|
|
|
|
|
|
|
|
return ret;
|
|
|
|
},
|
|
|
|
|
2018-03-21 18:58:14 +03:00
|
|
|
_collectGemini(gemScroll) {
|
|
|
|
this._gemScroll = gemScroll;
|
|
|
|
},
|
|
|
|
|
2015-11-30 19:55:00 +03:00
|
|
|
render: function() {
|
2017-08-18 13:22:50 +03:00
|
|
|
const RoomSubList = sdk.getComponent('structures.RoomSubList');
|
2018-03-21 15:00:56 +03:00
|
|
|
const GeminiScrollbarWrapper = sdk.getComponent("elements.GeminiScrollbarWrapper");
|
2017-08-18 13:22:50 +03:00
|
|
|
|
2017-10-11 19:56:17 +03:00
|
|
|
const self = this;
|
2015-11-30 19:55:00 +03:00
|
|
|
return (
|
2018-03-21 15:00:56 +03:00
|
|
|
<GeminiScrollbarWrapper className="mx_RoomList_scrollbar"
|
2018-03-21 18:58:14 +03:00
|
|
|
autoshow={true} onScroll={self._whenScrolling} wrappedRef={this._collectGemini}>
|
2018-01-25 23:58:35 +03:00
|
|
|
<div className="mx_RoomList">
|
|
|
|
<RoomSubList list={[]}
|
|
|
|
extraTiles={this._makeGroupInviteTiles()}
|
|
|
|
label={_t('Community Invites')}
|
|
|
|
editable={false}
|
|
|
|
order="recent"
|
|
|
|
isInvite={true}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['im.vector.fake.invite']}
|
|
|
|
label={_t('Invites')}
|
|
|
|
editable={false}
|
|
|
|
order="recent"
|
|
|
|
isInvite={true}
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms}
|
|
|
|
/>
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['m.favourite']}
|
|
|
|
label={_t('Favourites')}
|
|
|
|
tagName="m.favourite"
|
|
|
|
emptyContent={this._getEmptyContent('m.favourite')}
|
|
|
|
editable={true}
|
|
|
|
order="manual"
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['im.vector.fake.direct']}
|
|
|
|
label={_t('People')}
|
|
|
|
tagName="im.vector.fake.direct"
|
|
|
|
emptyContent={this._getEmptyContent('im.vector.fake.direct')}
|
|
|
|
headerItems={this._getHeaderItems('im.vector.fake.direct')}
|
|
|
|
editable={true}
|
|
|
|
order="recent"
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
alwaysShowHeader={true}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['im.vector.fake.recent']}
|
|
|
|
label={_t('Rooms')}
|
|
|
|
editable={true}
|
|
|
|
emptyContent={this._getEmptyContent('im.vector.fake.recent')}
|
|
|
|
headerItems={this._getHeaderItems('im.vector.fake.recent')}
|
|
|
|
order="recent"
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />
|
|
|
|
|
|
|
|
{ Object.keys(self.state.lists).map((tagName) => {
|
2018-02-16 20:11:04 +03:00
|
|
|
if (!tagName.match(STANDARD_TAGS_REGEX)) {
|
2018-01-25 23:58:35 +03:00
|
|
|
return <RoomSubList list={self.state.lists[tagName]}
|
|
|
|
key={tagName}
|
|
|
|
label={tagName}
|
|
|
|
tagName={tagName}
|
|
|
|
emptyContent={this._getEmptyContent(tagName)}
|
|
|
|
editable={true}
|
|
|
|
order="manual"
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />;
|
|
|
|
}
|
|
|
|
}) }
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['m.lowpriority']}
|
|
|
|
label={_t('Low priority')}
|
|
|
|
tagName="m.lowpriority"
|
|
|
|
emptyContent={this._getEmptyContent('m.lowpriority')}
|
|
|
|
editable={true}
|
|
|
|
order="recent"
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onHeaderClick={self.onSubListHeaderClick}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />
|
|
|
|
|
|
|
|
<RoomSubList list={self.state.lists['im.vector.fake.archived']}
|
|
|
|
label={_t('Historical')}
|
|
|
|
editable={false}
|
|
|
|
order="recent"
|
|
|
|
collapsed={self.props.collapsed}
|
|
|
|
alwaysShowHeader={true}
|
|
|
|
startAsHidden={true}
|
|
|
|
showSpinner={self.state.isLoadingLeftRooms}
|
|
|
|
onHeaderClick= {self.onArchivedHeaderClick}
|
|
|
|
incomingCall={self.state.incomingCall}
|
|
|
|
searchFilter={self.props.searchFilter}
|
|
|
|
onShowMoreRooms={self.onShowMoreRooms} />
|
|
|
|
</div>
|
2018-03-21 15:00:56 +03:00
|
|
|
</GeminiScrollbarWrapper>
|
2015-11-30 19:55:00 +03:00
|
|
|
);
|
2017-10-11 19:56:17 +03:00
|
|
|
},
|
2015-12-04 17:24:02 +03:00
|
|
|
});
|