From 1029bff5ff37d68eff1afeb8c5c918ece3105705 Mon Sep 17 00:00:00 2001
From: MeiMei <30769358+mei23@users.noreply.github.com>
Date: Fri, 28 Dec 2018 01:01:58 +0900
Subject: [PATCH] Undo reaction with clicking minus (#3773)
* Undo reaction with clicking minus
* fix isMyNote
---
locales/ja-JP.yml | 2 ++
src/client/app/common/scripts/note-mixin.ts | 8 ++++++++
src/client/app/desktop/views/components/note-detail.vue | 5 ++++-
src/client/app/desktop/views/components/note.vue | 5 ++++-
src/client/app/mobile/views/components/note-detail.vue | 5 ++++-
src/client/app/mobile/views/components/note.vue | 5 ++++-
6 files changed, 26 insertions(+), 4 deletions(-)
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index d8f2ed9bfb..9bed180349 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -752,11 +752,13 @@ desktop/views/components/note-detail.vue:
location: "位置情報"
renote: "Renote"
add-reaction: "リアクション"
+ undo-reaction: "リアクション解除"
desktop/views/components/note.vue:
reply: "返信"
renote: "Renote"
add-reaction: "リアクション"
+ undo-reaction: "リアクション解除"
detail: "詳細"
private: "この投稿は非公開です"
deleted: "この投稿は削除されました"
diff --git a/src/client/app/common/scripts/note-mixin.ts b/src/client/app/common/scripts/note-mixin.ts
index 39e23f94ea..76059fbb0c 100644
--- a/src/client/app/common/scripts/note-mixin.ts
+++ b/src/client/app/common/scripts/note-mixin.ts
@@ -142,6 +142,14 @@ export default (opts: Opts = {}) => ({
});
},
+ undoReact(note) {
+ const oldReaction = note.myReaction;
+ if (!oldReaction) return;
+ this.$root.api('notes/reactions/delete', {
+ noteId: note.id
+ });
+ },
+
favorite() {
this.$root.api('notes/favorites/create', {
noteId: this.appearNote.id
diff --git a/src/client/app/desktop/views/components/note-detail.vue b/src/client/app/desktop/views/components/note-detail.vue
index d0a625bc14..f2d46a6eed 100644
--- a/src/client/app/desktop/views/components/note-detail.vue
+++ b/src/client/app/desktop/views/components/note-detail.vue
@@ -76,9 +76,12 @@
<button v-else class="inhibitedButton">
<fa icon="ban"/>
</button>
- <button class="reactionButton" :class="{ reacted: appearNote.myReaction != null }" v-if="!isMyNote" @click="react()" ref="reactButton" :title="$t('add-reaction')">
+ <button v-if="!isMyNote && appearNote.myReaction == null" class="reactionButton" @click="react()" ref="reactButton" :title="$t('add-reaction')">
<fa icon="plus"/>
</button>
+ <button v-if="!isMyNote && appearNote.myReaction != null" class="reactionButton reacted" @click="undoReact(appearNote)" ref="reactButton" :title="$t('undo-reaction')">
+ <fa icon="minus"/>
+ </button>
<button @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>
diff --git a/src/client/app/desktop/views/components/note.vue b/src/client/app/desktop/views/components/note.vue
index 2c8dccd496..9e3e8dfcb6 100644
--- a/src/client/app/desktop/views/components/note.vue
+++ b/src/client/app/desktop/views/components/note.vue
@@ -53,9 +53,12 @@
<button v-else class="inhibitedButton">
<fa icon="ban"/>
</button>
- <button class="reactionButton" :class="{ reacted: appearNote.myReaction != null }" v-if="!isMyNote" @click="react()" ref="reactButton" :title="$t('add-reaction')">
+ <button v-if="!isMyNote && appearNote.myReaction == null" class="reactionButton" @click="react()" ref="reactButton" :title="$t('add-reaction')">
<fa icon="plus"/>
</button>
+ <button v-if="!isMyNote && appearNote.myReaction != null" class="reactionButton reacted" @click="undoReact(appearNote)" ref="reactButton" :title="$t('undo-reaction')">
+ <fa icon="minus"/>
+ </button>
<button @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>
diff --git a/src/client/app/mobile/views/components/note-detail.vue b/src/client/app/mobile/views/components/note-detail.vue
index e0ce26e194..05c770a59b 100644
--- a/src/client/app/mobile/views/components/note-detail.vue
+++ b/src/client/app/mobile/views/components/note-detail.vue
@@ -72,9 +72,12 @@
<button v-else>
<fa icon="ban"/>
</button>
- <button :class="{ reacted: appearNote.myReaction != null }" @click="react()" v-if="!isMyNote" ref="reactButton" :title="$t('title')">
+ <button v-if="!isMyNote && appearNote.myReaction == null" class="reactionButton" @click="react()" ref="reactButton">
<fa icon="plus"/>
</button>
+ <button v-if="!isMyNote && appearNote.myReaction != null" class="reactionButton reacted" @click="undoReact(appearNote)" ref="reactButton">
+ <fa icon="minus"/>
+ </button>
<button @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>
diff --git a/src/client/app/mobile/views/components/note.vue b/src/client/app/mobile/views/components/note.vue
index c0f0f49d59..6c17d77cd9 100644
--- a/src/client/app/mobile/views/components/note.vue
+++ b/src/client/app/mobile/views/components/note.vue
@@ -49,9 +49,12 @@
<button v-else>
<fa icon="ban"/>
</button>
- <button :class="{ reacted: appearNote.myReaction != null }" @click="react()" v-if="!isMyNote" ref="reactButton">
+ <button v-if="!isMyNote && appearNote.myReaction == null" class="reactionButton" @click="react()" ref="reactButton">
<fa icon="plus"/>
</button>
+ <button v-if="!isMyNote && appearNote.myReaction != null" class="reactionButton reacted" @click="undoReact(appearNote)" ref="reactButton">
+ <fa icon="minus"/>
+ </button>
<button class="menu" @click="menu()" ref="menuButton">
<fa icon="ellipsis-h"/>
</button>