diff --git a/src/client/app/common/views/components/reactions-viewer.details.vue b/src/client/app/common/views/components/reactions-viewer.details.vue index 27eb860d5b..55927bba90 100644 --- a/src/client/app/common/views/components/reactions-viewer.details.vue +++ b/src/client/app/common/views/components/reactions-viewer.details.vue @@ -2,7 +2,9 @@ <transition name="zoom-in-top"> <div class="buebdbiu" ref="popover" v-if="show"> <i18n path="few-users" v-if="users.length <= 10"> - <span slot="users">{{ users.join(', ') }}</span> + <span slot="users"> + <mk-user-name v-for="u in users" :user="u" :key="u.id"/> + </span> <mk-reaction-icon slot="reaction" :reaction="reaction" ref="icon" /> </i18n> <i18n path="many-users" v-if="10 < users.length"> @@ -76,6 +78,8 @@ export default Vue.extend({ color var(--text) border-radius 4px box-shadow 0 var(--lineWidth) 4px rgba(#000, 0.25) + pointer-events none + transform-origin center -16px &:before content "" diff --git a/src/client/app/common/views/components/reactions-viewer.reaction.vue b/src/client/app/common/views/components/reactions-viewer.reaction.vue index 9598fa6597..e2a8b91b00 100644 --- a/src/client/app/common/views/components/reactions-viewer.reaction.vue +++ b/src/client/app/common/views/components/reactions-viewer.reaction.vue @@ -104,7 +104,7 @@ export default Vue.extend({ }).then((reactions: any[]) => { const users = reactions.filter(x => x.type === this.reaction) .sort((a, b) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime()) - .map(x => x.user.username); + .map(x => x.user); this.closeDetails(); if (!this.isHovering) return;