Merge branch 'mastoapi/convos' into 'develop'

Fetching convos via MastoAPI

See merge request pleroma/pleroma-fe!662

src/components/conversation-page/conversation-page.js

@@ -1,5 +1,4 @@
 import Conversation from '../conversation/conversation.vue'
-import { find } from 'lodash'
 
 const conversationPage = {
   components: {
@@ -8,8 +7,8 @@ const conversationPage = {
   computed: {
     statusoid () {
       const id = this.$route.params.id
-      const statuses = this.$store.state.statuses.allStatuses
-      const status = find(statuses, {id})
+      const statuses = this.$store.state.statuses.allStatusesObject
+      const status = statuses[id]
 
       return status
     }

src/components/conversation/conversation.js

@@ -1,4 +1,5 @@
 import { reduce, filter } from 'lodash'
+import { set } from 'vue'
 import Status from '../status/status.vue'
 
 const sortById = (a, b) => {
@@ -25,7 +26,8 @@ const sortAndFilterConversation = (conversation) => {
 const conversation = {
   data () {
     return {
-      highlight: null
+      highlight: null,
+      converationStatusIds: []
     }
   },
   props: [
@@ -36,6 +38,15 @@ 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
@@ -48,9 +59,11 @@ const conversation = {
         return []
       }
 
-      const conversationId = this.status.statusnet_conversation_id
-      const statuses = this.$store.state.statuses.allStatuses
-      const conversation = filter(statuses, { statusnet_conversation_id: conversationId })
+      const statusesObject = this.$store.state.statuses.allStatusesObject
+      const conversation = this.idsToShow.reduce((acc, id) => {
+        acc.push(statusesObject[id])
+        return acc
+      }, [])
       return sortAndFilterConversation(conversation)
     },
     replies () {
@@ -83,9 +96,15 @@ const conversation = {
   methods: {
     fetchConversation () {
       if (this.status) {
-        const conversationId = this.status.statusnet_conversation_id
-        this.$store.state.api.backendInteractor.fetchConversation({id: conversationId})
-          .then((statuses) => this.$store.dispatch('addNewStatuses', { statuses }))
+        this.$store.state.api.backendInteractor.fetchConversation({id: this.status.id})
+          .then(({ancestors, descendants}) => {
+            this.$store.dispatch('addNewStatuses', { statuses: ancestors })
+            this.$store.dispatch('addNewStatuses', { statuses: descendants })
+            set(this, 'converationStatusIds', [].concat(
+              ancestors.map(_ => _.id),
+              this.statusId,
+              descendants.map(_ => _.id)))
+          })
           .then(() => this.setHighlight(this.statusId))
       } else {
         const id = this.$route.params.id

src/modules/statuses.js

@@ -1,4 +1,5 @@
 import { remove, slice, each, find, maxBy, minBy, merge, first, last, isArray, omitBy } from 'lodash'
+import { set } from 'vue'
 import apiService from '../services/api/api.service.js'
 // import parse from '../services/status_parser/status_parser.js'
 
@@ -82,7 +83,7 @@ const mergeOrAdd = (arr, obj, item) => {
     // This is a new item, prepare it
     prepareStatus(item)
     arr.push(item)
-    obj[item.id] = item
+    set(obj, item.id, item)
     return {item, new: true}
   }
 }

src/modules/users.js

@@ -16,9 +16,9 @@ export const mergeOrAdd = (arr, obj, item) => {
   } else {
     // This is a new item, prepare it
     arr.push(item)
-    obj[item.id] = item
+    set(obj, item.id, item)
     if (item.screen_name && !item.screen_name.includes('@')) {
-      obj[item.screen_name.toLowerCase()] = item
+      set(obj, item.screen_name.toLowerCase(), item)
     }
     return { item, new: true }
   }

src/services/api/api.service.js

@@ -10,8 +10,6 @@ const UNFAVORITE_URL = '/api/favorites/destroy'
 const RETWEET_URL = '/api/statuses/retweet'
 const UNRETWEET_URL = '/api/statuses/unretweet'
 const STATUS_DELETE_URL = '/api/statuses/destroy'
-const STATUS_URL = '/api/statuses/show'
-const CONVERSATION_URL = '/api/statusnet/conversation'
 const MENTIONS_URL = '/api/statuses/mentions.json'
 const DM_TIMELINE_URL = '/api/statuses/dm_timeline.json'
 const FOLLOWERS_URL = '/api/statuses/followers.json'
@@ -35,6 +33,8 @@ const DENY_USER_URL = '/api/pleroma/friendships/deny'
 const SUGGESTIONS_URL = '/api/v1/suggestions'
 
 const MASTODON_USER_FAVORITES_TIMELINE_URL = '/api/v1/favourites'
+const MASTODON_STATUS_URL = id => `/api/v1/statuses/${id}`
+const MASTODON_STATUS_CONTEXT_URL = id => `/api/v1/statuses/${id}/context`
 const MASTODON_USER_URL = '/api/v1/accounts'
 const MASTODON_USER_RELATIONSHIPS_URL = '/api/v1/accounts/relationships'
 const MASTODON_USER_TIMELINE_URL = id => `/api/v1/accounts/${id}/statuses`
@@ -317,8 +317,8 @@ const fetchFollowRequests = ({credentials}) => {
 }
 
 const fetchConversation = ({id, credentials}) => {
-  let url = `${CONVERSATION_URL}/${id}.json?count=100`
-  return fetch(url, { headers: authHeaders(credentials) })
+  let urlContext = MASTODON_STATUS_CONTEXT_URL(id)
+  return fetch(urlContext, { headers: authHeaders(credentials) })
     .then((data) => {
       if (data.ok) {
         return data
@@ -326,11 +326,14 @@ const fetchConversation = ({id, credentials}) => {
       throw new Error('Error fetching timeline', data)
     })
     .then((data) => data.json())
-    .then((data) => data.map(parseStatus))
+    .then(({ancestors, descendants}) => ({
+      ancestors: ancestors.map(parseStatus),
+      descendants: descendants.map(parseStatus)
+    }))
 }
 
 const fetchStatus = ({id, credentials}) => {
-  let url = `${STATUS_URL}/${id}.json`
+  let url = MASTODON_STATUS_URL(id)
   return fetch(url, { headers: authHeaders(credentials) })
     .then((data) => {
       if (data.ok) {