add basic deletes support that works with masto WS

This commit is contained in:
Shpuld Shpuldson 2020-09-06 15:28:09 +03:00
parent a73b09c732
commit 40ca0b394e
7 changed files with 57 additions and 2 deletions

View file

@ -157,7 +157,7 @@ const Status = {
return this.mergedConfig.hideFilteredStatuses return this.mergedConfig.hideFilteredStatuses
}, },
hideStatus () { hideStatus () {
return this.deleted || (this.muted && this.hideFilteredStatuses) return (this.muted && this.hideFilteredStatuses)
}, },
isFocused () { isFocused () {
// retweet or root of an expanded conversation // retweet or root of an expanded conversation

View file

@ -25,6 +25,17 @@ $status-margin: 0.75em;
--icon: var(--selectedPostIcon, $fallback--icon); --icon: var(--selectedPostIcon, $fallback--icon);
} }
.deleted {
padding: $status-margin;
color: $fallback--faint;
color: var(--faint, $fallback--faint);
display: flex;
.deleted-text {
margin: 0.5em 0;
align-items: center;
}
}
.status-container { .status-container {
display: flex; display: flex;
padding: $status-margin; padding: $status-margin;

View file

@ -95,6 +95,7 @@
</div> </div>
<div <div
v-if="!deleted"
:class="[userClass, { highlighted: userStyle, '-repeat': retweet && !inConversation }]" :class="[userClass, { highlighted: userStyle, '-repeat': retweet && !inConversation }]"
:style="[ userStyle ]" :style="[ userStyle ]"
class="status-container" class="status-container"
@ -356,6 +357,31 @@
</div> </div>
</div> </div>
</div> </div>
<div
v-else
class="deleted"
>
<div class="left-side">
<UserAvatar :compact="compact" />
</div>
<div class="right-side">
<div class="deleted-text">
{{ $t('status.status_deleted') }}
</div>
<div
v-if="replying"
class="status-actions"
>
<i
v-if="loggedIn"
class="button-icon button-reply icon-reply"
:title="$t('tool_tip.reply')"
:class="{'-active': replying}"
@click.prevent="toggleReplying"
/>
</div>
</div>
</div>
<div <div
v-if="replying" v-if="replying"
class="status-container reply-form" class="status-container reply-form"

View file

@ -1,5 +1,6 @@
<template> <template>
<StillImage <StillImage
v-if="user"
class="Avatar" class="Avatar"
:alt="user.screen_name" :alt="user.screen_name"
:title="user.screen_name" :title="user.screen_name"
@ -7,6 +8,11 @@
:class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }" :class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }"
:image-load-error="imageLoadError" :image-load-error="imageLoadError"
/> />
<div
v-else
class="Avatar -placeholder"
:class="{ 'avatar-compact': compact }"
/>
</template> </template>
<script src="./user_avatar.js"></script> <script src="./user_avatar.js"></script>
@ -42,5 +48,10 @@
border-radius: $fallback--avatarAltRadius; border-radius: $fallback--avatarAltRadius;
border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius); border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
} }
&.-placeholder {
background-color: $fallback--fg;
background-color: var(--fg, $fallback--fg);
}
} }
</style> </style>

View file

@ -659,7 +659,8 @@
"show_full_subject": "Show full subject", "show_full_subject": "Show full subject",
"hide_full_subject": "Hide full subject", "hide_full_subject": "Hide full subject",
"show_content": "Show content", "show_content": "Show content",
"hide_content": "Hide content" "hide_content": "Hide content",
"status_deleted": "The post was deleted"
}, },
"user_card": { "user_card": {
"approve": "Approve", "approve": "Approve",

View file

@ -72,6 +72,8 @@ const api = {
showImmediately: timelineData.visibleStatuses.length === 0, showImmediately: timelineData.visibleStatuses.length === 0,
timeline: 'friends' timeline: 'friends'
}) })
} else if (message.event === 'delete') {
dispatch('deleteStatusById', message.id)
} else if (message.event === 'pleroma:chat_update') { } else if (message.event === 'pleroma:chat_update') {
dispatch('addChatMessages', { dispatch('addChatMessages', {
chatId: message.chatUpdate.id, chatId: message.chatUpdate.id,

View file

@ -608,6 +608,10 @@ const statuses = {
commit('setDeleted', { status }) commit('setDeleted', { status })
apiService.deleteStatus({ id: status.id, credentials: rootState.users.currentUser.credentials }) apiService.deleteStatus({ id: status.id, credentials: rootState.users.currentUser.credentials })
}, },
deleteStatusById ({ rootState, commit }, id) {
const status = rootState.statuses.allStatusesObject[id]
commit('setDeleted', { status })
},
markStatusesAsDeleted ({ commit }, condition) { markStatusesAsDeleted ({ commit }, condition) {
commit('setManyDeleted', condition) commit('setManyDeleted', condition)
}, },