fetch reblogged users

src/components/conversation/conversation.js

@@ -122,6 +122,7 @@ const conversation = {
           .then(({ancestors, descendants}) => {
             const ancestorId = ancestors.length ? ancestors[0].id : this.status.id
             this.fetchFavouritedByUsers(ancestorId)
+            this.fetchRebloggedByUsers(ancestorId)
             this.$store.dispatch('addNewStatuses', { statuses: ancestors })
             this.$store.dispatch('addNewStatuses', { statuses: descendants })
           })
@@ -160,6 +161,14 @@ const conversation = {
         this.$store.dispatch('addFavoritedByUsers', { favoritedByUsers, id })
       })
     },
+    fetchRebloggedByUsers (id) {
+      this.$store.state.api.backendInteractor.fetchRebloggedByUsers({id: this.status.id}).then((response) => {
+        const rebloggedByUsers = response.map(item => ({
+          src: item.avatar_static,
+          name: item.display_name
+        }))
+        this.$store.dispatch('addRebloggedByUsers', { rebloggedByUsers, id })
+      })
     }
   }
 }

src/components/status/status.js

@@ -262,6 +262,8 @@ const Status = {
     favouritedByUsers () {
       return this.statusoid.favoritedBy ? this.statusoid.favoritedBy : []
     },
+    rebloggedByUsers () {
+      return this.statusoid.rebloggedBy ? this.statusoid.rebloggedBy : []
     }
   },
   components: {

src/components/status/status.vue

@@ -142,6 +142,16 @@
             <favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
             <delete-button :status='status'></delete-button>
           </div>
+          <div class="boosted-users">
+            <div class="reblogged-users" v-if="rebloggedByUsers.length > 0" :class="{ 'status-fadein': rebloggedByUsers.length > 0 }">
+              <p class="title">Boosted By {{rebloggedByUsers.length}}:</p>
+              <AvatarList :avatars='rebloggedByUsers'></AvatarList>
+            </div>
+            <div class="favourited-users" v-if="favouritedByUsers.length > 0" :class="{ 'status-fadein': favouritedByUsers.length > 0 }">
+              <p class="title">Favourited By {{favouritedByUsers.length}}:</p>
+              <AvatarList :avatars='favouritedByUsers'></AvatarList>
+            </div>
+          </div>
         </div>
       </div>
       <div class="container" v-if="replying">
@@ -612,6 +622,21 @@ a.unmute {
   }
 }
 
+.boosted-users {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 10px;
+
+  .favourited-users,
+  .reblogged-users {
+    flex: 1;
+
+    .title {
+      margin: 0 0 10px 0;
+    }
+  }
+}
+
 @media all and (max-width: 800px) {
   .status-el {
     .retweet-info {

src/modules/statuses.js

@@ -466,6 +466,11 @@ export const mutations = {
       favoritedBy: favoritedByUsers
     }
   },
+  addRebloggedByUsers (state, { rebloggedByUsers, id }) {
+    state.allStatusesObject[id] = {
+      ...state.allStatusesObject[id],
+      rebloggedBy: rebloggedByUsers
+    }
   }
 }
 
@@ -535,6 +540,8 @@ const statuses = {
     addFavoritedByUsers ({ rootState, commit }, { favoritedByUsers, id }) {
       commit('addFavoritedByUsers', { favoritedByUsers, id })
     },
+    addRebloggedByUsers ({ rootState, commit }, { rebloggedByUsers, id }) {
+      commit('addRebloggedByUsers', { rebloggedByUsers, id })
     }
   },
   mutations

src/services/api/api.service.js

@@ -50,6 +50,7 @@ const MASTODON_UNMUTE_USER_URL = id => `/api/v1/accounts/${id}/unmute`
 const MASTODON_POST_STATUS_URL = '/api/v1/statuses'
 const MASTODON_MEDIA_UPLOAD_URL = '/api/v1/media'
 const MASTODON_STATUS_FAVOURITEDBY_URL = id => `/api/v1/statuses/${id}/favourited_by`
+const MASTODON_STATUS_REBLOGGEDBY_URL = id => `/api/v1/statuses/${id}/reblogged_by`
 
 import { each, map } from 'lodash'
 import { parseStatus, parseUser, parseNotification, parseAttachment } from '../entity_normalizer/entity_normalizer.service.js'
@@ -797,7 +798,9 @@ const apiService = {
   approveUser,
   denyUser,
   suggestions,
-  markNotificationsAsSeen
+  markNotificationsAsSeen,
+  fetchFavouritedByUsers,
+  fetchRebloggedByUsers
 }
 
 export default apiService

src/services/backend_interactor_service/backend_interactor_service.js

@@ -113,6 +113,8 @@ const backendInteractorService = (credentials) => {
   const changePassword = ({password, newPassword, newPasswordConfirmation}) => apiService.changePassword({credentials, password, newPassword, newPasswordConfirmation})
 
   const fetchFavouritedByUsers = ({id}) => apiService.fetchFavouritedByUsers({id})
+  const fetchRebloggedByUsers = ({id}) => apiService.fetchRebloggedByUsers({id})
+
   const backendInteractorServiceInstance = {
     fetchStatus,
     fetchConversation,
@@ -155,6 +157,7 @@ const backendInteractorService = (credentials) => {
     approveUser,
     denyUser,
     fetchFavouritedByUsers,
+    fetchRebloggedByUsers
   }
 
   return backendInteractorServiceInstance