リアクションの修正 (#6260)

1 files changed, 16 insertions, 14 deletions

diff --git a/src/client/components/reactions-viewer.reaction.vue b/src/client/components/reactions-viewer.reaction.vue
index 67774cbb39..8f9324096a 100644
--- a/src/client/components/reactions-viewer.reaction.vue
+++ b/src/client/components/reactions-viewer.reaction.vue
@@ -1,7 +1,7 @@
 <template>
 <button
 	class="hkzvhatu _button"
-	:class="{ reacted: note.myReaction == reaction }"
+	:class="{ reacted: note.myReaction == reaction, canToggle }"
 	@click="toggleReaction(reaction)"
 	v-if="count > 0"
 	@mouseover="onMouseover"
@@ -40,11 +40,6 @@ export default Vue.extend({
 			type: Object,
 			required: true,
 		},
-		canToggle: {
-			type: Boolean,
-			required: false,
-			default: true,
-		},
 	},
 	data() {
 		return {
@@ -57,6 +52,9 @@ export default Vue.extend({
 		isMe(): boolean {
 			return this.$store.getters.isSignedIn && this.$store.state.i.id === this.note.userId;
 		},
+		canToggle(): boolean {
+			return !this.reaction.match(/@\w/);
+		},
 	},
 	mounted() {
 		if (!this.isInitial) this.anime();
@@ -144,19 +142,23 @@ export default Vue.extend({
 	padding: 0 6px;
 	border-radius: 4px;
 
-	&.reacted {
-		background: var(--accent);
+	&.canToggle {
+		background: rgba(0, 0, 0, 0.05);
 
-		> span {
-			color: #fff;
+		&:hover {
+			background: rgba(0, 0, 0, 0.1);
 		}
 	}
 
-	&:not(.reacted) {
-		background: rgba(0, 0, 0, 0.05);
+	&:not(.canToggle) {
+		cursor: default;
+	}
 
-		&:hover {
-			background: rgba(0, 0, 0, 0.1);
+	&.reacted {
+		background: var(--accent);
+
+		> span {
+			color: #fff;
 		}
 	}