From 91c224aaf40026ab6b6e59459620edba71e8a831 Mon Sep 17 00:00:00 2001
From: Kegan Dougal <kegan@matrix.org>
Date: Wed, 20 Jan 2016 13:41:03 +0000
Subject: [PATCH 1/2] Review comments: Remove stuff which shouldn't have been
 there

---
 src/components/views/rooms/MemberList.js | 6 +-----
 src/components/views/rooms/MemberTile.js | 8 --------
 2 files changed, 1 insertion(+), 13 deletions(-)

diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js
index bf96b51604..4c84b00e70 100644
--- a/src/components/views/rooms/MemberList.js
+++ b/src/components/views/rooms/MemberList.js
@@ -296,7 +296,6 @@ module.exports = React.createClass({
             // member invite (content.third_party_invite.signed.token)
             var room = MatrixClientPeg.get().getRoom(this.props.roomId);
             var EntityTile = sdk.getComponent("rooms.EntityTile");
-            var BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
             if (room) {
                 room.currentState.getStateEvents("m.room.third_party_invite").forEach(
                 function(e) {
@@ -306,12 +305,9 @@ module.exports = React.createClass({
                     if (memberEvent) {
                         return;
                     }
-                    var avatarJsx = (
-                        <BaseAvatar name={e.getContent().display_name} width={36} height={36} />
-                    );
                     memberList.push(
                         <EntityTile key={e.getStateKey()} ref={e.getStateKey()}
-                            name={e.getContent().display_name} avatarJsx={avatarJsx} />
+                            name={e.getContent().display_name} />
                     )
                 })
             }
diff --git a/src/components/views/rooms/MemberTile.js b/src/components/views/rooms/MemberTile.js
index 9136e848f1..d5c124ad21 100644
--- a/src/components/views/rooms/MemberTile.js
+++ b/src/components/views/rooms/MemberTile.js
@@ -79,14 +79,6 @@ module.exports = React.createClass({
         var av = (
             <MemberAvatar member={member} width={36} height={36} />
         );
-        var power;
-        var powerLevel = this.props.member.powerLevel;
-        if (powerLevel >= 50 && powerLevel < 99) {
-            power = <img src="img/mod.svg" className="mx_MemberTile_power" width="16" height="17" alt="Mod"/>;
-        }
-        if (powerLevel >= 99) {
-            power = <img src="img/admin.svg" className="mx_MemberTile_power" width="16" height="17" alt="Admin"/>;
-        }
 
         if (member.user) {
             this.user_last_modified_time = member.user.getLastModifiedTime();

From 391c653d24c56465e15002d320ccba65b455a6a4 Mon Sep 17 00:00:00 2001
From: Kegan Dougal <kegan@matrix.org>
Date: Wed, 20 Jan 2016 14:14:04 +0000
Subject: [PATCH 2/2] Lazy-load the user list to improve perf

Still slow when typing due to adding 1000 tiles to the DOM, but it is at least
a lot better than before (which would stutter on ANY change to the member list)
---
 src/components/views/rooms/EntityTile.js      |  2 +-
 src/components/views/rooms/MemberList.js      | 20 +++++++++++--------
 .../views/rooms/SearchableEntityList.js       |  6 ++++++
 3 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/components/views/rooms/EntityTile.js b/src/components/views/rooms/EntityTile.js
index a0135fb0c3..55629aa8b0 100644
--- a/src/components/views/rooms/EntityTile.js
+++ b/src/components/views/rooms/EntityTile.js
@@ -121,7 +121,7 @@ module.exports = React.createClass({
         var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
         var BaseAvatar = sdk.getComponent('avatars.BaseAvatar');
 
-        var av = this.props.avatarJsx || <BaseAvatar name={name} width={36} height={36} />;
+        var av = this.props.avatarJsx || <BaseAvatar name={this.props.name} width={36} height={36} />;
 
         return (
             <div className={mainClassName} title={ this.props.title }
diff --git a/src/components/views/rooms/MemberList.js b/src/components/views/rooms/MemberList.js
index 4c84b00e70..9d20f5ab55 100644
--- a/src/components/views/rooms/MemberList.js
+++ b/src/components/views/rooms/MemberList.js
@@ -71,8 +71,19 @@ module.exports = React.createClass({
             self.setState({
                 members: self.roomMembers()
             });
+            // Lazy-load the complete user list for inviting new users
+            // TODO: Keep this list bleeding-edge up-to-date. Practically speaking,
+            // it will do for now not being updated as random new users join different
+            // rooms as this list will be reloaded every room swap.
+            var room = MatrixClientPeg.get().getRoom(self.props.roomId);
+            self.userList = MatrixClientPeg.get().getUsers().filter(function(u) {
+                return !room.hasMembershipState(u.userId, "join");
+            });
         }, 50);
 
+        
+        setTimeout
+
         // Attach a SINGLE listener for global presence changes then locate the
         // member tile and re-render it. This is more efficient than every tile
         // evar attaching their own listener.
@@ -323,20 +334,13 @@ module.exports = React.createClass({
                 <Loader />
             );
         } else {
-            // TODO: Cache this calculation
-            var room = MatrixClientPeg.get().getRoom(this.props.roomId);
-            /* var allUsers = MatrixClientPeg.get().getUsers();
-            // only add Users if they are not joined
-            allUsers = allUsers.filter(function(u) {
-                return !room.hasMembershipState(u.userId, "join");
-            }); */
             var SearchableEntityList = sdk.getComponent("rooms.SearchableEntityList");
             
             return (
                 <SearchableEntityList searchPlaceholderText={"Invite / Search"}
                     onSubmit={this.onInvite}
                     onQueryChanged={this.onSearchQueryChanged}
-                    entities={[] /* Entities.fromUsers(allUsers, true, this.onInvite) */} />
+                    entities={Entities.fromUsers(this.userList || [], true, this.onInvite)} />
             );
         }
     },
diff --git a/src/components/views/rooms/SearchableEntityList.js b/src/components/views/rooms/SearchableEntityList.js
index 8657293478..b6232362ac 100644
--- a/src/components/views/rooms/SearchableEntityList.js
+++ b/src/components/views/rooms/SearchableEntityList.js
@@ -50,6 +50,12 @@ var SearchableEntityList = React.createClass({
         };
     },
 
+    componentWillUnmount: function() {
+        // pretend the query box was blanked out else filters could still be
+        // applied to other components which rely on onQueryChanged.
+        this.props.onQueryChanged("");
+    },
+
     /**
      * Public-facing method to set the input query text to the given input.
      * @param {string} input