From cc69e982a75985964afdccb3e9fcc264e221ff5e Mon Sep 17 00:00:00 2001
From: Luke Barnard <lukeb@openmarket.com>
Date: Thu, 9 Feb 2017 10:01:51 +0000
Subject: [PATCH] Use single state to set both avatars and typing notif

---
 src/WhoIsTyping.js                         |  3 +--
 src/components/structures/RoomStatusBar.js | 21 +++++++++------------
 2 files changed, 10 insertions(+), 14 deletions(-)

diff --git a/src/WhoIsTyping.js b/src/WhoIsTyping.js
index ecd7c495f9..bff536a61e 100644
--- a/src/WhoIsTyping.js
+++ b/src/WhoIsTyping.js
@@ -48,8 +48,7 @@ module.exports = {
         return whoIsTyping;
     },
 
-    whoIsTypingString: function(room, limit) {
-        const whoIsTyping = this.usersTypingApartFromMe(room);
+    whoIsTypingString: function(whoIsTyping, limit) {
         const othersCount = limit === undefined ?
             0 : Math.max(whoIsTyping.length - limit, 0);
         if (whoIsTyping.length == 0) {
diff --git a/src/components/structures/RoomStatusBar.js b/src/components/structures/RoomStatusBar.js
index 3fd0a3b751..d0f4fbfa0f 100644
--- a/src/components/structures/RoomStatusBar.js
+++ b/src/components/structures/RoomStatusBar.js
@@ -89,10 +89,7 @@ module.exports = React.createClass({
     getInitialState: function() {
         return {
             syncState: MatrixClientPeg.get().getSyncState(),
-            whoisTypingString: WhoIsTyping.whoIsTypingString(
-                this.props.room,
-                this.props.whoIsTypingLimit
-            ),
+            usersTyping: WhoIsTyping.usersTypingApartFromMe(this.props.room),
         };
     },
 
@@ -141,10 +138,7 @@ module.exports = React.createClass({
 
     onRoomMemberTyping: function(ev, member) {
         this.setState({
-            whoisTypingString: WhoIsTyping.whoIsTypingString(
-                this.props.room,
-                this.props.whoIsTypingLimit
-            ),
+            usersTyping: WhoIsTyping.usersTypingApartFromMe(this.props.room),
         });
     },
 
@@ -153,7 +147,7 @@ module.exports = React.createClass({
     // indicate other sizes.
     _getSize: function(state, props) {
         if (state.syncState === "ERROR" ||
-            state.whoisTypingString ||
+            (state.usersTyping.length > 0) ||
             props.numUnreadMessages ||
             !props.atEndOfLiveTimeline ||
             props.hasActiveCall) {
@@ -220,7 +214,7 @@ module.exports = React.createClass({
     },
 
     _renderTypingIndicatorAvatars: function(limit) {
-        let users = WhoIsTyping.usersTypingApartFromMe(this.props.room);
+        let users = this.state.usersTyping;
 
         let othersCount = Math.max(users.length - limit, 0);
         users = users.slice(0, limit);
@@ -324,7 +318,10 @@ module.exports = React.createClass({
             );
         }
 
-        var typingString = this.state.whoisTypingString;
+        const typingString = WhoIsTyping.whoIsTypingString(
+            this.state.usersTyping,
+            this.props.whoIsTypingLimit
+        );
         if (typingString) {
             return (
                 <div className="mx_RoomStatusBar_typingBar">
@@ -347,7 +344,7 @@ module.exports = React.createClass({
 
     render: function() {
         var content = this._getContent();
-        var indicator = this._getIndicator(this.state.whoisTypingString !== null);
+        var indicator = this._getIndicator(this.state.usersTyping.length > 0);
 
         return (
             <div className="mx_RoomStatusBar">