From 8f300cf4601776e00ebe72b6f6fa5fb755dec6d3 Mon Sep 17 00:00:00 2001
From: KevinWh0 <45321184+KevinWh0@users.noreply.github.com>
Date: Sat, 16 Mar 2024 01:23:02 +0100
Subject: [PATCH] added setting

---
 locales/en-US.yml                                      |  1 +
 locales/index.d.ts                                     |  4 ++++
 locales/ja-JP.yml                                      |  1 +
 packages/frontend/src/pages/settings/general.vue       |  2 ++
 .../src/pages/settings/preferences-backups.vue         |  1 +
 packages/frontend/src/store.ts                         |  4 ++++
 packages/frontend/src/ui/_common_/common.vue           | 10 ++++------
 7 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/locales/en-US.yml b/locales/en-US.yml
index 80e45c42d8..e22b92e2f6 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -688,6 +688,7 @@ channel: "Channels"
 create: "Create"
 notificationSetting: "Notification settings"
 notificationSettingDesc: "Select the types of notification to display."
+enableFaviconNotificationDot: "Enable favicon notification dot"
 useGlobalSetting: "Use global settings"
 useGlobalSettingDesc: "If turned on, your account's notification settings will be used. If turned off, individual configurations can be made."
 other: "Other"
diff --git a/locales/index.d.ts b/locales/index.d.ts
index e407d2119b..422f1c8429 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -2764,6 +2764,10 @@ export interface Locale extends ILocale {
      * 表示する通知の種別を選択してください。
      */
     "notificationSettingDesc": string;
+    /**
+     * ファビコン通知ドットを有効にする
+     */
+    "enableFaviconNotificationDot": string;
     /**
      * グローバル設定を使う
      */
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 57f52c64b2..e20907e6b7 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -687,6 +687,7 @@ channel: "チャンネル"
 create: "作成"
 notificationSetting: "通知設定"
 notificationSettingDesc: "表示する通知の種別を選択してください。"
+enableFaviconNotificationDot: "ファビコン通知ドットを有効にする"
 useGlobalSetting: "グローバル設定を使う"
 useGlobalSettingDesc: "オンにすると、アカウントの通知設定が使用されます。オフにすると、個別に設定できるようになります。"
 other: "その他"
diff --git a/packages/frontend/src/pages/settings/general.vue b/packages/frontend/src/pages/settings/general.vue
index 1e4e815d5d..b216622c33 100644
--- a/packages/frontend/src/pages/settings/general.vue
+++ b/packages/frontend/src/pages/settings/general.vue
@@ -180,6 +180,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 
 		<div class="_gaps_m">
 			<div class="_gaps_s">
+				<MkSwitch v-model="enableFaviconNotificationDot">{{ i18n.ts.enableFaviconNotificationDot }}</MkSwitch>
 				<MkSwitch v-model="warnMissingAltText">{{ i18n.ts.warnForMissingAltText }}</MkSwitch>
 				<MkSwitch v-model="imageNewTab">{{ i18n.ts.openImageInNewTab }}</MkSwitch>
 				<MkSwitch v-model="useReactionPickerForContextMenu">{{ i18n.ts.useReactionPickerForContextMenu }}</MkSwitch>
@@ -337,6 +338,7 @@ const oneko = computed(defaultStore.makeGetterSetter('oneko'));
 const loadRawImages = computed(defaultStore.makeGetterSetter('loadRawImages'));
 const highlightSensitiveMedia = computed(defaultStore.makeGetterSetter('highlightSensitiveMedia'));
 const imageNewTab = computed(defaultStore.makeGetterSetter('imageNewTab'));
+const enableFaviconNotificationDot = computed(defaultStore.makeGetterSetter('enableFaviconNotificationDot'));
 const warnMissingAltText = computed(defaultStore.makeGetterSetter('warnMissingAltText'));
 const nsfw = computed(defaultStore.makeGetterSetter('nsfw'));
 const showFixedPostForm = computed(defaultStore.makeGetterSetter('showFixedPostForm'));
diff --git a/packages/frontend/src/pages/settings/preferences-backups.vue b/packages/frontend/src/pages/settings/preferences-backups.vue
index f180e0b72c..86b8debe3a 100644
--- a/packages/frontend/src/pages/settings/preferences-backups.vue
+++ b/packages/frontend/src/pages/settings/preferences-backups.vue
@@ -72,6 +72,7 @@ const defaultStoreSaveKeys: (keyof typeof defaultStore['state'])[] = [
 	'advancedMfm',
 	'loadRawImages',
 	'warnMissingAltText',
+	'enableFaviconNotificationDot',
 	'imageNewTab',
 	'dataSaver',
 	'disableShowingAnimatedImages',
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 2cf17b27c5..7f6377613e 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -268,6 +268,10 @@ export const defaultStore = markRaw(new Storage('base', {
 		where: 'device',
 		default: true,
 	},
+	enableFaviconNotificationDot: {
+		where: 'device',
+		default: true,
+	},
 	imageNewTab: {
 		where: 'device',
 		default: false,
diff --git a/packages/frontend/src/ui/_common_/common.vue b/packages/frontend/src/ui/_common_/common.vue
index 70097d89ab..77148835f8 100644
--- a/packages/frontend/src/ui/_common_/common.vue
+++ b/packages/frontend/src/ui/_common_/common.vue
@@ -80,8 +80,6 @@ class NotificationFavIconDot {
 	constructor() {
 		this.canvas = document.createElement('canvas');
 
-		if (this.faviconEL == null) return;
-
 		this.src = this.faviconEL.getAttribute('href');
 		this.ctx = this.canvas.getContext('2d');
 
@@ -162,11 +160,11 @@ function onNotification(notification: Misskey.entities.Notification, isClient =
 if ($i) {
 	const connection = useStream().useChannel('main', null, 'UI');
 	connection.on('notification', onNotification);
-	
-	watch(() => $i?.hasUnreadNotification, (hasAny) => notificationDot.setVisible(hasAny ?? false));
-	
-	if ($i.hasUnreadNotification) notificationDot.setVisible(true);
 
+	watch(() => $i?.hasUnreadNotification, (hasAny) => notificationDot.setVisible((defaultStore.state.enableFaviconNotificationDot ? hasAny : false) ?? false));
+
+	if ($i.hasUnreadNotification && defaultStore.state.enableFaviconNotificationDot) notificationDot.setVisible(true);
+	
 	globalEvents.on('clientNotification', notification => onNotification(notification, true));
 
 	//#region Listen message from SW