Ensure that expired messages are removed from the frontend

js/conversation_controller.js

@@ -76,6 +76,9 @@
         get: function(id) {
             return conversations.get(id);
         },
+        add: function(attrs) {
+            return conversations.add(attrs, {merge: true});
+        },
         create: function(attrs) {
             if (typeof attrs !== 'object') {
                 throw new Error('ConversationController.create requires an object, got', attrs);

js/models/conversations.js

@@ -40,10 +40,14 @@
 
         this.on('change:avatar', this.updateAvatarUrl);
         this.on('destroy', this.revokeAvatarUrl);
-        this.on('read', this.countUnread);
+        this.on('read', this.onReadMessage);
     },
 
-    countUnread: function() {
+    onReadMessage: function(message) {
+        if (this.messageCollection.get(message.id)) {
+            this.messageCollection.get(message.id).fetch();
+        }
+
         return this.getUnread().then(function(unreadMessages) {
             this.save({unreadCount: unreadMessages.length});
             if (unreadMessages.length) {

js/models/messages.js

@@ -105,6 +105,11 @@
             }
             return this.imageUrl;
         },
+        getConversation: function() {
+            return ConversationController.add({
+                id: this.get('conversationId')
+            });
+        },
         getContact: function() {
             var conversationId = this.get('source');
             if (!this.isIncoming()) {
@@ -390,6 +395,8 @@
             this.expirationTimeout = null;
             this.trigger('expired', this);
             this.destroy();
+
+            this.getConversation().trigger('expired', this);
         },
         setToExpire: function() {
             if (this.get('expireTimer') && this.get('expirationStartTimestamp') && !this.expireTimer) {

js/views/conversation_view.js

@@ -43,7 +43,8 @@
             this.listenTo(this.model, 'change:name', this.updateTitle);
             this.listenTo(this.model, 'newmessage', this.addMessage);
             this.listenTo(this.model, 'opened', this.onOpened);
-            this.listenTo(this.model.messageCollection, 'expired', this.onExpired);
+            this.listenTo(this.model, 'expired', this.onExpired);
+            this.listenTo(this.model.messageCollection, 'expired', this.onExpiredCollection);
 
             this.render();
 
@@ -168,6 +169,12 @@
         },
 
         onExpired: function(message) {
+            var mine = this.model.messageCollection.get(message.id);
+            if (mine && mine.cid !== message.cid) {
+                mine.trigger('expired', mine);
+            }
+        },
+        onExpiredCollection: function(message) {
             this.model.messageCollection.remove(message.id);
         },