Handle message count split in container

Fixes issue where admin messages caused social messages to display as unread when they weren’t

src/views/messages/container.jsx

@@ -145,10 +145,18 @@ var Messages = React.createClass({
             loadMore = false;
         }
 
+        var adminMessagesLength = this.props.adminMessages.length;
+        if (Object.keys(this.props.invite).length > 0) {
+            adminMessagesLength = adminMessagesLength + 1;
+        }
+        var numNewSocialMessages = this.props.numNewMessages - adminMessagesLength;
+        if (numNewSocialMessages < 0) {
+            numNewSocialMessages = 0;
+        }
         var messages = this.filterMessages(
             this.props.messages,
             this.state.filterValues,
-            this.props.numNewMessages
+            numNewSocialMessages
         );
 
         return(
@@ -158,7 +166,8 @@ var Messages = React.createClass({
                 messages={messages}
                 adminMessages={this.props.adminMessages}
                 scratcherInvite={this.props.invite}
-                numNewMessages={this.props.numNewMessages}
+                numNewMessages={numNewSocialMessages}
+                adminMessagesLength={adminMessagesLength}
                 handleFilterClick={this.handleFilterClick}
                 handleAdminDismiss={this.handleMessageDismiss}
                 loadMore={loadMore}

src/views/messages/presentation.jsx

@@ -209,6 +209,7 @@ var MessagesPresentation = injectIntl(React.createClass({
         adminMessages: React.PropTypes.array.isRequired,
         scratcherInvite: React.PropTypes.object.isRequired,
         numNewMessages: React.PropTypes.number,
+        adminMessagesLength: React.PropTypes.number,
         handleFilterClick: React.PropTypes.func.isRequired,
         handleAdminDismiss: React.PropTypes.func.isRequired,
         loadMore: React.PropTypes.bool.isRequired,
@@ -218,19 +219,11 @@ var MessagesPresentation = injectIntl(React.createClass({
     getDefaultProps: function () {
         return {
             numNewMessages: 0,
+            adminMessagesLength: 0,
             filterOpen: false
         };
     },
     render: function () {
-        var adminMessageLength = this.props.adminMessages.length;
-        if (Object.keys(this.props.scratcherInvite).length > 0) {
-            adminMessageLength = adminMessageLength + 1;
-        }
-        var numNewSocialMessages = this.props.numNewMessages - adminMessageLength;
-        if (numNewSocialMessages < 0) {
-            numNewSocialMessages = 0;
-        }
-
         return (
             <div className="messages">
                 <TitleBanner className="mod-messages">
@@ -278,7 +271,7 @@ var MessagesPresentation = injectIntl(React.createClass({
                                 <h4 className="messages-header">
                                     <FormattedMessage id='messages.scratchTeamTitle' />
                                     <div className="messages-header-unread">
-                                        <FormattedNumber value={adminMessageLength} />
+                                        <FormattedNumber value={this.props.adminMessagesLength} />
                                     </div>
                                 </h4>
                             </div>
@@ -318,7 +311,7 @@ var MessagesPresentation = injectIntl(React.createClass({
                     <SocialMessagesList
                         loadStatus={this.props.requestStatus.messages}
                         messages={this.props.messages}
-                        numNewMessages={numNewSocialMessages}
+                        numNewMessages={this.props.numNewMessages}
                         loadMore={this.props.loadMore}
                         loadMoreMethod={this.props.loadMoreMethod}
                     />