FIX: last visited line not rendering correctly

- stop changing cached models

app/assets/javascripts/discourse/components/topic-list.js.es6

@@ -1,4 +1,4 @@
-import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
+import { observes } from 'ember-addons/ember-computed-decorators';
 
 export default Ember.Component.extend({
   tagName: 'table',
@@ -9,6 +9,7 @@ export default Ember.Component.extend({
     this.addObserver('hideCategory', this.rerender);
     this.addObserver('order', this.rerender);
     this.addObserver('ascending', this.rerender);
+    this.refreshLastVisited();
   }.on('init'),
 
   toggleInTitle: function(){
@@ -31,28 +32,45 @@ export default Ember.Component.extend({
     return this.get('order') === "op_likes";
   }.property('order'),
 
-  @computed('topics.@each', 'order', 'ascending')
-  lastVisitedTopic(topics, order, ascending) {
+  @observes('topics.@each')
+  topicsAdded() {
+    // special case so we don't keep scanning huge lists
+    if (!this.get('lastVisitedTopic')) {
+      this.refreshLastVisited();
+    }
+  },
 
-    this._cleanLastVisitedTopic();
+  @observes('topics', 'order', 'ascending', 'category')
+  lastVisitedTopicChanged() {
+    this.refreshLastVisited();
+  },
 
-    if (!this.get('highlightLastVisited')) { return; }
-    if (order !== "default" && order !== "activity") { return; }
-    if (!topics || topics.length === 1) { return; }
-    if (ascending) { return; }
+  _updateLastVisitedTopic(topics, order, ascending) {
+
+    this.set('lastVisitedTopic', null);
+
+    if (!this.get('highlightLastVisited')) {
+      return;
+    }
+
+    if (order !== "default" && order !== "activity") {
+      return;
+    }
+
+    if (!topics || topics.length === 1) {
+      return;
+    }
+
+    if (ascending) {
+      return;
+    }
 
     let user = Discourse.User.current();
     if (!user || !user.previous_visit_at) {
       return;
     }
 
-    let prevTopic, topic;
-
-    prevTopic = this.get('prevTopic');
-
-    if (prevTopic) {
-      return prevTopic;
-    }
+    let lastVisitedTopic, topic;
 
     let prevVisit = user.get('previousVisitAt');
 
@@ -66,13 +84,13 @@ export default Ember.Component.extend({
     let i;
     for(i=topics.length-1;i>=start;i--){
       if (topics[i].get('bumpedAt') > prevVisit) {
-        prevTopic = topics[i];
+        lastVisitedTopic = topics[i];
         break;
       }
       topic = topics[i];
     }
 
-    if (!prevTopic || !topic) {
+    if (!lastVisitedTopic || !topic) {
       return;
     }
 
@@ -81,20 +99,11 @@ export default Ember.Component.extend({
       return;
     }
 
-    prevTopic.set('isLastVisited', true);
-    this.set('prevTopic', prevTopic);
-
-    return prevTopic;
+    this.set('lastVisitedTopic', lastVisitedTopic);
   },
 
-  @observes('category')
-  _cleanLastVisitedTopic() {
-    const prevTopic = this.get('prevTopic');
-
-    if (prevTopic) {
-      prevTopic.set('isLastVisited', false);
-      this.set('prevTopic', null);
-    }
+  refreshLastVisited() {
+    this._updateLastVisitedTopic(this.get('topics'), this.get('order'), this.get('ascending'));
   },
 
   click(e) {

app/assets/javascripts/discourse/templates/components/topic-list.hbs

@@ -28,15 +28,6 @@
                       expandAllPinned=expandAllPinned
                       lastVisitedTopic=lastVisitedTopic
                       selected=selected}}
-
-    {{#if topic.isLastVisited}}
-      <tr class='topic-list-item-separator'>
-        <td colspan="6">
-          <span>
-            {{i18n 'topics.new_messages_marker'}}
-          </span>
-        </td>
-      </tr>
-    {{/if}}
+    {{raw "list/visited-line" lastVisitedTopic=lastVisitedTopic topic=topic}}
   {{/each}}
 </tbody>

app/assets/javascripts/discourse/templates/list/visited-line.raw.hbs

@@ -0,0 +1,9 @@
+{{#if view.isLastVisited}}
+  <tr class='topic-list-item-separator'>
+    <td colspan="6">
+      <span>
+        {{i18n 'topics.new_messages_marker'}}
+      </span>
+    </td>
+  </tr>
+{{/if}}

app/assets/javascripts/discourse/views/list/visited-line.js.es6

@@ -0,0 +1,5 @@
+export default Ember.Object.extend({
+  isLastVisited: function(){
+    return (this.get('lastVisitedTopic') === this.get('topic'));
+  }.property()
+});