krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-17 22:57:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

12893 - Keep other chat messages right-aligned when avatar doesn't render (#12969)

Browse Source 
* 12893 - Keep other chat messages right-aligned when avatar doesn't render

* 12893 - Don't show spacing for system messages
This commit is contained in:
Bart Enkelaar
2021-03-14 10:20:28 +01:00
committed by GitHub
parent 84d7df3d42
commit 81907643d3
1 changed files with 12 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
website/client/src/components/chat/chatMessages.vue
View File

@@ -30,47 +30,22 @@
{{ $t('loading') }}
</h2>
</div>
<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<div
v-for="msg in messages"
v-if="chat && canViewFlag(msg)"
v-for="msg in messages.filter(m => chat && canViewFlag(m))"
:key="msg.id"
>
<!-- eslint-enable vue/no-use-v-if-with-v-for -->
<div
v-if="user._id !== msg.uuid"
class="d-flex"
>
<div class="d-flex">
<avatar
v-if="msg.userStyles
|| (cachedProfileData[msg.uuid] && !cachedProfileData[msg.uuid].rejected)"
v-if="user._id !== msg.uuid && msg.uuid !== 'system'"
class="avatar-left"
:class="{ invisible: avatarUnavailable(msg) }"
:member="msg.userStyles || cachedProfileData[msg.uuid]"
:avatar-only="true"
:override-top-padding="'14px'"
:hide-class-badge="true"
:override-top-padding="'14px'"
@click.native="showMemberModal(msg.uuid)"
/>
<div
class="card"
>
<chat-card
:msg="msg"
:group-id="groupId"
@message-liked="messageLiked"
@message-removed="messageRemoved"
@show-member-modal="showMemberModal"
@chat-card-mounted="itemWasMounted"
/>
</div>
</div>
<div
v-if="user._id === msg.uuid"
class="d-flex"
>
<div
class="card"
>
<div class="card">
<chat-card
:msg="msg"
:group-id="groupId"
@@ -81,8 +56,8 @@
/>
</div>
<avatar
v-if="msg.userStyles
|| (cachedProfileData[msg.uuid] && !cachedProfileData[msg.uuid].rejected)"
v-if="user._id === msg.uuid"
:class="{ invisible: avatarUnavailable(msg) }"
:member="msg.userStyles || cachedProfileData[msg.uuid]"
:avatar-only="true"
:hide-class-badge="true"
@@ -167,8 +142,6 @@
.message-scroll .d-flex {
min-width: 1px;
}
</style>
<script>
@@ -301,6 +274,10 @@ export default {
this.loading = false;
},
avatarUnavailable ({ userStyles, uuid }) {
const { cachedProfileData } = this;
return (!userStyles && (!cachedProfileData[uuid] || cachedProfileData[uuid].rejected));
},
displayDivider (message) {
if (this.currentDayDividerDisplay !== moment(message.timestamp).day()) {
this.currentDayDividerDisplay = moment(message.timestamp).day();