added getChannelCounts service and refactored the client to more intelligently pull channel data

10 files changed, 340 insertions, 165 deletions

diff --git a/api/channel.go b/api/channel.go
index a3de30377..851816dde 100644
--- a/api/channel.go
+++ b/api/channel.go
@@ -18,6 +18,7 @@ func InitChannel(r *mux.Router) {
 	sr := r.PathPrefix("/channels").Subrouter()
 	sr.Handle("/", ApiUserRequiredActivity(getChannels, false)).Methods("GET")
 	sr.Handle("/more", ApiUserRequired(getMoreChannels)).Methods("GET")
+	sr.Handle("/counts", ApiUserRequiredActivity(getChannelCounts, false)).Methods("GET")
 	sr.Handle("/create", ApiUserRequired(createChannel)).Methods("POST")
 	sr.Handle("/create_direct", ApiUserRequired(createDirectChannel)).Methods("POST")
 	sr.Handle("/update", ApiUserRequired(updateChannel)).Methods("POST")
@@ -315,6 +316,22 @@ func getMoreChannels(c *Context, w http.ResponseWriter, r *http.Request) {
 	}
 }
 
+func getChannelCounts(c *Context, w http.ResponseWriter, r *http.Request) {
+
+	// user is already in the team
+
+	if result := <-Srv.Store.Channel().GetChannelCounts(c.Session.TeamId, c.Session.UserId); result.Err != nil {
+		c.Err = model.NewAppError("getChannelCounts", "Unable to get channel counts from the database", result.Err.Message)
+		return
+	} else if HandleEtag(result.Data.(*model.ChannelCounts).Etag(), w, r) {
+		return
+	} else {
+		data := result.Data.(*model.ChannelCounts)
+		w.Header().Set(model.HEADER_ETAG_SERVER, data.Etag())
+		w.Write([]byte(data.ToJson()))
+	}
+}
+
 func joinChannel(c *Context, w http.ResponseWriter, r *http.Request) {
 
 	params := mux.Vars(r)
diff --git a/model/channel_count.go b/model/channel_count.go
new file mode 100644
index 000000000..05d8401e1
--- /dev/null
+++ b/model/channel_count.go
@@ -0,0 +1,46 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+package model
+
+import (
+	"crypto/md5"
+	"encoding/json"
+	"io"
+	"strconv"
+)
+
+type ChannelCounts struct {
+	Counts map[string]int64 `json:"counts"`
+}
+
+func (o *ChannelCounts) Etag() string {
+	str := ""
+	for id, count := range o.Counts {
+		str += id + strconv.FormatInt(count, 10)
+	}
+
+	data := []byte(str)
+
+	return Etag(md5.Sum(data))
+}
+
+func (o *ChannelCounts) ToJson() string {
+	b, err := json.Marshal(o)
+	if err != nil {
+		return ""
+	} else {
+		return string(b)
+	}
+}
+
+func ChannelCountsFromJson(data io.Reader) *ChannelCounts {
+	decoder := json.NewDecoder(data)
+	var o ChannelCounts
+	err := decoder.Decode(&o)
+	if err == nil {
+		return &o
+	} else {
+		return nil
+	}
+}
diff --git a/store/sql_channel_store.go b/store/sql_channel_store.go
index cac5c681b..6caa6fc70 100644
--- a/store/sql_channel_store.go
+++ b/store/sql_channel_store.go
@@ -281,6 +281,39 @@ func (s SqlChannelStore) GetMoreChannels(teamId string, userId string) StoreChan
 	return storeChannel
 }
 
