From ca1313099f4db238374f281944710bccd1b2398d Mon Sep 17 00:00:00 2001
From: Travis Ralston <travpc@gmail.com>
Date: Thu, 6 Dec 2018 11:45:58 -0700
Subject: [PATCH] Show the IncomingCallBox if the call is for the RoomSubList

Fixes https://github.com/vector-im/riot-web/issues/4369

Previously the RoomSubList would filter its list of rooms to verify that the incoming call belongs to it. This causes problems when the sub list is being told some rooms don't exist (ie: the list is filtered). It is trivial for the RoomList to instead track which RoomSubList (tag) it should be handing the call off to so we do that instead now. The RoomSubList trusts that the caller has already filtered it and will render the IncomingCallBox if it has an incoming call.
---
 src/components/structures/RoomSubList.js | 15 +++-----
 src/components/views/rooms/RoomList.js   | 45 +++++++++++++++++++-----
 2 files changed, 41 insertions(+), 19 deletions(-)

diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index d798070659..cdeb8926c0 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -327,17 +327,10 @@ const RoomSubList = React.createClass({
 
         let incomingCall;
         if (this.props.incomingCall) {
-            const self = this;
-            // Check if the incoming call is for this section
-            const incomingCallRoom = this.props.list.filter(function(room) {
-                return self.props.incomingCall.roomId === room.roomId;
-            });
-
-            if (incomingCallRoom.length === 1) {
-                const IncomingCallBox = sdk.getComponent("voip.IncomingCallBox");
-                incomingCall =
-                    <IncomingCallBox className="mx_RoomSubList_incomingCall" incomingCall={this.props.incomingCall} />;
-            }
+            // We can assume that if we have an incoming call then it is for this list
+            const IncomingCallBox = sdk.getComponent("voip.IncomingCallBox");
+            incomingCall =
+                <IncomingCallBox className="mx_RoomSubList_incomingCall" incomingCall={this.props.incomingCall} />;
         }
 
         const tabindex = this.props.searchFilter === "" ? "0" : "-1";
diff --git a/src/components/views/rooms/RoomList.js b/src/components/views/rooms/RoomList.js
index 3e632ba8ce..3ad35c036d 100644
--- a/src/components/views/rooms/RoomList.js
+++ b/src/components/views/rooms/RoomList.js
@@ -71,6 +71,7 @@ module.exports = React.createClass({
             isLoadingLeftRooms: false,
             totalRoomCount: null,
             lists: {},
+            incomingCallTag: null,
             incomingCall: null,
             selectedTags: [],
         };
@@ -155,11 +156,13 @@ module.exports = React.createClass({
                 if (call && call.call_state === 'ringing') {
                     this.setState({
                         incomingCall: call,
+                        incomingCallTag: this.getTagNameForRoomId(payload.room_id),
                     });
                     this._repositionIncomingCallBox(undefined, true);
                 } else {
                     this.setState({
                         incomingCall: null,
+                        incomingCallTag: null,
                     });
                 }
                 break;
@@ -328,6 +331,26 @@ module.exports = React.createClass({
         // this._lastRefreshRoomListTs = Date.now();
     },
 
+    getTagNameForRoomId: function(roomId) {
+        const lists = RoomListStore.getRoomLists();
+        for (const tagName of Object.keys(lists)) {
+            for (const room of lists[tagName]) {
+                // Should be impossible, but guard anyways.
+                if (!room) {
+                    continue;
+                }
+                const myUserId = MatrixClientPeg.get().getUserId();
+                if (HIDE_CONFERENCE_CHANS && Rooms.isConfCallRoom(room, myUserId, this.props.ConferenceHandler)) {
+                    continue;
+                }
+
+                if (room.roomId === roomId) return tagName;
+            }
+        }
+
+        return null;
+    },
+
     getRoomLists: function() {
         const lists = RoomListStore.getRoomLists();
 
@@ -621,6 +644,12 @@ module.exports = React.createClass({
         // so checking on every render is the sanest thing at this time.
         const showEmpty = SettingsStore.getValue('RoomSubList.showEmpty');
 
+        const incomingCallIfTaggedAs = (tagName) => {
+            if (!this.state.incomingCall) return null;
+            if (this.state.incomingCallTag !== tagName) return null;
+            return this.state.incomingCall;
+        };
+
         const self = this;
         return (
             <GeminiScrollbarWrapper className="mx_RoomList_scrollbar"
@@ -644,7 +673,7 @@ module.exports = React.createClass({
                              editable={false}
                              order="recent"
                              isInvite={true}
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('im.vector.fake.invite')}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}
@@ -658,7 +687,7 @@ module.exports = React.createClass({
                              emptyContent={this._getEmptyContent('m.favourite')}
                              editable={true}
                              order="manual"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('m.favourite')}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}
@@ -672,7 +701,7 @@ module.exports = React.createClass({
                              headerItems={this._getHeaderItems('im.vector.fake.direct')}
                              editable={true}
                              order="recent"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('im.vector.fake.direct')}
                              collapsed={self.props.collapsed}
                              alwaysShowHeader={true}
                              searchFilter={self.props.searchFilter}
@@ -686,7 +715,7 @@ module.exports = React.createClass({
                              emptyContent={this._getEmptyContent('im.vector.fake.recent')}
                              headerItems={this._getHeaderItems('im.vector.fake.recent')}
                              order="recent"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('im.vector.fake.recent')}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}
@@ -702,7 +731,7 @@ module.exports = React.createClass({
                              emptyContent={this._getEmptyContent(tagName)}
                              editable={true}
                              order="manual"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs(tagName)}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}
@@ -717,7 +746,7 @@ module.exports = React.createClass({
                              emptyContent={this._getEmptyContent('m.lowpriority')}
                              editable={true}
                              order="recent"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('m.lowpriority')}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}
@@ -740,7 +769,7 @@ module.exports = React.createClass({
                              startAsHidden={true}
                              showSpinner={self.state.isLoadingLeftRooms}
                              onHeaderClick={self.onArchivedHeaderClick}
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('im.vector.fake.archived')}
                              searchFilter={self.props.searchFilter}
                              onShowMoreRooms={self.onShowMoreRooms}
                              showEmpty={showEmpty} />
@@ -750,7 +779,7 @@ module.exports = React.createClass({
                              tagName="m.lowpriority"
                              editable={false}
                              order="recent"
-                             incomingCall={self.state.incomingCall}
+                             incomingCall={incomingCallIfTaggedAs('m.server_notice')}
                              collapsed={self.props.collapsed}
                              searchFilter={self.props.searchFilter}
                              onHeaderClick={self.onSubListHeaderClick}