Merge branch '480-replies' into 'develop'

Display replies to statuses in real time

Closes #480

See merge request pleroma/pleroma-fe!737

src/components/conversation/conversation.js

@@ -1,5 +1,4 @@
-import { reduce, filter, findIndex } from 'lodash'
-import { set } from 'vue'
+import { reduce, filter, findIndex, clone } from 'lodash'
 import Status from '../status/status.vue'
 
 const sortById = (a, b) => {
@@ -36,8 +35,7 @@ const conversation = {
   data () {
     return {
       highlight: null,
-      expanded: false,
-      converationStatusIds: []
+      expanded: false
     }
   },
   props: [
@@ -54,15 +52,6 @@ const conversation = {
     status () {
       return this.statusoid
     },
-    idsToShow () {
-      if (this.converationStatusIds.length > 0) {
-        return this.converationStatusIds
-      } else if (this.statusId) {
-        return [this.statusId]
-      } else {
-        return []
-      }
-    },
     statusId () {
       if (this.statusoid.retweeted_status) {
         return this.statusoid.retweeted_status.id
@@ -70,6 +59,13 @@ const conversation = {
         return this.statusoid.id
       }
     },
+    conversationId () {
+      if (this.statusoid.retweeted_status) {
+        return this.statusoid.retweeted_status.statusnet_conversation_id
+      } else {
+        return this.statusoid.statusnet_conversation_id
+      }
+    },
     conversation () {
       if (!this.status) {
         return []
@@ -79,12 +75,7 @@ const conversation = {
         return [this.status]
       }
 
-      const statusesObject = this.$store.state.statuses.allStatusesObject
-      const conversation = this.idsToShow.reduce((acc, id) => {
-        acc.push(statusesObject[id])
-        return acc
-      }, [])
-
+      const conversation = clone(this.$store.state.statuses.conversationsObject[this.conversationId])
       const statusIndex = findIndex(conversation, { id: this.statusId })
       if (statusIndex !== -1) {
         conversation[statusIndex] = this.status
@@ -131,10 +122,6 @@ const conversation = {
           .then(({ancestors, descendants}) => {
             this.$store.dispatch('addNewStatuses', { statuses: ancestors })
             this.$store.dispatch('addNewStatuses', { statuses: descendants })
-            set(this, 'converationStatusIds', [].concat(
-              ancestors.map(_ => _.id).filter(_ => _ !== this.statusId),
-              this.statusId,
-              descendants.map(_ => _.id).filter(_ => _ !== this.statusId)))
           })
           .then(() => this.setHighlight(this.statusId))
       } else {

src/modules/statuses.js

@@ -33,6 +33,7 @@ const emptyNotifications = () => ({
 export const defaultState = () => ({
   allStatuses: [],
   allStatusesObject: {},
+  conversationsObject: {},
   maxId: 0,
   notifications: emptyNotifications(),
   favorites: new Set(),
@@ -112,6 +113,39 @@ const sortTimeline = (timeline) => {
   return timeline
 }
 
+// Add status to the global storages (arrays and objects maintaining statuses) except timelines
+const addStatusToGlobalStorage = (state, data) => {
+  const result = mergeOrAdd(state.allStatuses, state.allStatusesObject, data)
+  if (result.new) {
+    // Add to conversation
+    const status = result.item
+    const conversationsObject = state.conversationsObject
+    const conversationId = status.statusnet_conversation_id
+    if (conversationsObject[conversationId]) {
+      conversationsObject[conversationId].push(status)
+    } else {
+      set(conversationsObject, conversationId, [status])
+    }
+  }
+  return result
+}
+
+// Remove status from the global storages (arrays and objects maintaining statuses) except timelines
+const removeStatusFromGlobalStorage = (state, status) => {
+  remove(state.allStatuses, { id: status.id })
+
+  // TODO: Need to remove from allStatusesObject?
+
+  // Remove possible notification
+  remove(state.notifications.data, ({action: {id}}) => id === status.id)
+
+  // Remove from conversation
+  const conversationId = status.statusnet_conversation_id
+  if (state.conversationsObject[conversationId]) {
+    remove(state.conversationsObject[conversationId], { id: status.id })
+  }
+}
+
 const addNewStatuses = (state, { statuses, showImmediately = false, timeline, user = {}, noIdUpdate = false, userId }) => {
   // Sanity check
   if (!isArray(statuses)) {
@@ -119,7 +153,6 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
   }
 
   const allStatuses = state.allStatuses
-  const allStatusesObject = state.allStatusesObject
   const timelineObject = state.timelines[timeline]
 
   const maxNew = statuses.length > 0 ? maxBy(statuses, 'id').id : 0
@@ -142,7 +175,7 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
   }
 
   const addStatus = (data, showImmediately, addToTimeline = true) => {
-    const result = mergeOrAdd(allStatuses, allStatusesObject, data)
+    const result = addStatusToGlobalStorage(state, data)
     const status = result.item
 
     if (result.new) {
@@ -236,16 +269,13 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
     },
     'deletion': (deletion) => {
       const uri = deletion.uri
-
-      // Remove possible notification
       const status = find(allStatuses, {uri})
       if (!status) {
         return
       }
 
-      remove(state.notifications.data, ({action: {id}}) => id === status.id)
+      removeStatusFromGlobalStorage(state, status)
 
-      remove(allStatuses, { uri })
       if (timeline) {
         remove(timelineObject.statuses, { uri })
         remove(timelineObject.visibleStatuses, { uri })
@@ -273,12 +303,10 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
 }
 
 const addNewNotifications = (state, { dispatch, notifications, older, visibleNotificationTypes, rootGetters }) => {
-  const allStatuses = state.allStatuses
-  const allStatusesObject = state.allStatusesObject
   each(notifications, (notification) => {
     if (notification.type !== 'follow') {
-      notification.action = mergeOrAdd(allStatuses, allStatusesObject, notification.action).item
-      notification.status = notification.status && mergeOrAdd(allStatuses, allStatusesObject, notification.status).item
+      notification.action = addStatusToGlobalStorage(state, notification.action).item
+      notification.status = notification.status && addStatusToGlobalStorage(state, notification.status).item
     }
 
     // Only add a new notification if we don't have one for the same action