+type channelIdWithCount struct {
+	Id            string
+	TotalMsgCount int64
+}
+
+func (s SqlChannelStore) GetChannelCounts(teamId string, userId string) StoreChannel {
+	storeChannel := make(StoreChannel)
+
+	go func() {
+		result := StoreResult{}
+
+		var data []channelIdWithCount
+		_, err := s.GetReplica().Select(&data, "SELECT Id, TotalMsgCount FROM Channels WHERE Id IN (SELECT ChannelId FROM ChannelMembers WHERE UserId = :UserId) AND TeamId = :TeamId AND DeleteAt = 0 ORDER BY DisplayName", map[string]interface{}{"TeamId": teamId, "UserId": userId})
+
+		if err != nil {
+			result.Err = model.NewAppError("SqlChannelStore.GetChannelCounts", "We couldn't get the channel counts", "teamId="+teamId+", userId="+userId+", err="+err.Error())
+		} else {
+			counts := &model.ChannelCounts{Counts: make(map[string]int64)}
+			for i := range data {
+				v := data[i]
+				counts.Counts[v.Id] = v.TotalMsgCount
+			}
+
+			result.Data = counts
+		}
+
+		storeChannel <- result
+		close(storeChannel)
+	}()
+
+	return storeChannel
+}
+
 func (s SqlChannelStore) GetByName(teamId string, name string) StoreChannel {
 	storeChannel := make(StoreChannel)
 
diff --git a/store/store.go b/store/store.go
index 0934fe84b..613fe4198 100644
--- a/store/store.go
+++ b/store/store.go
@@ -50,6 +50,7 @@ type ChannelStore interface {
 	GetByName(team_id string, domain string) StoreChannel
 	GetChannels(teamId string, userId string) StoreChannel
 	GetMoreChannels(teamId string, userId string) StoreChannel
+	GetChannelCounts(teamId string, userId string) StoreChannel
 
 	SaveMember(member *model.ChannelMember) StoreChannel
 	GetMembers(channelId string) StoreChannel
diff --git a/web/react/components/more_channels.jsx b/web/react/components/more_channels.jsx
index 007476f9b..e851283ae 100644
--- a/web/react/components/more_channels.jsx
+++ b/web/react/components/more_channels.jsx
@@ -1,34 +1,32 @@
 // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-
 var utils = require('../utils/utils.jsx');
 var client = require('../utils/client.jsx');
 var asyncClient = require('../utils/async_client.jsx');
-var UserStore = require('../stores/user_store.jsx');
 var ChannelStore = require('../stores/channel_store.jsx');
 var LoadingScreen = require('./loading_screen.jsx');
 
 function getStateFromStores() {
-  return {
-    channels: ChannelStore.getMoreAll(),
-    server_error: null
-  };
+    return {
+        channels: ChannelStore.getMoreAll(),
+        serverError: null
+    };
 }
 
 module.exports = React.createClass({
-    displayName: "MoreChannelsModal",
+    displayName: 'MoreChannelsModal',
 
     componentDidMount: function() {
         ChannelStore.addMoreChangeListener(this._onChange);
-        $(this.refs.modal.getDOMNode()).on('shown.bs.modal', function (e) {
+        $(this.refs.modal.getDOMNode()).on('shown.bs.modal', function shown() {
             asyncClient.getMoreChannels(true);
         });
 
         var self = this;
-        $(this.refs.modal.getDOMNode()).on('show.bs.modal', function(e) {
+        $(this.refs.modal.getDOMNode()).on('show.bs.modal', function show(e) {
             var button = e.relatedTarget;
-            self.setState({ channel_type: $(button).attr('data-channeltype') });
+            self.setState({channelType: $(button).attr('data-channeltype')});
         });
     },
     componentWillUnmount: function() {
@@ -42,18 +40,17 @@ module.exports = React.createClass({
     },
     getInitialState: function() {
         var initState = getStateFromStores();
-        initState.channel_type = "";
+        initState.channelType = '';
         return initState;
     },
-    handleJoin: function(e) {
-        var self = this;
-        client.joinChannel(e,
-            function(data) {
-                $(self.refs.modal.getDOMNode()).modal('hide');
-                asyncClient.getChannels(true);
+    handleJoin: function(id) {
+        client.joinChannel(id,
+            function() {
+                $(this.refs.modal.getDOMNode()).modal('hide');
+                asyncClient.getChannel(id);
             }.bind(this),
             function(err) {
-                this.state.server_error = err.message;
+                this.state.serverError = err.message;
                 this.setState(this.state);
             }.bind(this)
         );
@@ -62,52 +59,66 @@ module.exports = React.createClass({
         $(this.refs.modal.getDOMNode()).modal('hide');
     },
     render: function() {
-        var server_error = this.state.server_error ? <div className='form-group has-error'><label className='control-label'>{ this.state.server_error }</label></div> : null;
+        var serverError;
+        if (this.state.serverError) {
+            serverError = <div className='form-group has-error'><label className='control-label'>{this.state.serverError}</label></div>;
+        }
+
         var outter = this;
         var moreChannels;
 
-        if (this.state.channels != null)
-            moreChannels = this.state.channels;
+        if (this.state.channels != null) {
+            var channels = this.state.channels;
+            if (!channels.loading) {
+                if (channels.length) {
+                    moreChannels = (
+                        <table className='more-channel-table table'>
+                            <tbody>
+                                {moreChannels.map(function cMap(channel) {
+                                    return (
+                                        <tr key={channel.id}>
+                                            <td>
+                                                <p className='more-channel-name'>{channel.display_name}</p>
+                                                <p className='more-channel-description'>{channel.description}</p>
+                                            </td>
+                                            <td className='td--action'><button onClick={outter.handleJoin.bind(outter, channel.id)} className='btn btn-primary'>Join</button></td>
+                                        </tr>
+                                    );
+                                })}
+                            </tbody>
+                        </table>
+                    );
+                } else {
+                    moreChannels = (
+                        <div className='no-channel-message'>
+                           <p className='primary-message'>No more channels to join</p>
+                           <p className='secondary-message'>Click 'Create New Channel' to make a new one</p>
+                        </div>
+                    );
+                }
+            } else {
+                moreChannels = <LoadingScreen />;
+            }
+        }
 
         return (
-            <div className="modal fade" id="more_channels" ref="modal" tabIndex="-1" role="dialog" aria-hidden="true">
-                <div className="modal-dialog">
-                    <div className="modal-content">
-                        <div className="modal-header">
-                            <button type="button" className="close" data-dismiss="modal">
-                                <span aria-hidden="true">&times;</span>
-                                <span className="sr-only">Close</span>
+            <div className='modal fade' id='more_channels' ref='modal' tabIndex='-1' role='dialog' aria-hidden='true'>
+                <div className='modal-dialog'>
+                    <div className='modal-content'>
+                        <div className='modal-header'>
+                            <button type='button' className='close' data-dismiss='modal'>
+                                <span aria-hidden='true'>&times;</span>
+                                <span className='sr-only'>Close</span>
                             </button>
-                            <h4 className="modal-title">More Channels</h4>
-                            <button data-toggle="modal" data-target="#new_channel" data-channeltype={this.state.channel_type} type="button" className="btn btn-primary channel-create-btn" onClick={this.handleNewChannel}>Create New Channel</button>
+                            <h4 className='modal-title'>More Channels</h4>
+                            <button data-toggle='modal' data-target='#new_channel' data-channeltype={this.state.channelType} type='button' className='btn btn-primary channel-create-btn' onClick={this.handleNewChannel}>Create New Channel</button>
                         </div>
-                        <div className="modal-body">
-                            {!moreChannels.loading ?
-                                (moreChannels.length ?
-                                    <table className="more-channel-table table">
-                                        <tbody>
-                                            {moreChannels.map(function(channel) {
-                                                return (
-                                                    <tr key={channel.id}>
-                                                        <td>
-                                                            <p className="more-channel-name">{channel.display_name}</p>
-                                                            <p className="more-channel-description">{channel.description}</p>
-                                                        </td>
-                                                        <td className="td--action"><button onClick={outter.handleJoin.bind(outter, channel.id)} className="btn btn-primary">Join</button></td>
-                                                    </tr>
-                                                )
-                                            })}
-                                        </tbody>
-                                    </table>
-                                    :   <div className="no-channel-message">
-                                            <p className="primary-message">No more channels to join</p>
-                                            <p className="secondary-message">Click 'Create New Channel' to make a new one</p>
-                                        </div>)
-                            :   <LoadingScreen /> }
-                            { server_error }
+                        <div className='modal-body'>
+                            {moreChannels}
+                            {serverError}
                         </div>
-                        <div className="modal-footer">
-                            <button type="button" className="btn btn-default" data-dismiss="modal">Close</button>
+                        <div className='modal-footer'>
+                            <button type='button' className='btn btn-default' data-dismiss='modal'>Close</button>
                         </div>
                     </div>
                 </div>
diff --git a/web/react/components/new_channel.jsx b/web/react/components/new_channel.jsx
index c22147022..8d07c7b64 100644
--- a/web/react/components/new_channel.jsx
+++ b/web/react/components/new_channel.jsx
@@ -57,14 +57,14 @@ module.exports = React.createClass({
 
         var self = this;
         client.createChannel(channel,
-            function() {
+            function(data) {
                 this.refs.display_name.getDOMNode().value = '';
                 this.refs.channel_name.getDOMNode().value = '';
                 this.refs.channel_desc.getDOMNode().value = '';
 
                 $(self.refs.modal.getDOMNode()).modal('hide');
                 window.location = TeamStore.getCurrentTeamUrl() + '/channels/' + channel.name;
-                asyncClient.getChannels(true);
+                asyncClient.getChannel(data.id);
             }.bind(this),
             function(err) {
                 state.serverError = err.message;
diff --git a/web/react/components/rename_channel_modal.jsx b/web/react/components/rename_channel_modal.jsx
index 26593b7fa..57a684b33 100644
--- a/web/react/components/rename_channel_modal.jsx
+++ b/web/react/components/rename_channel_modal.jsx
@@ -68,7 +68,7 @@ module.exports = React.createClass({
 
                 $('#' + this.props.modalId).modal('hide');
                 window.location.href = TeamStore.getCurrentTeamUrl() + '/channels/' + this.state.channel_name;
-                AsyncClient.getChannels(true);
+                AsyncClient.getChannel(channel.id);
             }.bind(this),
             function(err) {
                 state.server_error = err.message;
diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx
index fa6302b6d..6ad606e5e 100644
--- a/web/react/components/sidebar.jsx
+++ b/web/react/components/sidebar.jsx
@@ -157,9 +157,12 @@ module.exports = React.createClass({
     onSocketChange: function(msg) {
         if (msg.action === 'posted') {
             if (ChannelStore.getCurrentId() === msg.channel_id) {
-                if (window.isActive) AsyncClient.updateLastViewedAt();
+                if (window.isActive) {
+                    AsyncClient.updateLastViewedAt();
+                }
             } else {
-                AsyncClient.getChannel(msg.channel_id);
+                console.log('hit');
+                AsyncClient.getChannels();
             }
 
             if (UserStore.getCurrentId() !== msg.user_id) {
@@ -213,7 +216,7 @@ module.exports = React.createClass({
                     utils.ding();
                 }
             }
-        } else if (msg.action === "viewed") {
+        } else if (msg.action === 'viewed') {
             if (ChannelStore.getCurrentId() !== msg.channel_id && UserStore.getCurrentId() === msg.user_id) {
                 AsyncClient.getChannel(msg.channel_id);
             }
diff --git a/web/react/utils/async_client.jsx b/web/react/utils/async_client.jsx
index b938216ac..545c85fc2 100644
--- a/web/react/utils/async_client.jsx
+++ b/web/react/utils/async_client.jsx
@@ -14,124 +14,169 @@ var ActionTypes = Constants.ActionTypes;
 // Used to track in progress async calls
 var callTracker = {};
 
-var dispatchError = function(err, method) {
+function dispatchError(err, method) {
     AppDispatcher.handleServerAction({
         type: ActionTypes.RECIEVED_ERROR,
         err: err,
         method: method
     });
-};
+}
+module.exports.dispatchError = dispatchError;
 
-var isCallInProgress = function(callName) {
-    if (!(callName in callTracker)) return false;
+function isCallInProgress(callName) {
+    if (!(callName in callTracker)) {
+        return false;
+    }
 
-    if (callTracker[callName] === 0) return false;
+    if (callTracker[callName] === 0) {
+        return false;
+    }
 
     if (utils.getTimestamp() - callTracker[callName] > 5000) {
-        console.log("AsyncClient call " + callName + " expired after more than 5 seconds");
+        console.log('AsyncClient call ' + callName + ' expired after more than 5 seconds');
         return false;
     }
 
     return true;
-};
+}
 
-module.exports.dispatchError = dispatchError;
+function getChannels(force, updateLastViewed, checkVersion) {
+    var channels = ChannelStore.getAll();
 
-module.exports.getChannels = function(force, updateLastViewed, checkVersion) {
-    if (isCallInProgress("getChannels")) return;
+    if (channels.length === 0 || force) {
+        if (isCallInProgress('getChannels')) {
+            return;
+        }
+
+        callTracker.getChannels = utils.getTimestamp();
 
-    if (ChannelStore.getAll().length == 0 || force) {
-        callTracker["getChannels"] = utils.getTimestamp();
         client.getChannels(
             function(data, textStatus, xhr) {
-                callTracker["getChannels"] = 0;
-
-                if (updateLastViewed && ChannelStore.getCurrentId() != null) {
-                    module.exports.updateLastViewedAt();
-                }
+                callTracker.getChannels = 0;
 
                 if (checkVersion) {
-                    var serverVersion = xhr.getResponseHeader("X-Version-ID");
+                    var serverVersion = xhr.getResponseHeader('X-Version-ID');
 
                     if (!UserStore.getLastVersion()) {
                         UserStore.setLastVersion(serverVersion);
                     }
 
-                    if (serverVersion != UserStore.getLastVersion()) {
+                    if (serverVersion !== UserStore.getLastVersion()) {
                         UserStore.setLastVersion(serverVersion);
                         window.location.href = window.location.href;
-                        console.log("Detected version update refreshing the page");
+                        console.log('Detected version update refreshing the page');
                     }
                 }
 
-                if (xhr.status === 304 || !data) return;
+                if (xhr.status === 304 || !data) {
+                    return;
+                }
 
                 AppDispatcher.handleServerAction({
                     type: ActionTypes.RECIEVED_CHANNELS,
                     channels: data.channels,
                     members: data.members
                 });
-
             },
             function(err) {
-                callTracker["getChannels"] = 0;
-                dispatchError(err, "getChannels");
+                callTracker.getChannels = 0;
+                dispatchError(err, 'getChannels');
             }
         );
-    }
-}
+    } else {
+        if (isCallInProgress('getChannelCounts')) {
+            return;
+        }
 
-module.exports.getChannel = function(id) {
-    if (isCallInProgress("getChannel"+id)) return;
+        callTracker.getChannelCounts = utils.getTimestamp();
 
-        callTracker["getChannel"+id] = utils.getTimestamp();
-        client.getChannel(id,
+        client.getChannelCounts(
             function(data, textStatus, xhr) {
-                callTracker["getChannel"+id] = 0;
+                callTracker.getChannelCounts = 0;
 
-                if (xhr.status === 304 || !data) return;
+                if (xhr.status === 304 || !data) {
+                    return;
+                }
 
-                AppDispatcher.handleServerAction({
-                    type: ActionTypes.RECIEVED_CHANNEL,
-                    channel: data.channel,
-                    member: data.member
-                });
+                var countMap = data.counts;
 
+                for (var id in countMap) {
+                    var chan = ChannelStore.get(id);
+                    var count = countMap[id];
+                    if (!chan || chan.total_msg_count !== count) {
+                        getChannel(id);
+                    }
+                }
             },
             function(err) {
-                callTracker["getChannel"+id] = 0;
-                dispatchError(err, "getChannel");
+                callTracker.getChannelCounts = 0;
+                dispatchError(err, 'getChannelCounts');
             }
         );
+    }
+
+    if (updateLastViewed && ChannelStore.getCurrentId() != null) {
+        module.exports.updateLastViewedAt();
+    }
 }
+module.exports.getChannels = getChannels;
+
+function getChannel(id) {
+    if (isCallInProgress('getChannel' + id)) {
+        return;
+    }
+
+    callTracker['getChannel' + id] = utils.getTimestamp();
+
+    client.getChannel(id,
+        function(data, textStatus, xhr) {
+            callTracker['getChannel' + id] = 0;
+
+            if (xhr.status === 304 || !data) {
+                return;
+            }
+
+            AppDispatcher.handleServerAction({
+                type: ActionTypes.RECIEVED_CHANNEL,
+                channel: data.channel,
+                member: data.member
+            });
+        },
+        function(err) {
+            callTracker['getChannel' + id] = 0;
+            dispatchError(err, 'getChannel');
+        }
+    );
+}
+module.exports.getChannel = getChannel;
 
 module.exports.updateLastViewedAt = function() {
-    if (isCallInProgress("updateLastViewed")) return;
+    if (isCallInProgress('updateLastViewed')) return;
 
     if (ChannelStore.getCurrentId() == null) return;
 
-    callTracker["updateLastViewed"] = utils.getTimestamp();
+    callTracker['updateLastViewed'] = utils.getTimestamp();
     client.updateLastViewedAt(
         ChannelStore.getCurrentId(),
         function(data) {
-            callTracker["updateLastViewed"] = 0;
+            callTracker['updateLastViewed'] = 0;
         },
         function(err) {
-            callTracker["updateLastViewed"] = 0;
-            dispatchError(err, "updateLastViewedAt");
+            callTracker['updateLastViewed'] = 0;
+            dispatchError(err, 'updateLastViewedAt');
         }
     );
 }
 
 module.exports.getMoreChannels = function(force) {
-    if (isCallInProgress("getMoreChannels")) return;
+    if (isCallInProgress('getMoreChannels')) return;
 
     if (ChannelStore.getMoreAll().loading || force) {
 
-        callTracker["getMoreChannels"] = utils.getTimestamp();
+        callTracker['getMoreChannels'] = utils.getTimestamp();
         client.getMoreChannels(
             function(data, textStatus, xhr) {
-                callTracker["getMoreChannels"] = 0;
+                callTracker['getMoreChannels'] = 0;
 
                 if (xhr.status === 304 || !data) return;
 
@@ -142,8 +187,8 @@ module.exports.getMoreChannels = function(force) {
                 });
             },
             function(err) {
-                callTracker["getMoreChannels"] = 0;
-                dispatchError(err, "getMoreChannels");
+                callTracker['getMoreChannels'] = 0;
+                dispatchError(err, 'getMoreChannels');
             }
         );
     }
@@ -153,15 +198,15 @@ module.exports.getChannelExtraInfo = function(force) {
     var channelId = ChannelStore.getCurrentId();
 
     if (channelId != null) {
-        if (isCallInProgress("getChannelExtraInfo_"+channelId)) return;
+        if (isCallInProgress('getChannelExtraInfo_'+channelId)) return;
         var minMembers = ChannelStore.getCurrent() && ChannelStore.getCurrent().type === 'D' ? 1 : 0;
 
         if (ChannelStore.getCurrentExtraInfo().members.length <= minMembers || force) {
-            callTracker["getChannelExtraInfo_"+channelId] = utils.getTimestamp();
+            callTracker['getChannelExtraInfo_'+channelId] = utils.getTimestamp();
             client.getChannelExtraInfo(
                 channelId,
                 function(data, textStatus, xhr) {
-                    callTracker["getChannelExtraInfo_"+channelId] = 0;
+                    callTracker['getChannelExtraInfo_'+channelId] = 0;
 
                     if (xhr.status === 304 || !data) return;
 
@@ -171,8 +216,8 @@ module.exports.getChannelExtraInfo = function(force) {
                     });
                 },
                 function(err) {
-                    callTracker["getChannelExtraInfo_"+channelId] = 0;
-                    dispatchError(err, "getChannelExtraInfo");
+                    callTracker['getChannelExtraInfo_'+channelId] = 0;
+                    dispatchError(err, 'getChannelExtraInfo');
                 }
             );
         }
@@ -180,12 +225,12 @@ module.exports.getChannelExtraInfo = function(force) {
 }
 
 module.exports.getProfiles = function() {
-    if (isCallInProgress("getProfiles")) return;
+    if (isCallInProgress('getProfiles')) return;
 
-    callTracker["getProfiles"] = utils.getTimestamp();
+    callTracker['getProfiles'] = utils.getTimestamp();
     client.getProfiles(
         function(data, textStatus, xhr) {
-            callTracker["getProfiles"] = 0;
+            callTracker['getProfiles'] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -195,20 +240,20 @@ module.exports.getProfiles = function() {
             });
         },
         function(err) {
-            callTracker["getProfiles"] = 0;
-            dispatchError(err, "getProfiles");
+            callTracker['getProfiles'] = 0;
+            dispatchError(err, 'getProfiles');
         }
     );
 }
 
 module.exports.getSessions = function() {
-    if (isCallInProgress("getSessions")) return;
+    if (isCallInProgress('getSessions')) return;
 
-    callTracker["getSessions"] = utils.getTimestamp();
+    callTracker['getSessions'] = utils.getTimestamp();
     client.getSessions(
         UserStore.getCurrentId(),
         function(data, textStatus, xhr) {
-            callTracker["getSessions"] = 0;
+            callTracker['getSessions'] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -218,20 +263,20 @@ module.exports.getSessions = function() {
             });
         },
         function(err) {
-            callTracker["getSessions"] = 0;
-            dispatchError(err, "getSessions");
+            callTracker['getSessions'] = 0;
+            dispatchError(err, 'getSessions');
         }
     );
 }
 
 module.exports.getAudits = function() {
-    if (isCallInProgress("getAudits")) return;
+    if (isCallInProgress('getAudits')) return;
 
-    callTracker["getAudits"] = utils.getTimestamp();
+    callTracker['getAudits'] = utils.getTimestamp();
     client.getAudits(
         UserStore.getCurrentId(),
         function(data, textStatus, xhr) {
-            callTracker["getAudits"] = 0;
+            callTracker['getAudits'] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -241,22 +286,22 @@ module.exports.getAudits = function() {
             });
         },
         function(err) {
-            callTracker["getAudits"] = 0;
-            dispatchError(err, "getAudits");
+            callTracker['getAudits'] = 0;
+            dispatchError(err, 'getAudits');
         }
     );
 }
 
 module.exports.findTeams = function(email) {
-    if (isCallInProgress("findTeams_"+email)) return;
+    if (isCallInProgress('findTeams_'+email)) return;
 
     var user = UserStore.getCurrentUser();
     if (user) {
-        callTracker["findTeams_"+email] = utils.getTimestamp();
+        callTracker['findTeams_'+email] = utils.getTimestamp();
         client.findTeams(
             user.email,
             function(data, textStatus, xhr) {
-                callTracker["findTeams_"+email] = 0;
+                callTracker['findTeams_'+email] = 0;
 
                 if (xhr.status === 304 || !data) return;
 
@@ -266,21 +311,21 @@ module.exports.findTeams = function(email) {
                 });
             },
             function(err) {
-                callTracker["findTeams_"+email] = 0;
-                dispatchError(err, "findTeams");
+                callTracker['findTeams_'+email] = 0;
+                dispatchError(err, 'findTeams');
             }
         );
     }
 }
 
 module.exports.search = function(terms) {
-    if (isCallInProgress("search_"+String(terms))) return;
+    if (isCallInProgress('search_'+String(terms))) return;
 
-    callTracker["search_"+String(terms)] = utils.getTimestamp();
+    callTracker['search_'+String(terms)] = utils.getTimestamp();
     client.search(
         terms,
         function(data, textStatus, xhr) {
-            callTracker["search_"+String(terms)] = 0;
+            callTracker['search_'+String(terms)] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -290,8 +335,8 @@ module.exports.search = function(terms) {
             });
         },
         function(err) {
-            callTracker["search_"+String(terms)] = 0;
-            dispatchError(err, "search");
+            callTracker['search_'+String(terms)] = 0;
+            dispatchError(err, 'search');
         }
     );
 }
@@ -300,7 +345,7 @@ module.exports.getPosts = function(force, id, maxPosts) {
     if (PostStore.getCurrentPosts() == null || force) {
         var channelId = id ? id : ChannelStore.getCurrentId();
 
-        if (isCallInProgress("getPosts_"+channelId)) return;
+        if (isCallInProgress('getPosts_'+channelId)) return;
 
         var post_list = PostStore.getCurrentPosts();
 
@@ -315,7 +360,7 @@ module.exports.getPosts = function(force, id, maxPosts) {
         }
 
         if (channelId != null) {
-            callTracker["getPosts_"+channelId] = utils.getTimestamp();
+            callTracker['getPosts_'+channelId] = utils.getTimestamp();
             client.getPosts(
                 channelId,
                 0,
@@ -332,23 +377,25 @@ module.exports.getPosts = function(force, id, maxPosts) {
                     module.exports.getProfiles();
                 },
                 function(err) {
-                    dispatchError(err, "getPosts");
+                    dispatchError(err, 'getPosts');
                 },
                 function() {
-                    callTracker["getPosts_"+channelId] = 0;
+                    callTracker['getPosts_'+channelId] = 0;
                 }
             );
         }
     }
 }
 
-module.exports.getMe = function() {
-    if (isCallInProgress("getMe")) return;
+function getMe() {
+    if (isCallInProgress('getMe')) {
+        return;
+    }
 
-    callTracker["getMe"] = utils.getTimestamp();
+    callTracker.getMe = utils.getTimestamp();
     client.getMe(
         function(data, textStatus, xhr) {
-            callTracker["getMe"] = 0;
+            callTracker.getMe = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -358,19 +405,20 @@ module.exports.getMe = function() {
             });
         },
         function(err) {
-            callTracker["getMe"] = 0;
-            dispatchError(err, "getMe");
+            callTracker.getMe = 0;
+            dispatchError(err, 'getMe');
         }
     );
 }
+module.exports.getMe = getMe;
 
 module.exports.getStatuses = function() {
-    if (isCallInProgress("getStatuses")) return;
+    if (isCallInProgress('getStatuses')) return;
 
-    callTracker["getStatuses"] = utils.getTimestamp();
+    callTracker['getStatuses'] = utils.getTimestamp();
     client.getStatuses(
         function(data, textStatus, xhr) {
-            callTracker["getStatuses"] = 0;
+            callTracker['getStatuses'] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -380,19 +428,19 @@ module.exports.getStatuses = function() {
             });
         },
         function(err) {
-            callTracker["getStatuses"] = 0;
-            dispatchError(err, "getStatuses");
+            callTracker['getStatuses'] = 0;
+            dispatchError(err, 'getStatuses');
         }
     );
 }
 
 module.exports.getMyTeam = function() {
-    if (isCallInProgress("getMyTeam")) return;
+    if (isCallInProgress('getMyTeam')) return;
 
-    callTracker["getMyTeam"] = utils.getTimestamp();
+    callTracker['getMyTeam'] = utils.getTimestamp();
     client.getMyTeam(
         function(data, textStatus, xhr) {
-            callTracker["getMyTeam"] = 0;
+            callTracker['getMyTeam'] = 0;
 
             if (xhr.status === 304 || !data) return;
 
@@ -402,8 +450,8 @@ module.exports.getMyTeam = function() {
             });
         },
         function(err) {
-            callTracker["getMyTeam"] = 0;
-            dispatchError(err, "getMyTeam");
+            callTracker['getMyTeam'] = 0;
+            dispatchError(err, 'getMyTeam');
         }
     );
 }
diff --git a/web/react/utils/client.jsx b/web/react/utils/client.jsx
index 7b014cdad..f2b6619a5 100644
--- a/web/react/utils/client.jsx
+++ b/web/react/utils/client.jsx
@@ -540,19 +540,20 @@ module.exports.updateLastViewedAt = function(channelId, success, error) {
     });
 };
 
-module.exports.getChannels = function(success, error) {
+function getChannels(success, error) {
     $.ajax({
-        url: "/api/v1/channels/",
+        url: '/api/v1/channels/',
         dataType: 'json',
         type: 'GET',
         success: success,
         ifModified: true,
         error: function(xhr, status, err) {
-            e = handleError("getChannels", xhr, status, err);
+            var e = handleError('getChannels', xhr, status, err);
             error(e);
         }
     });
-};
+}
+module.exports.getChannels = getChannels;
 
 module.exports.getChannel = function(id, success, error) {
     $.ajax({
@@ -583,6 +584,21 @@ module.exports.getMoreChannels = function(success, error) {
     });
 };
 
+function getChannelCounts(success, error) {
+    $.ajax({
+        url: '/api/v1/channels/counts',
+        dataType: 'json',
+        type: 'GET',
+        success: success,
+        ifModified: true,
+        error: function(xhr, status, err) {
+            var e = handleError('getChannelCounts', xhr, status, err);
+            error(e);
+        }
+    });
+}
+module.exports.getChannelCounts = getChannelCounts;
+
 module.exports.getChannelExtraInfo = function(id, success, error) {
     $.ajax({
         url: "/api/v1/channels/" + id + "/extra_info",