Enhance: リアクションミュート周りを改修 (#54)

Type4ny-Project · Sep 21, 2024 · 98b0237 · 98b0237
1 parent 21e64ef
commit 98b0237
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 3 deletions.
diff --git a/locales/index.d.ts b/locales/index.d.ts
@@ -7824,6 +7824,20 @@ export interface Locale extends ILocale {
          */
         "hideMutedNotes": string;
     };
+    "_reactionMute": {
+        /**
+         * ミュートするリアクション
+         */
+        "muteReactions": string;
+        /**
+         * 改行で区切って設定します
+         */
+        "muteReactionsDescription": string;
+        /**
+         * リアクションの名前をスラッシュで囲むと正規表現になります。
+         */
+        "muteReactionsDescription2": string;
+    };
     "_instanceMute": {
         /**
          * ミュートしたサーバーのユーザーへの返信を含めて、設定したサーバーの全てのノートとRenoteをミュートします。

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
@@ -2046,6 +2046,11 @@ _wordMute:
   muteWordsDescription2: "キーワードをスラッシュで囲むと正規表現になります。"
   hideMutedNotes: "ミュートされた単語を含むノートを非表示にする"
 
+_reactionMute:
+    muteReactions: "ミュートするリアクション"
+    muteReactionsDescription: "改行で区切って設定します"
+    muteReactionsDescription2: "リアクションの名前をスラッシュで囲むと正規表現になります。"
+
 _instanceMute:
   instanceMuteDescription: "ミュートしたサーバーのユーザーへの返信を含めて、設定したサーバーの全てのノートとRenoteをミュートします。"
   instanceMuteDescription2: "改行で区切って設定します"

diff --git a/packages/frontend/src/components/MkReactionsViewer.vue b/packages/frontend/src/components/MkReactionsViewer.vue
@@ -58,7 +58,16 @@ function onMockToggleReaction(emoji: string, count: number) {
 
 if ($i && reactions.value) {
 	reactions.value = reactions.value.map(([reactionType, count]) => {
-		if (reactionType === props.note.myReaction || !($i.mutedReactions.flat()).includes(reactionType)) {
+		const isMuted = $i.mutedReactions.flat().some(mutedReaction => {
+			if (mutedReaction.startsWith('/') && mutedReaction.endsWith('/')) {
+				const regex = new RegExp(mutedReaction.slice(1, -1));
+				return regex.test(reactionType);
+			} else {
+				return reactionType.includes(mutedReaction);
+			}
+		});
+
+		if (reactionType === props.note.myReaction || !isMuted) {
 			return [reactionType, count];
 		} else {
 			return ['🚮', count];
@@ -90,10 +99,18 @@ watch([() => props.note.reactions, () => props.maxNumber], ([newSource, maxNumbe
 	}
 	if ($i) {
 		reactions.value = newReactions.map(([reactionType, count]) => {
-			if (reactionType === props.note.myReaction || !($i.mutedReactions.flat()).includes(reactionType)) {
+			const isMuted = $i.mutedReactions.flat().some(mutedReaction => {
+				if (mutedReaction.startsWith('/') && mutedReaction.endsWith('/')) {
+					const regex = new RegExp(mutedReaction.slice(1, -1));
+					return regex.test(reactionType);
+				} else {
+					return reactionType.includes(mutedReaction);
+				}
+			});
+			if (reactionType === props.note.myReaction || !isMuted) {
 				return [reactionType, count];
 			} else {
-				return ['🚮️', count];
+				return ['🚮', count];
 			}
 		});
 	} else {

diff --git a/packages/frontend/src/pages/settings/mute-block.word-mute.vue b/packages/frontend/src/pages/settings/mute-block.word-mute.vue
@@ -9,6 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<MkTextarea v-model="mutedWords">
 			<span>{{ i18n.ts._wordMute.muteWords }}</span>
 			<template v-if="!notCaption" #caption>{{ i18n.ts._wordMute.muteWordsDescription }}<br>{{ i18n.ts._wordMute.muteWordsDescription2 }}</template>
+			<template v-if="notCaption" #caption>{{ i18n.ts._reactionMute.muteReactionsDescription }}<br>{{ i18n.ts._reactionMute.muteReactionsDescription2 }}</template>
 		</MkTextarea>
 	</div>
 	<MkButton primary inline :disabled="!changed" @click="save()"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>