Lazy loading: Lazy load members while backpaginating

src/MatrixClientPeg.js

@@ -34,14 +34,6 @@ interface MatrixClientCreds {
     guest: boolean,
 }
 
-const FILTER_CONTENT = {
-    room: {
-        state: {
-            lazy_load_members: true,
-        },
-    },
-};
-
 /**
  * Wrapper object for handling the js-sdk Matrix Client object in the react-sdk
  * Handles the creation/initialisation of client objects.
@@ -108,7 +100,7 @@ class MatrixClientPeg {
         opts.pendingEventOrdering = "detached";
 
         if (SettingsStore.isFeatureEnabled('feature_lazyloading')) {
-            opts.filter = await this.matrixClient.createFilter(FILTER_CONTENT);
+            opts.lazyLoadMembers = true;
         }
 
         try {
@@ -127,7 +119,7 @@ class MatrixClientPeg {
         MatrixActionCreators.start(this.matrixClient);
 
         console.log(`MatrixClientPeg: really starting MatrixClient`);
-        this.get().startClient(opts);
+        await this.get().startClient(opts);
         console.log(`MatrixClientPeg: MatrixClient started`);
     }
 

src/RoomInvite.js

@@ -194,8 +194,7 @@ function _getDirectMessageRooms(addr) {
     const rooms = dmRooms.filter((dmRoom) => {
         const room = MatrixClientPeg.get().getRoom(dmRoom);
         if (room) {
-            const me = room.getMember(MatrixClientPeg.get().credentials.userId);
-            return me && me.membership == 'join';
+            return room.getMyMembership() === 'join';
         }
     });
     return rooms;

src/VectorConferenceHandler.js

@@ -84,7 +84,7 @@ ConferenceCall.prototype._getConferenceUserRoom = function() {
         preset: "private_chat",
         invite: [this.confUserId]
     }).then(function(res) {
-        return new Room(res.room_id);
+        return new Room(res.room_id, client.getUserId());
     });
 };
 

src/components/structures/RoomView.js

@@ -758,15 +758,13 @@ module.exports = React.createClass({
     },
 
     _updateDMState() {
-        const me = this.state.room.getMember(MatrixClientPeg.get().getUserId());
-        if (!me || me.membership !== "join") {
+        const room = this.state.room;
+        if (room.getMyMembership() != "join") {
             return;
         }
-        const roomId = this.state.room.roomId;
-        const dmInviter = me.getDMInviter();
-
+        const dmInviter = room.getDMInviter();
         if (dmInviter) {
-            Rooms.setDMRoom(roomId, dmInviter);
+            Rooms.setDMRoom(room.roomId, dmInviter);
         }
     },
 

src/components/views/dialogs/ChatCreateOrReuseDialog.js

@@ -54,16 +54,16 @@ export default class ChatCreateOrReuseDialog extends React.Component {
         for (const roomId of dmRooms) {
             const room = client.getRoom(roomId);
             if (room) {
-                const me = room.getMember(client.credentials.userId);
-                const highlight = room.getUnreadNotificationCount('highlight') > 0 || me.membership === "invite";
+                const isInvite = room.getMyMembership() === "invite";
+                const highlight = room.getUnreadNotificationCount('highlight') > 0 || isInvite;
                 tiles.push(
                     <RoomTile key={room.roomId} room={room}
                         transparent={true}
                         collapsed={false}
                         selected={false}
                         unread={Unread.doesRoomHaveUnreadMessages(room)}
                         highlight={highlight}
-                        isInvite={me.membership === "invite"}
+                        isInvite={isInvite}
                         onClick={this.onRoomTileClick}
                     />,
                 );

src/components/views/elements/Pill.js

@@ -187,6 +187,9 @@ const Pill = React.createClass({
                 getContent: () => {
                     return {avatar_url: resp.avatar_url};
                 },
+                getDirectionalContent: function() {
+                    return this.getContent();
+                },
             };
             this.setState({member});
         }).catch((err) => {

src/components/views/rooms/MemberInfo.js

@@ -774,15 +774,15 @@ module.exports = withMatrixClient(React.createClass({
             for (const roomId of dmRooms) {
                 const room = this.props.matrixClient.getRoom(roomId);
                 if (room) {
-                    const me = room.getMember(this.props.matrixClient.credentials.userId);
-
+                    const myMembership = room.getMyMembership();
                     // not a DM room if we have are not joined
-                    if (!me.membership || me.membership !== 'join') continue;
-                    // not a DM room if they are not joined
+                    if (myMembership !== 'join') continue;
+
                     const them = this.props.member;
+                    // not a DM room if they are not joined
                     if (!them.membership || them.membership !== 'join') continue;
 
-                    const highlight = room.getUnreadNotificationCount('highlight') > 0 || me.membership === 'invite';
+                    const highlight = room.getUnreadNotificationCount('highlight') > 0;
 
                     tiles.push(
                         <RoomTile key={room.roomId} room={room}
@@ -791,7 +791,7 @@ module.exports = withMatrixClient(React.createClass({
                             selected={false}
                             unread={Unread.doesRoomHaveUnreadMessages(room)}
                             highlight={highlight}
-                            isInvite={me.membership === "invite"}
+                            isInvite={false}
                             onClick={this.onRoomTileClick}
                         />,
                     );

src/components/views/rooms/RoomTile.js

@@ -243,9 +243,7 @@ module.exports = React.createClass({
     },
 
     render: function() {
-        const myUserId = MatrixClientPeg.get().credentials.userId;
-        const me = this.props.room.currentState.members[myUserId];
-
+        const isInvite = this.props.room.getMyMembership() === "invite";
         const notificationCount = this.state.notificationCount;
         // var highlightCount = this.props.room.getUnreadNotificationCount("highlight");
 
@@ -259,7 +257,7 @@ module.exports = React.createClass({
             'mx_RoomTile_unread': this.props.unread,
             'mx_RoomTile_unreadNotify': notifBadges,
             'mx_RoomTile_highlight': mentionBadges,
-            'mx_RoomTile_invited': (me && me.membership === 'invite'),
+            'mx_RoomTile_invited': isInvite,
             'mx_RoomTile_menuDisplayed': this.state.menuDisplayed,
             'mx_RoomTile_noBadges': !badges,
             'mx_RoomTile_transparent': this.props.transparent,

src/utils/WidgetUtils.js

@@ -77,8 +77,7 @@ export default class WidgetUtils {
             return false;
         }
 
-        const member = room.getMember(me);
-        if (!member || member.membership !== "join") {
+        if (room.getMyMembership() !== "join") {
             console.warn(`User ${me} is not in room ${roomId}`);
             return false;
         }

test/components/views/rooms/RoomList-test.js

@@ -20,15 +20,16 @@ function generateRoomId() {
     return '!' + Math.random().toString().slice(2, 10) + ':domain';
 }
 
-function createRoom(opts) {
-    const room = new Room(generateRoomId());
-    if (opts) {
-        Object.assign(room, opts);
-    }
-    return room;
-}
 
 describe('RoomList', () => {
+    function createRoom(opts) {
+        const room = new Room(generateRoomId(), client.getUserId());
+        if (opts) {
+            Object.assign(room, opts);
+        }
+        return room;
+    }
+
     let parentDiv = null;
     let sandbox = null;
     let client = null;