diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 390bfc9f31..2dfa1cea76 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -850,6 +850,7 @@ desktop/views/components/settings.vue:
show-renoted-my-notes: "自分の投稿のRenoteをタイムラインに表示する"
show-local-renotes: "ローカルの投稿のRenoteをタイムラインに表示する"
show-maps: "マップの自動展開"
+ remain-deleted-note: "削除された投稿を表示し続ける"
deck-column-align: "デッキのカラムの位置"
deck-column-align-center: "中央"
deck-column-align-left: "左"
diff --git a/src/client/app/desktop/views/components/note.vue b/src/client/app/desktop/views/components/note.vue
index 86534adc49..71d7ae4203 100644
--- a/src/client/app/desktop/views/components/note.vue
+++ b/src/client/app/desktop/views/components/note.vue
@@ -2,7 +2,7 @@
<div
class="note"
:class="{ mini }"
- v-show="appearNote.deletedAt == null && !hideThisNote"
+ v-show="(this.$store.state.settings.remainDeletedNote || appearNote.deletedAt == null) && !hideThisNote"
:tabindex="appearNote.deletedAt == null ? '-1' : null"
v-hotkey="keymap"
:title="title"
@@ -32,7 +32,7 @@
<mk-avatar class="avatar" :user="appearNote.user"/>
<div class="main">
<mk-note-header class="header" :note="appearNote" :mini="mini"/>
- <div class="body">
+ <div class="body" v-if="appearNote.deletedAt == null">
<p v-if="appearNote.cw != null" class="cw">
<span class="text" v-if="appearNote.cw != ''">{{ appearNote.cw }}</span>
<mk-cw-button v-model="showContent"/>
@@ -53,7 +53,7 @@
<mk-url-preview v-for="url in urls" :url="url" :key="url" :mini="mini"/>
</div>
</div>
- <footer>
+ <footer v-if="appearNote.deletedAt == null">
<span class="app" v-if="appearNote.app && mini && $store.state.settings.showVia">via <b>{{ appearNote.app.name }}</b></span>
<mk-reactions-viewer :note="appearNote" ref="reactionsViewer"/>
<button class="replyButton" @click="reply()" :title="$t('reply')">
@@ -71,6 +71,7 @@
<fa icon="ellipsis-h"/>
</button>
</footer>
+ <div class="deleted" v-if="appearNote.deletedAt != null">{{ $t('deleted') }}</div>
</div>
</article>
<div class="replies" v-if="detail && replies.length > 0">
@@ -89,6 +90,7 @@ import noteSubscriber from '../../../common/scripts/note-subscriber';
export default Vue.extend({
i18n: i18n('desktop/views/components/note.vue'),
+
components: {
XSub
},
@@ -343,6 +345,7 @@ export default Vue.extend({
margin-left 0.5em
color var(--noteHeaderInfo)
font-size 0.8em
+
> button
margin 0 28px 0 0
padding 0 8px
@@ -376,6 +379,10 @@ export default Vue.extend({
&.reacted, &.reacted:hover
color var(--noteActionsReactionHover)
+ > .deleted
+ color var(--noteText)
+ opacity 0.7
+
</style>
<style lang="stylus" module>
diff --git a/src/client/app/desktop/views/components/settings.vue b/src/client/app/desktop/views/components/settings.vue
index 1ef9e3ef3d..1c3f0e8cc4 100644
--- a/src/client/app/desktop/views/components/settings.vue
+++ b/src/client/app/desktop/views/components/settings.vue
@@ -130,6 +130,7 @@
<ui-switch v-model="showReplyTarget">{{ $t('show-reply-target') }}</ui-switch>
<ui-switch v-model="showMaps">{{ $t('show-maps') }}</ui-switch>
<ui-switch v-model="disableAnimatedMfm">{{ $t('@.disable-animated-mfm') }}</ui-switch>
+ <ui-switch v-model="remainDeletedNote">{{ $t('remain-deleted-note') }}</ui-switch>
</section>
<section>
<header>{{ $t('deck-column-align') }}</header>
@@ -529,6 +530,11 @@ export default Vue.extend({
disableAnimatedMfm: {
get() { return this.$store.state.settings.disableAnimatedMfm; },
set(value) { this.$store.dispatch('settings/set', { key: 'disableAnimatedMfm', value }); }
+ },
+
+ remainDeletedNote: {
+ get() { return this.$store.state.settings.remainDeletedNote; },
+ set(value) { this.$store.dispatch('settings/set', { key: 'remainDeletedNote', value }); }
}
},
created() {
diff --git a/src/client/app/mobile/views/components/note.vue b/src/client/app/mobile/views/components/note.vue
index 4c38aecd01..5b34cfb070 100644
--- a/src/client/app/mobile/views/components/note.vue
+++ b/src/client/app/mobile/views/components/note.vue
@@ -28,7 +28,7 @@
<mk-avatar class="avatar" :user="appearNote.user" v-if="$store.state.device.postStyle != 'smart'"/>
<div class="main">
<mk-note-header class="header" :note="appearNote" :mini="true"/>
- <div class="body">
+ <div class="body" v-if="appearNote.deletedAt == null">
<p v-if="appearNote.cw != null" class="cw">
<span class="text" v-if="appearNote.cw != ''">{{ appearNote.cw }}</span>
<mk-cw-button v-model="showContent"/>
@@ -50,7 +50,7 @@
</div>
<span class="app" v-if="appearNote.app && $store.state.settings.showVia">via <b>{{ appearNote.app.name }}</b></span>
</div>
- <footer>
+ <footer v-if="appearNote.deletedAt == null">
<mk-reactions-viewer :note="appearNote" ref="reactionsViewer"/>
<button @click="reply()">
<template v-if="appearNote.reply"><fa icon="reply-all"/></template>
@@ -67,6 +67,7 @@
<fa icon="ellipsis-h"/>
</button>
</footer>
+ <div class="deleted" v-if="appearNote.deletedAt != null">{{ $t('deleted') }}</div>
</div>
</article>
</div>
@@ -355,6 +356,10 @@ export default Vue.extend({
&.reacted
color var(--primary)
+ > .deleted
+ color var(--noteText)
+ opacity 0.7
+
</style>
<style lang="stylus" module>
diff --git a/src/client/app/store.ts b/src/client/app/store.ts
index 065015b3db..0a16a71a2a 100644
--- a/src/client/app/store.ts
+++ b/src/client/app/store.ts
@@ -15,6 +15,7 @@ const defaultSettings = {
tagTimelines: [],
fetchOnScroll: true,
showMaps: true,
+ remainDeletedNote: false,
showPostFormOnTopOfTl: false,
suggestRecentHashtags: true,
showClockOnHeader: true,