From b766589c00f4ffffe92e7c105fca76e57fdc73d9 Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Wed, 4 Jun 2025 12:01:33 +0900
Subject: [PATCH] =?UTF-8?q?enhance(frontend):=20=E3=83=9F=E3=83=A5?=
 =?UTF-8?q?=E3=83=BC=E3=83=88=E3=81=97=E3=81=9F=E7=B5=B5=E6=96=87=E5=AD=97?=
 =?UTF-8?q?=E3=82=92=E3=83=87=E3=83=90=E3=82=A4=E3=82=B9=E9=96=93=E3=81=A7?=
 =?UTF-8?q?=E5=90=8C=E6=9C=9F=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86?=
 =?UTF-8?q?=E3=81=AB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Resolve #16158
---
 CHANGELOG.md                                  |  1 +
 .../pages/settings/mute-block.emoji-mute.vue  | 68 +++++++++++++------
 .../src/pages/settings/mute-block.vue         |  4 +-
 3 files changed, 50 insertions(+), 23 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 482827d716..2b8cd9f070 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - Feat: 画像にウォーターマークを付与できるようになりました
 - Enhance: ノートのリアクション一覧で、押せるリアクションを優先して表示できるようにするオプションを追加
 - Enhance: 全てのチャットメッセージを既読にできるように(設定→その他)
+- Enhance: ミュートした絵文字をデバイス間で同期できるように
 - Fix: ドライブファイルの選択が不安定な問題を修正
 - Fix: コントロールパネルのファイル欄などのデザインが崩れている問題を修正
 - Fix: ユーザーの検索結果を追加で読み込むことができない問題を修正
diff --git a/packages/frontend/src/pages/settings/mute-block.emoji-mute.vue b/packages/frontend/src/pages/settings/mute-block.emoji-mute.vue
index 601ca7ee49..ea131381a1 100644
--- a/packages/frontend/src/pages/settings/mute-block.emoji-mute.vue
+++ b/packages/frontend/src/pages/settings/mute-block.emoji-mute.vue
@@ -4,33 +4,45 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<div :class="$style.emojis">
-	<div v-for="emoji in emojis" :key="`emojiMute-${emoji}`" :class="$style.emoji" @click="onEmojiClick($event, emoji)">
-		<MkCustomEmoji
-			v-if="emoji.startsWith(':')"
-			:name="customEmojiName(emoji)"
-			:host="customEmojiHost(emoji)"
-			:normal="true"
-			:menu="false"
-			:menuReaction="false"
-			:ignoreMuted="true"
-		/>
-		<MkEmoji
-			v-else
-			:emoji="emoji"
-			:menu="false"
-			:menuReaction="false"
-			:ignoreMuted="true"
-		></MkEmoji>
+<div class="_gaps_m">
+	<div :class="$style.emojis">
+		<div v-for="emoji in emojis" :key="`emojiMute-${emoji}`" :class="$style.emoji" @click="onEmojiClick($event, emoji)">
+			<MkCustomEmoji
+				v-if="emoji.startsWith(':')"
+				:name="customEmojiName(emoji)"
+				:host="customEmojiHost(emoji)"
+				:normal="true"
+				:menu="false"
+				:menuReaction="false"
+				:ignoreMuted="true"
+			/>
+			<MkEmoji
+				v-else
+				:emoji="emoji"
+				:menu="false"
+				:menuReaction="false"
+				:ignoreMuted="true"
+			></MkEmoji>
+		</div>
 	</div>
-</div>
 
-<MkButton primary inline @click="add"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
+	<MkButton primary inline @click="add"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
+
+	<hr>
+
+	<SearchMarker :keywords="['sync', 'devices']">
+		<MkSwitch :modelValue="syncEnabled" @update:modelValue="changeSyncEnabled">
+			<template #label><i class="ti ti-cloud-cog"></i> <SearchLabel>{{ i18n.ts.syncBetweenDevices }}</SearchLabel></template>
+		</MkSwitch>
+	</SearchMarker>
+</div>
 </template>
 
 <script lang="ts" setup>
+import { ref } from 'vue';
 import type { MenuItem } from '@/types/menu';
 import MkButton from '@/components/MkButton.vue';
+import MkSwitch from '@/components/MkSwitch.vue';
 import * as os from '@/os.js';
 import { i18n } from '@/i18n.js';
 import { prefer } from '@/preferences.js';
@@ -79,7 +91,23 @@ function unmute(emoji: string) {
 		unmuteEmoji(emoji);
 	});
 }
+
+const syncEnabled = ref(prefer.isSyncEnabled('mutingEmojis'));
+
+function changeSyncEnabled(value: boolean) {
+	if (value) {
+		prefer.enableSync('mutingEmojis').then((res) => {
+			if (res == null) return;
+			if (res.enabled) syncEnabled.value = true;
+		});
+	} else {
+		prefer.disableSync('mutingEmojis');
+		syncEnabled.value = false;
+	}
+}
+
 </script>
+
 <style module>
 .emojis {
 	display: flex;
diff --git a/packages/frontend/src/pages/settings/mute-block.vue b/packages/frontend/src/pages/settings/mute-block.vue
index 9b24501cce..9407845923 100644
--- a/packages/frontend/src/pages/settings/mute-block.vue
+++ b/packages/frontend/src/pages/settings/mute-block.vue
@@ -57,9 +57,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<template #icon><i class="ti ti-mood-off"></i></template>
 					<template #label>{{ i18n.ts.emojiMute }}</template>
 
-					<div class="_gaps_m">
-						<XEmojiMute/>
-					</div>
+					<XEmojiMute/>
 				</mkfolder>
 			</SearchMarker>