PLT-4815 Refactor 'More Channels' modal into the new modal pattern (#4742)

* Refactor 'More Channels' modal into the new modal pattern

* Fix unit test

* Readded CSS changes

1 files changed, 17 insertions, 8 deletions

diff --git a/webapp/components/member_list_team.jsx b/webapp/components/member_list_team.jsx
index 768129f1c..a9db0e734 100644
--- a/webapp/components/member_list_team.jsx
+++ b/webapp/components/member_list_team.jsx
@@ -27,6 +27,8 @@ export default class MemberListTeam extends React.Component {
         this.search = this.search.bind(this);
         this.loadComplete = this.loadComplete.bind(this);
 
+        this.searchTimeoutId = 0;
+
         const stats = TeamStore.getCurrentStats();
 
         this.state = {
@@ -86,14 +88,21 @@ export default class MemberListTeam extends React.Component {
             return;
         }
 
-        searchUsers(
-            term,
-            TeamStore.getCurrentId(),
-            {},
-            (users) => {
-                this.setState({loading: true, search: true, users, term, teamMembers: Object.assign([], TeamStore.getMembersInTeam())});
-                loadTeamMembersForProfilesList(users, TeamStore.getCurrentId(), this.loadComplete);
-            }
+        clearTimeout(this.searchTimeoutId);
+
+        this.searchTimeoutId = setTimeout(
+            () => {
+                searchUsers(
+                    term,
+                    TeamStore.getCurrentId(),
+                    {},
+                    (users) => {
+                        this.setState({loading: true, search: true, users, term, teamMembers: Object.assign([], TeamStore.getMembersInTeam())});
+                        loadTeamMembersForProfilesList(users, TeamStore.getCurrentId(), this.loadComplete);
+                    }
+                );
+            },
+            Constants.SEARCH_TIMEOUT_MILLISECONDS
         );
     }