forked from AkkomaGang/akkoma-fe
Merge branch 'feat/masto-ws-deletes' into 'develop'
Support for WS deletes See merge request pleroma/pleroma-fe!1227
This commit is contained in:
commit
d86cd3e850
11 changed files with 95 additions and 19 deletions
|
@ -8,7 +8,6 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
- New option to optimize timeline rendering to make the site more responsive (enabled by default)
|
||||
|
||||
## [Unreleased patch]
|
||||
|
||||
### Fixed
|
||||
- Fixed chats list not updating its order when new messages come in
|
||||
- Fixed chat messages sometimes getting lost when you receive a message at the same time
|
||||
|
@ -16,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
|
||||
### Added
|
||||
- Import/export a muted users
|
||||
- Proper handling of deletes when using websocket streaming
|
||||
|
||||
## [2.1.1] - 2020-09-08
|
||||
### Changed
|
||||
|
|
12
src/components/reply_button/reply_button.js
Normal file
12
src/components/reply_button/reply_button.js
Normal file
|
@ -0,0 +1,12 @@
|
|||
|
||||
const ReplyButton = {
|
||||
name: 'ReplyButton',
|
||||
props: ['status', 'replying'],
|
||||
computed: {
|
||||
loggedIn () {
|
||||
return !!this.$store.state.users.currentUser
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export default ReplyButton
|
21
src/components/reply_button/reply_button.vue
Normal file
21
src/components/reply_button/reply_button.vue
Normal file
|
@ -0,0 +1,21 @@
|
|||
<template>
|
||||
<div>
|
||||
<i
|
||||
v-if="loggedIn"
|
||||
class="button-icon button-reply icon-reply"
|
||||
:title="$t('tool_tip.reply')"
|
||||
:class="{'-active': replying}"
|
||||
@click.prevent="$emit('toggle')"
|
||||
/>
|
||||
<i
|
||||
v-else
|
||||
class="button-icon button-reply -disabled icon-reply"
|
||||
:title="$t('tool_tip.reply')"
|
||||
/>
|
||||
<span v-if="status.replies_count > 0">
|
||||
{{ status.replies_count }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script src="./reply_button.js"></script>
|
|
@ -1,3 +1,4 @@
|
|||
import ReplyButton from '../reply_button/reply_button.vue'
|
||||
import FavoriteButton from '../favorite_button/favorite_button.vue'
|
||||
import ReactButton from '../react_button/react_button.vue'
|
||||
import RetweetButton from '../retweet_button/retweet_button.vue'
|
||||
|
@ -19,6 +20,7 @@ import { unescape, uniqBy } from 'lodash'
|
|||
const Status = {
|
||||
name: 'Status',
|
||||
components: {
|
||||
ReplyButton,
|
||||
FavoriteButton,
|
||||
ReactButton,
|
||||
RetweetButton,
|
||||
|
@ -158,7 +160,7 @@ const Status = {
|
|||
return this.mergedConfig.hideFilteredStatuses
|
||||
},
|
||||
hideStatus () {
|
||||
return this.deleted || (this.muted && this.hideFilteredStatuses) || this.virtualHidden
|
||||
return (this.muted && this.hideFilteredStatuses) || this.virtualHidden
|
||||
},
|
||||
isFocused () {
|
||||
// retweet or root of an expanded conversation
|
||||
|
|
|
@ -30,6 +30,18 @@ $status-margin: 0.75em;
|
|||
border-left-style: solid;
|
||||
}
|
||||
|
||||
.gravestone {
|
||||
padding: $status-margin;
|
||||
color: $fallback--faint;
|
||||
color: var(--faint, $fallback--faint);
|
||||
display: flex;
|
||||
|
||||
.deleted-text {
|
||||
margin: 0.5em 0;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.status-container {
|
||||
display: flex;
|
||||
padding: $status-margin;
|
||||
|
|
|
@ -95,6 +95,7 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
v-if="!deleted"
|
||||
:class="[userClass, { highlighted: userStyle, '-repeat': retweet && !inConversation }]"
|
||||
:style="[ userStyle ]"
|
||||
class="status-container"
|
||||
|
@ -323,21 +324,11 @@
|
|||
v-if="!noHeading && !isPreview"
|
||||
class="status-actions"
|
||||
>
|
||||
<div>
|
||||
<i
|
||||
v-if="loggedIn"
|
||||
class="button-icon button-reply icon-reply"
|
||||
:title="$t('tool_tip.reply')"
|
||||
:class="{'-active': replying}"
|
||||
@click.prevent="toggleReplying"
|
||||
/>
|
||||
<i
|
||||
v-else
|
||||
class="button-icon button-reply -disabled icon-reply"
|
||||
:title="$t('tool_tip.reply')"
|
||||
/>
|
||||
<span v-if="status.replies_count > 0">{{ status.replies_count }}</span>
|
||||
</div>
|
||||
<reply-button
|
||||
:replying="replying"
|
||||
:status="status"
|
||||
@toggle="toggleReplying"
|
||||
/>
|
||||
<retweet-button
|
||||
:visibility="status.visibility"
|
||||
:logged-in="loggedIn"
|
||||
|
@ -360,6 +351,25 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="gravestone"
|
||||
>
|
||||
<div class="left-side">
|
||||
<UserAvatar :compact="compact" />
|
||||
</div>
|
||||
<div class="right-side">
|
||||
<div class="deleted-text">
|
||||
{{ $t('status.status_deleted') }}
|
||||
</div>
|
||||
<reply-button
|
||||
v-if="replying"
|
||||
:replying="replying"
|
||||
:status="status"
|
||||
@toggle="toggleReplying"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="replying"
|
||||
class="status-container reply-form"
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<StillImage
|
||||
v-if="user"
|
||||
class="Avatar"
|
||||
:alt="user.screen_name"
|
||||
:title="user.screen_name"
|
||||
|
@ -7,6 +8,11 @@
|
|||
:class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }"
|
||||
:image-load-error="imageLoadError"
|
||||
/>
|
||||
<div
|
||||
v-else
|
||||
class="Avatar -placeholder"
|
||||
:class="{ 'avatar-compact': compact }"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script src="./user_avatar.js"></script>
|
||||
|
@ -42,5 +48,10 @@
|
|||
border-radius: $fallback--avatarAltRadius;
|
||||
border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
|
||||
}
|
||||
|
||||
&.-placeholder {
|
||||
background-color: $fallback--fg;
|
||||
background-color: var(--fg, $fallback--fg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -665,7 +665,8 @@
|
|||
"show_full_subject": "Show full subject",
|
||||
"hide_full_subject": "Hide full subject",
|
||||
"show_content": "Show content",
|
||||
"hide_content": "Hide content"
|
||||
"hide_content": "Hide content",
|
||||
"status_deleted": "This post was deleted"
|
||||
},
|
||||
"user_card": {
|
||||
"approve": "Approve",
|
||||
|
|
|
@ -578,7 +578,8 @@
|
|||
"show_full_subject": "Näytä koko otsikko",
|
||||
"hide_full_subject": "Piilota koko otsikko",
|
||||
"show_content": "Näytä sisältö",
|
||||
"hide_content": "Piilota sisältö"
|
||||
"hide_content": "Piilota sisältö",
|
||||
"status_deleted": "Poistettu viesti"
|
||||
},
|
||||
"user_card": {
|
||||
"approve": "Hyväksy",
|
||||
|
|
|
@ -72,6 +72,8 @@ const api = {
|
|||
showImmediately: timelineData.visibleStatuses.length === 0,
|
||||
timeline: 'friends'
|
||||
})
|
||||
} else if (message.event === 'delete') {
|
||||
dispatch('deleteStatusById', message.id)
|
||||
} else if (message.event === 'pleroma:chat_update') {
|
||||
dispatch('addChatMessages', {
|
||||
chatId: message.chatUpdate.id,
|
||||
|
|
|
@ -611,6 +611,10 @@ const statuses = {
|
|||
commit('setDeleted', { status })
|
||||
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) {
|
||||
commit('setManyDeleted', condition)
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue