Merging performance branch into master (#4268)

* improve performance on sendNotifications

* Fix SQL queries

* Remove get direct profiles, not needed anymore

* Add raw data to error details if AppError fails to decode

* men

* Fix decode (#4052)

* Fixing json decode

* Adding unit test

* Initial work for client scaling (#4051)

* Begin adding paging to profiles API

* Added more paging functionality

* Finish hooking up admin console user lists

* Add API for searching users and add searching to all user lists

* Add lazy loading of profiles

* Revert config.json

* Fix unit tests and some style issues

* Add GetProfilesFromList to Go driver and fix web unit test

* Update etag for GetProfiles

* Updating ui for filters and pagination (#4044)

* Updating UI for pagination

* Adjusting margins for filter row

* Adjusting margin for specific modals

* Adding relative padding to system console

* Adjusting responsive view

* Update client user tests

* Minor fixes for direct messages modal (#4056)

* Remove some unneeded initial load calls (#4057)

* UX updates to user lists, added smart counts and bug fixes (#4059)

* Improved getExplicitMentions and unit tests (#4064)

* Refactor getting posts to lazy load profiles correctly (#4062)

* Comment out SetActiveChannel test (#4066)

* Profiler cpu, block, and memory profiler. (#4081)

* Fix TestSetActiveChannel unit test (#4071)

* Fixing build failure caused by dependancies updating (#4076)

* Adding profiler

* Fix admin_team_member_dropdown eslint errors

* Bumping session cache size (#4077)

* Bumping session cache size

* Bumping status cache

* Refactor how the client handles channel members to be large team friendly (#4106)

* Refactor how the client handles channel members to be large team friendly

* Change Id to ChannelId in ChannelStats model

* Updated getChannelMember and getProfilesByIds routes to match proposal

* Performance improvements (#4100)

* Performance improvements

* Fixing re-connect issue

* Fixing error message

* Some other minor perf tweaks

* Some other minor perf tweaks

* Fixing config file

* Fixing buffer size

* Fixing web socket send message

* adding some error logging

* fix getMe to be user required

* Fix websocket event for new user

* Fixing shutting down

* Reverting web socket changes

* Fixing logging lvl

* Adding caching to GetMember

* Adding some logging

* Fixing caching

* Fixing caching invalidate

* Fixing direct message caching

* Fixing caching

* Fixing caching

* Remove GetDirectProfiles from initial load

* Adding logging and fixing websocket client

* Adding back caching from bad merge.

* Explicitly close go driver requests (#4162)

* Refactored how the client handles team members to be more large team friendly (#4159)

* Refactor getProfilesForDirectMessageList API into getAllProfiles API

* Refactored how the client handles team members to be more large team friendly

* Fix js error when receiving a notification

* Fix JS error caused by current user being overwritten with sanitized version (#4165)

* Adding error message to status failure (#4167)

* Fix a few bugs caused by client scaling refactoring (#4170)

* When there is no read replica, don't open a second set of connections to the master database (#4173)

* Adding connection tacking to stats (#4174)

* Reduce DB writes for statuses and other status related changes (#4175)

* Fix bug preventing opening of DM channels from more modal (#4181)

* 	Fixing socket timing error (#4183)

* Fixing ping/pong handler

* Fixing socket timing error

* Commenting out status broadcasting

* Removing user status changes

* Removing user status changes

* Removing user status changes

* Removing user status changes

* Adding DoPreComputeJson()

* Performance improvements (#4194)

* * Fix System Console Analytics queries
* Add db.SetConnMaxLifetime to 15 minutes
* Add "net/http/pprof" for profiling
* Add FreeOSMemory() to manually release memory on reload config

* Add flag to enable http profiler

* Fix memory leak (#4197)

* Fix memory leak

* removed unneeded nil assignment

* Fixing go routine leak (#4208)

* Merge fixes

* Merge fix

* Refactored statuses to be queried by the client rather than broadcast by the server (#4212)

* Refactored server code to reduce status broadcasts and to allow getting statuses by IDs

* Refactor client code to periodically fetch statuses

* Add store unit test for getting statuses by ids

* Fix status unit test

* Add getStatusesByIds REST API and move the client over to use that instead of the WebSocket

* Adding multiple threads to websocket hub (#4230)

* Adding multiple threads to websocket hub

* Fixing unit tests

* Fixing so websocket connections from the same user end up in the same… (#4240)

* Fixing so websocket connections from the same user end up in the same list

* Removing old comment

* Refactor user autocomplete to query the server (#4239)

* Add API for autocompleting users

* Converted at mention autocomplete to query server

* Converted user search autocomplete to query server

* Switch autocomplete API naming to use term instead of username

* Split autocomplete API into two, one for channels and for teams

* Fix copy/paste error

* Some final client scaling fixes (#4246)

* Add lazy loading of profiles to integration pages

* Add lazy loading of profiles to emoji page

* Fix JS error when receiving post in select team menu and also clean up channel store

1 files changed, 77 insertions, 89 deletions

diff --git a/webapp/components/channel_invite_modal.jsx b/webapp/components/channel_invite_modal.jsx
index c7c1906a5..99a4b9313 100644
--- a/webapp/components/channel_invite_modal.jsx
+++ b/webapp/components/channel_invite_modal.jsx
@@ -1,124 +1,85 @@
 // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import $ from 'jquery';
 import ChannelInviteButton from './channel_invite_button.jsx';
-import FilteredUserList from './filtered_user_list.jsx';
+import SearchableUserList from './searchable_user_list.jsx';
 import LoadingScreen from './loading_screen.jsx';
 
 import ChannelStore from 'stores/channel_store.jsx';
 import UserStore from 'stores/user_store.jsx';
+import TeamStore from 'stores/team_store.jsx';
+
+import {searchUsers} from 'actions/user_actions.jsx';
 
 import * as Utils from 'utils/utils.jsx';
 import * as AsyncClient from 'utils/async_client.jsx';
 
-import {FormattedMessage} from 'react-intl';
-
+import React from 'react';
 import {Modal} from 'react-bootstrap';
+import {FormattedMessage} from 'react-intl';
 
-import React from 'react';
+const USERS_PER_PAGE = 50;
 
 export default class ChannelInviteModal extends React.Component {
     constructor(props) {
         super(props);
 
-        this.onListenerChange = this.onListenerChange.bind(this);
-        this.getStateFromStores = this.getStateFromStores.bind(this);
+        this.onChange = this.onChange.bind(this);
         this.handleInviteError = this.handleInviteError.bind(this);
+        this.nextPage = this.nextPage.bind(this);
+        this.search = this.search.bind(this);
 
-        this.state = this.getStateFromStores();
-    }
-    shouldComponentUpdate(nextProps, nextState) {
-        if (!this.props.show && !nextProps.show) {
-            return false;
-        }
-
-        if (!Utils.areObjectsEqual(this.props, nextProps)) {
-            return true;
-        }
-
-        if (!Utils.areObjectsEqual(this.state, nextState)) {
-            return true;
-        }
-
-        return false;
-    }
-    getStateFromStores() {
-        const users = UserStore.getActiveOnlyProfiles();
-
-        if ($.isEmptyObject(users)) {
-            return {
-                loading: true
-            };
-        }
-
-        // make sure we have all members of this channel before rendering
-        const extraInfo = ChannelStore.getCurrentExtraInfo();
-        if (extraInfo.member_count !== extraInfo.members.length) {
-            AsyncClient.getChannelExtraInfo(this.props.channel.id, -1);
-
-            return {
-                loading: true
-            };
-        }
-
-        const currentUser = UserStore.getCurrentUser();
-        if (!currentUser) {
-            return {
-                loading: true
-            };
-        }
-
-        const currentMember = ChannelStore.getCurrentMember();
-        if (!currentMember) {
-            return {
-                loading: true
-            };
-        }
+        this.term = '';
 
-        const memberIds = extraInfo.members.map((user) => user.id);
+        const channelStats = ChannelStore.getStats(props.channel.id);
+        const teamStats = TeamStore.getCurrentStats();
 
-        var nonmembers = [];
-        for (var id in users) {
-            if (memberIds.indexOf(id) === -1) {
-                nonmembers.push(users[id]);
-            }
-        }
-
-        nonmembers.sort((a, b) => {
-            return a.username.localeCompare(b.username);
-        });
-
-        return {
-            nonmembers,
-            loading: false,
-            currentUser,
-            currentMember
+        this.state = {
+            users: [],
+            total: teamStats.member_count - channelStats.member_count,
+            search: false
         };
     }
+
     componentWillReceiveProps(nextProps) {
         if (!this.props.show && nextProps.show) {
-            ChannelStore.addExtraInfoChangeListener(this.onListenerChange);
-            ChannelStore.addChangeListener(this.onListenerChange);
-            UserStore.addChangeListener(this.onListenerChange);
-            this.onListenerChange();
+            TeamStore.addStatsChangeListener(this.onChange);
+            ChannelStore.addStatsChangeListener(this.onChange);
+            UserStore.addNotInChannelChangeListener(this.onChange);
+            UserStore.addStatusesChangeListener(this.onChange);
+
+            this.onChange();
+            AsyncClient.getProfilesNotInChannel(this.props.channel.id, 0);
+            AsyncClient.getTeamStats(TeamStore.getCurrentId());
         } else if (this.props.show && !nextProps.show) {
-            ChannelStore.removeExtraInfoChangeListener(this.onListenerChange);
-            ChannelStore.removeChangeListener(this.onListenerChange);
-            UserStore.removeChangeListener(this.onListenerChange);
+            TeamStore.removeStatsChangeListener(this.onChange);
+            ChannelStore.removeStatsChangeListener(this.onChange);
+            UserStore.removeNotInChannelChangeListener(this.onChange);
+            UserStore.removeStatusesChangeListener(this.onChange);
         }
     }
+
     componentWillUnmount() {
-        ChannelStore.removeExtraInfoChangeListener(this.onListenerChange);
-        ChannelStore.removeChangeListener(this.onListenerChange);
-        UserStore.removeChangeListener(this.onListenerChange);
+        ChannelStore.removeStatsChangeListener(this.onChange);
+        ChannelStore.removeChangeListener(this.onChange);
+        UserStore.removeNotInChannelChangeListener(this.onChange);
     }
-    onListenerChange() {
-        var newState = this.getStateFromStores();
-        if (!Utils.areObjectsEqual(this.state, newState)) {
-            this.setState(newState);
+
+    onChange() {
+        if (this.state.search) {
+            this.search(this.term);
+            return;
         }
+
+        const channelStats = ChannelStore.getStats(this.props.channel.id);
+        const teamStats = TeamStore.getCurrentStats();
+
+        this.setState({
+            users: UserStore.getProfileListNotInChannel(this.props.channel.id),
+            total: teamStats.member_count - channelStats.member_count
+        });
     }
+
     handleInviteError(err) {
         if (err) {
             this.setState({
@@ -130,6 +91,29 @@ export default class ChannelInviteModal extends React.Component {
             });
         }
     }
+
+    nextPage(page) {
+        AsyncClient.getProfilesNotInChannel(this.props.channel.id, (page + 1) * USERS_PER_PAGE, USERS_PER_PAGE);
+    }
+
+    search(term) {
+        this.term = term;
+
+        if (term === '') {
+            this.setState({users: UserStore.getProfileListNotInChannel(), search: false});
+            return;
+        }
+
+        searchUsers(
+            term,
+            TeamStore.getCurrentId(),
+            {not_in_channel: this.props.channel.id},
+            (users) => {
+                this.setState({search: true, users});
+            }
+        );
+    }
+
     render() {
         var inviteError = null;
         if (this.state.inviteError) {
@@ -145,9 +129,13 @@ export default class ChannelInviteModal extends React.Component {
                 maxHeight = Utils.windowHeight() - 300;
             }
             content = (
-                <FilteredUserList
+                <SearchableUserList
                     style={{maxHeight}}
-                    users={this.state.nonmembers}
+                    users={this.state.users}
+                    usersPerPage={USERS_PER_PAGE}
+                    total={this.state.total}
+                    nextPage={this.nextPage}
+                    search={this.search}
                     actions={[ChannelInviteButton]}
                     actionProps={{
                         channel: this.props.channel,