diff --git a/src/components/avatar_list/avatar_list.js b/src/components/avatar_list/avatar_list.js index 7806fba81..7c0a39ffd 100644 --- a/src/components/avatar_list/avatar_list.js +++ b/src/components/avatar_list/avatar_list.js @@ -1,14 +1,19 @@ import UserAvatar from 'src/components/user_avatar/user_avatar.vue' import { useInstanceStore } from 'src/stores/instance.js' +import { useUsersStore } from 'src/stores/users.js' import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' const AvatarList = { - props: ['users'], + props: { + userIds: Set, + }, computed: { slicedUsers() { - return this.users ? this.users.slice(0, 15) : [] + return [...(this.userIds ?? [])] + .slice(0, 15) + .map((id) => useUsersStore().findUser(id)) }, }, components: { diff --git a/src/components/status/status.js b/src/components/status/status.js index 43b0f4806..8c3e594ac 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -1,4 +1,3 @@ -import { uniqBy } from 'lodash' import { defineAsyncComponent } from 'vue' import AvatarList from 'src/components/avatar_list/avatar_list.vue' @@ -179,6 +178,12 @@ const Status = { useUserHighlightStore().get(this.repeater.screen_name), ) }, + favoritedBy() { + return useStatusesStore().favs.get(this.mainStatus.id) ?? new Set() + }, + repeatedBy() { + return useStatusesStore().repeats.get(this.mainStatus.id) ?? new Set() + }, userStyle() { if (this.noHeading) return return highlightStyle(useUserHighlightStore().get(this.user.screen_name)) @@ -383,12 +388,10 @@ const Status = { } }, combinedFavsAndRepeatsUsers() { - // Use the status from the global status repository since favs and repeats are saved in it - const combinedUsers = [].concat( - this.mainStatus.favoritedBy, - this.mainStatus.rebloggedBy, - ) - return uniqBy(combinedUsers, 'id') + return new Set([ + ...this.favoritedBy, + ...this.repeatedBy, + ]) }, tags() { return [...this.status.tags] @@ -403,7 +406,7 @@ const Status = { return ( !this.hidePostStats && this.focused && - (this.combinedFavsAndRepeatsUsers.length > 0 || + (this.combinedFavsAndRepeatsUsers.size > 0 || this.mainStatus.quotes_count) ) }, @@ -588,20 +591,18 @@ const Status = { // refetch repeats when repeat_num is changed in any way if ( this.focused && - this.mainStatus.rebloggedBy && - this.mainStatus.rebloggedBy.length !== num + this.repeatedBy.size !== num ) { - useStatusesStore().fetchRepeats(this.status.id) + useStatusesStore().fetchRepeats(this.mainStatus.id) } }, 'mainStatus.fave_num': function (num) { // refetch favs when fave_num is changed in any way if ( this.focused && - this.mainStatus.favoritedBy && - this.mainStatus.favoritedBy.length !== num + this.favoritedBy.size !== num ) { - useStatusesStore().fetchFavs(this.status.id) + useStatusesStore().fetchFavs(this.mainStatus.id) } }, isSuspendable: function (suspend) { diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 5171f7657..7af4ed84a 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -464,26 +464,26 @@ >
{{ $t('status.repeats') }}
- {{ mainStatus.rebloggedBy.length }} + {{ repeatedBy.size }}
{{ $t('status.favorites') }}
- {{ mainStatus.favoritedBy.length }} + {{ favoritedBy.size }}
@@ -501,7 +501,7 @@
- +
diff --git a/src/components/user_list_popover/user_list_popover.js b/src/components/user_list_popover/user_list_popover.js index 84107d6b1..00bce1e9c 100644 --- a/src/components/user_list_popover/user_list_popover.js +++ b/src/components/user_list_popover/user_list_popover.js @@ -4,6 +4,7 @@ import UserAvatar from 'src/components/user_avatar/user_avatar.vue' import { useInstanceStore } from 'src/stores/instance.js' import { useMergedConfigStore } from 'src/stores/merged_config.js' +import { useUsersStore } from 'src/stores/users.js' import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' @@ -14,7 +15,9 @@ library.add(faCircleNotch) const UserListPopover = { name: 'UserListPopover', - props: ['users'], + props: { + userIds: Set + }, components: { UnicodeDomainIndicator, Popover, @@ -22,7 +25,7 @@ const UserListPopover = { }, computed: { usersCapped() { - return this.users.slice(0, 16) + return [...this.userIds].slice(0, 16).map((id) => useUsersStore().findUser(id)) }, allowNonSquareEmoji() { return useMergedConfigStore().mergedConfig.nonSquareEmoji diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue index 8f774a9b1..b5677bcab 100644 --- a/src/components/user_list_popover/user_list_popover.vue +++ b/src/components/user_list_popover/user_list_popover.vue @@ -9,7 +9,7 @@