less hackery, more direct usage of mastoapi

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) => {
@@ -97,9 +98,13 @@ const conversation = {
       if (this.status) {
         const conversationId = this.status.id
         this.$store.state.api.backendInteractor.fetchConversation({id: conversationId})
-          .then((statuses) => {
-            this.$store.dispatch('addNewStatuses', { statuses })
-            statuses.forEach(status => this.relevantIds.push(status.id))
+          .then(({ancestors, descendants}) => {
+            this.$store.dispatch('addNewStatuses', { statuses: ancestors })
+            this.$store.dispatch('addNewStatuses', { statuses: descendants })
+            set(this, 'relevantIds', [].concat(
+              ancestors.map(_ => _.id),
+              this.statusId,
+              descendants.map(_ => _.id)))
           })
           .then(() => this.setHighlight(this.statusId))
       } else {

src/services/api/api.service.js

@@ -313,27 +313,19 @@ const fetchFollowRequests = ({credentials}) => {
 }
 
 const fetchConversation = ({id, credentials}) => {
-  let url = MASTODON_STATUS_URL(id)
   let urlContext = MASTODON_STATUS_CONTEXT_URL(id)
-  return Promise.all([
-    fetch(url, { headers: authHeaders(credentials) })
-      .then((data) => {
-        if (data.ok) {
-          return data
-        }
-        throw new Error('Error fetching timeline', data)
-      })
-      .then((data) => data.json()),
-    fetch(urlContext, { headers: authHeaders(credentials) })
-      .then((data) => {
-        if (data.ok) {
-          return data
-        }
-        throw new Error('Error fetching timeline', data)
-      })
-      .then((data) => data.json())])
-    .then(([status, context]) => [...context.ancestors, status, ...context.descendants])
-    .then((data) => data.map(parseStatus))
+  return fetch(urlContext, { headers: authHeaders(credentials) })
+    .then((data) => {
+      if (data.ok) {
+        return data
+      }
+      throw new Error('Error fetching timeline', data)
+    })
+    .then((data) => data.json())
+    .then(({ancestors, descendants}) => ({
+      ancestors: ancestors.map(parseStatus),
+      descendants: descendants.map(parseStatus)
+    }))
 }
 
 const fetchStatus = ({id, credentials}) => {