update status eliminating logic

src/components/timeline/timeline.js

@@ -41,12 +41,18 @@ const Timeline = {
         footer: ['timeline-footer'].concat(!this.embedded ? ['panel-footer'] : [])
       }
     },
-    statuses () {
+    // id map of statuses which need to be hidden in the main list due to pinning logic
+    excludedStatusIdsObject () {
+      const result = {}
       if (this.pinnedStatusIds && this.pinnedStatusIds.length > 0) {
-        return this.timeline.visibleStatuses && this.timeline.visibleStatuses.filter(status => !this.pinnedStatusIds.includes(status.id))
-      } else {
-        return this.timeline.visibleStatuses
+        for (let status of this.timeline.visibleStatuses) {
+          if (this.pinnedStatusIds.indexOf(status.id) === -1) {
+            break
+          }
+          result[status.id] = true
+        }
       }
+      return result
     }
   },
   components: {

src/components/timeline/timeline.vue

@@ -38,13 +38,15 @@
             :show-pinned="true"
           />
         </template>
-        <conversation
-          v-for="status in statuses"
-          :key="status.id"
-          class="status-fadein"
-          :statusoid="status"
-          :collapsable="true"
-        />
+        <template v-for="status in timeline.visibleStatuses">
+          <conversation
+            v-if="!excludedStatusIdsObject[status.id]"
+            :key="status.id"
+            class="status-fadein"
+            :statusoid="status"
+            :collapsable="true"
+          />
+        </template>
       </div>
     </div>
     <div :class="classes.footer">