タップ不可能なリアクションを押してもパーティクルが出るバグを修正 (#6472)

* resolve #6453

* リアクションビューワーのトグル可能判定にログインしているかどうかも反映

2 files changed, 8 insertions, 7 deletions

diff --git a/src/client/components/reactions-viewer.reaction.vue b/src/client/components/reactions-viewer.reaction.vue
index 6b72f2e105..639a1603ca 100644
--- a/src/client/components/reactions-viewer.reaction.vue
+++ b/src/client/components/reactions-viewer.reaction.vue
@@ -9,9 +9,9 @@
 	@mouseleave="onMouseleave"
 	@touchend="onMouseleave"
 	ref="reaction"
-	v-particle
+	v-particle="canToggle"
 >
-	<x-reaction-icon :reaction="reaction" :customEmojis="note.emojis" ref="icon"/>
+	<x-reaction-icon :reaction="reaction" :custom-emojis="note.emojis" ref="icon"/>
 	<span>{{ count }}</span>
 </button>
 </template>
@@ -55,21 +55,20 @@ export default Vue.extend({
 			return this.$store.getters.isSignedIn && this.$store.state.i.id === this.note.userId;
 		},
 		canToggle(): boolean {
-			return !this.reaction.match(/@\w/);
+			return !this.reaction.match(/@\w/) && !this.isMe && this.$store.getters.isSignedIn;
 		},
 	},
-	mounted() {
-		if (!this.isInitial) this.anime();
-	},
 	watch: {
 		count(newCount, oldCount) {
 			if (oldCount < newCount) this.anime();
 			if (this.details != null) this.openDetails();
 		},
 	},
+	mounted() {
+		if (!this.isInitial) this.anime();
+	},
 	methods: {
 		toggleReaction() {
-			if (this.isMe) return;
 			if (!this.canToggle) return;
 
 			const oldReaction = this.note.myReaction;
diff --git a/src/client/directives/particle.ts b/src/client/directives/particle.ts
index 41509b4ed1..4fb2a7948e 100644
--- a/src/client/directives/particle.ts
+++ b/src/client/directives/particle.ts
@@ -2,6 +2,8 @@ import Particle from '../components/particle.vue';
 
 export default {
 	bind(el, binding, vn) {
+		// 明示的に false であればバインドしない
+		if (binding.value === false) return;
 		el.addEventListener('click', () => {
 			const rect = el.getBoundingClientRect();