From 35a108eecc68af4a40e8f8ba15e2fa2dc53816b1 Mon Sep 17 00:00:00 2001
From: Luke Barnard <luke@matrix.org>
Date: Wed, 6 Dec 2017 14:17:26 +0000
Subject: [PATCH] Simplify render of TagPanel - remove sorting

---
 src/components/structures/TagPanel.js | 24 ++++++++++--------------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/src/components/structures/TagPanel.js b/src/components/structures/TagPanel.js
index ff3fd65f0c..d488d57b4d 100644
--- a/src/components/structures/TagPanel.js
+++ b/src/components/structures/TagPanel.js
@@ -32,7 +32,7 @@ const TagPanel = React.createClass({
 
     getInitialState() {
         return {
-            joinedGroupProfiles: [],
+            orderedGroupTagProfiles: [],
             selectedTags: [],
         };
     },
@@ -53,8 +53,13 @@ const TagPanel = React.createClass({
             if (this.unmounted) {
                 return;
             }
-            this.setState({
-                orderedTags: TagOrderStore.getOrderedTags(),
+
+            const orderedTags = TagOrderStore.getOrderedTags() || TagOrderStore.getAllTags();
+            const orderedGroupTags = orderedTags.filter((t) => t[0] === '+');
+            Promise.all(orderedGroupTags.map(
+                (groupId) => FlairStore.getGroupProfileCached(this.context.matrixClient, groupId),
+            )).then((orderedGroupTagProfiles) => {
+                this.setState({orderedGroupTagProfiles});
             });
         });
 
@@ -84,16 +89,13 @@ const TagPanel = React.createClass({
     },
 
     async _fetchJoinedRooms() {
+        // This could be done by anything with a matrix client (, see TagOrderStore).
         const joinedGroupResponse = await this.context.matrixClient.getJoinedGroups();
         const joinedGroupIds = joinedGroupResponse.groups;
-        const joinedGroupProfiles = await Promise.all(joinedGroupIds.map(
-            (groupId) => FlairStore.getGroupProfileCached(this.context.matrixClient, groupId),
-        ));
         dis.dispatch({
             action: 'all_tags',
             tags: joinedGroupIds,
         });
-        this.setState({joinedGroupProfiles});
     },
 
     render() {
@@ -101,13 +103,7 @@ const TagPanel = React.createClass({
         const TintableSvg = sdk.getComponent('elements.TintableSvg');
         const DNDTagTile = sdk.getComponent('elements.DNDTagTile');
 
-        const orderedGroupProfiles = this.state.orderedTags ?
-            this.state.joinedGroupProfiles.sort((a, b) =>
-                this.state.orderedTags.indexOf(a.groupId) -
-                this.state.orderedTags.indexOf(b.groupId),
-            ) : this.state.joinedGroupProfiles;
-
-        const tags = orderedGroupProfiles.map((groupProfile, index) => {
+        const tags = this.state.orderedGroupTagProfiles.map((groupProfile, index) => {
             return <DNDTagTile
                 key={groupProfile.groupId + '_' + index}
                 groupProfile={groupProfile}