Hot fix the unread count bug on selected conversation

refs skygear-demo#16
rickmak · Apr 24, 2017 · 5631d40 · 5631d40
1 parent 39d711a
commit 5631d40
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 7 deletions.
diff --git a/src/components/App.jsx b/src/components/App.jsx
@@ -45,18 +45,27 @@ export default class App extends React.Component {
   }
 
   updateUnreadCount() {
+    const {
+      activeID
+    } = this.state;
+    const activeUC = this.userConversationList.get(activeID);
     skygearChat.getUnreadCount().then(result => {
+      // FIXME: activeUC count is always reset to zero for async.
+      if (activeUC) {
+        result.message = result.message - activeUC.unread_count;
+        activeUC.unread_count = 0;
+      }
       this.setState({unreadCount: result.message});
     });
   }
 
   selectConversation(userConversation) {
+    const unread_count = userConversation.unread_count;
+    userConversation.unread_count = 0;
     this.setState({
       activeID: userConversation._id,
-      unreadCount: this.state.unreadCount - userConversation.unread_count
+      unreadCount: this.state.unreadCount - unread_count
     });
-    userConversation.unread_count = 0;
-    this.updateUnreadCount();
   }
 
   render() {
@@ -100,7 +109,7 @@ export default class App extends React.Component {
                   return <ConversationPreview
                     key={'ConversationPreview-' + uc.id + uc.updatedAt}
                     selected={
-                      uc.id === activeID}
+                      uc._id === activeID}
                     userConversation={uc}
                     conversation={uc.$transient.conversation}
                     onClick={() => this.selectConversation(uc)}/>

diff --git a/src/components/ConversationPreview.jsx b/src/components/ConversationPreview.jsx
@@ -46,14 +46,17 @@ export default class ConversationPreview extends React.Component {
       selected,
       onClick,
     } = this.props;
-    const {
+    let {
       unread_count
     } = this.props.userConversation;
     const {
       title,
       imageURL
     } = this.state;
     const lastMessage = this.props.conversation.$transient.last_message;
+    if (selected) {
+      unread_count = 0;
+    }
 
     return (
       <div

diff --git a/src/utils/ManagedMessageList.jsx b/src/utils/ManagedMessageList.jsx
@@ -153,8 +153,8 @@ export default class ManagedMessageList {
     const {_messages} = this;
     if (!_messages.hasOwnProperty(message._id)) {
       _messages[message._id] = message;
-      this._messagesUpdated();
-      if (this._autoRead) {
+        this._messagesUpdated();
+        if (this._autoRead) {
         skygearChat.markAsLastMessageRead(this._conversation, message);
       }
     }