diff options
| author | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-16 13:35:40 +0300 |
|---|---|---|
| committer | Marco Ambrosini <marcoambrosini@pm.me> | 2019-10-17 14:34:27 +0300 |
| commit | 73efa19f41c80f346c0c2868550639cec1837fdf (patch) | |
| tree | 5cdbb5bbf540241939b59de0cce437e30e8cecca | |
| parent | d695a00a6d9418bf6fd603fad669e1570909818c (diff) | |
Don't repeat avatar for same author
Signed-off-by: Marco Ambrosini <marcoambrosini@pm.me>
| -rw-r--r-- | src/components/MessagesList/Message/Message.vue | 14 | ||||
| -rw-r--r-- | src/components/MessagesList/MessagesList.vue | 6 |
2 files changed, 18 insertions, 2 deletions
diff --git a/src/components/MessagesList/Message/Message.vue b/src/components/MessagesList/Message/Message.vue index e8b266fcf..b63f91986 100644 --- a/src/components/MessagesList/Message/Message.vue +++ b/src/components/MessagesList/Message/Message.vue @@ -27,7 +27,7 @@ @mouseleave="hover=false"> <div class="message"> <div class="message-avatar"> - <Avatar :user="actorDisplayName" :display-name="actorDisplayName" /> + <Avatar v-if="!isSameAuthor" :user="actorDisplayName" :display-name="actorDisplayName" /> </div> <slot /> <div v-show="isTemporary" class="message-right icon-loading-small" /> @@ -94,6 +94,12 @@ export default { message: { type: Object, required: true + }, + /** + * The previous message in the list + */ + previousMessage: { + required: true } }, data: function() { @@ -107,6 +113,12 @@ export default { }, isTemporary() { return this.timestamp === 0 + }, + isSameAuthor() { + if (this.previousMessage === undefined) { + return false + } + return this.message.actorId === this.previousMessage.actorId } }, methods: { diff --git a/src/components/MessagesList/MessagesList.vue b/src/components/MessagesList/MessagesList.vue index 56cf14a5d..180fcde4e 100644 --- a/src/components/MessagesList/MessagesList.vue +++ b/src/components/MessagesList/MessagesList.vue @@ -40,7 +40,11 @@ the DynamicScroller component, whose docs you can find [here.](https://github.co item.messageText, ]" :data-index="item.id"> - <Message v-bind="item" :message="item" @deleteMessage="handleDeleteMessage"> + <Message + v-bind="item" + :message="item" + :previous-message="messagesList[index-1]" + @deleteMessage="handleDeleteMessage"> <MessageBody v-bind="item"> <MessageBody v-if="item.parent" v-bind="messages[item.parent]" /> </MessageBody> |