enhance(client/friendly): ヘッダーに通知領域有効化ボタンを追加

locales/en-US.yml

@@ -1097,7 +1097,7 @@ additionalEmojiDictionary: "Additional emoji dictionaries"
 installed: "Installed"
 performanceWarning: "High resource usage can result in higher device temperatures and faster battery consumption"
 photosensitiveSeizuresWarning: "Can cause photosensitive seizures"
-friendlyEnableNotification: "Enable notification area (Friendly UI only)"
+friendlyEnableNotification: "Enable/Disable the notification area"
 _initialAccountSetting:
   accountCreated: "Your account was successfully created!"
   letsStartAccountSetup: "For starters, let's set up your profile."

locales/ja-JP.yml

@@ -1097,7 +1097,7 @@ additionalEmojiDictionary: "絵文字の追加辞書"
 installed: "インストール済み"
 performanceWarning: "リソースを多く使用するため、デバイスの温度が高くなり、バッテリーの消耗が速くなる可能性があります"
 photosensitiveSeizuresWarning: "光敏感性発作を起こす可能性があります"
-friendlyEnableNotification: "通知領域を有効にする（Friendly UIのみ）"
+friendlyEnableNotification: "通知領域を有効化/無効化"
 
 _initialAccountSetting:
   accountCreated: "アカウントの作成が完了しました！"

locales/ko-KR.yml

@@ -1098,7 +1098,7 @@ additionalEmojiDictionary: "이모지 추가 사전"
 installed: "설치됨"
 performanceWarning: "리소스를 많이 사용하므로, 디바이스의 온도가 높아지고 배터리의 소모가 빨라질 수 있어요"
 photosensitiveSeizuresWarning: "광과민성 발작을 일으킬 수 있어요"
-friendlyEnableNotification: "알림 영역 활성화(Friendly UI 전용)"
+friendlyEnableNotification: "알림 영역 활성화/비활성화"
 _initialAccountSetting:
   accountCreated: "계정 생성이 완료되었어요!"
   letsStartAccountSetup: "계정의 초기 설정을 진행해 볼까요?"

packages/frontend/src/pages/settings/general.vue

@@ -119,9 +119,6 @@
 				<MkSwitch v-model="forceShowAds">{{ i18n.ts.forceShowAds }}</MkSwitch>
 				<MkSwitch v-model="enableDataSaverMode">{{ i18n.ts.dataSaver }}</MkSwitch>
 			</div>
-			<div class="_gaps_s">
-				<MkSwitch v-model="friendlyEnableNotification">{{ i18n.ts.friendlyEnableNotification }}</MkSwitch>
-			</div>
 			<div>
 				<MkRadios v-model="emojiStyle">
 					<template #label>{{ i18n.ts.emojiStyle }}</template>
@@ -320,7 +317,6 @@ const useEnterToSend = computed(defaultStore.makeGetterSetter('useEnterToSend'))
 const postFormVisibilityHotkey = computed(defaultStore.makeGetterSetter('postFormVisibilityHotkey'));
 const newNoteRecivedNotificationBehavior = computed(defaultStore.makeGetterSetter('newNoteRecivedNotificationBehavior'));
 const fontSize = computed(defaultStore.makeGetterSetter('fontSize'));
-const friendlyEnableNotification = computed(defaultStore.makeGetterSetter('friendlyEnableNotification'));
 
 watch(lang, () => {
 	miLocalStorage.setItem('lang', lang.value as string);

packages/frontend/src/pages/settings/preferences-backups.vue

@@ -90,7 +90,6 @@ const defaultStoreSaveKeys: (keyof typeof defaultStore['state'])[] = [
 	'useEnterToSend',
 	'postFormVisibilityHotkey',
 	'newNoteRecivedNotificationBehavior',
-	'friendlyEnableNotification',
 ];
 const coldDeviceStorageSaveKeys: (keyof typeof ColdDeviceStorage.default)[] = [
 	'lightTheme',

packages/frontend/src/pages/timeline.vue

@@ -1,7 +1,8 @@
 <template>
 <MkStickyContainer>
 	<template #header>
-		<MkPageHeader v-model:tab="src" style="position: relative; z-index: 1001" :actions="headerActions" :tabs="$i ? headerTabs : headerTabsWhenNotLogin" :displayMyAvatar="true"/>
+		<MkPageHeader v-if="isMobile || !isFriendly" v-model:tab="src" style="position: relative; z-index: 1001" :tabs="$i ? headerTabs : headerTabsWhenNotLogin" :displayMyAvatar="true"/>
+		<MkPageHeader v-else v-model:tab="src" style="position: relative; z-index: 1001" :actions="headerActions" :tabs="$i ? headerTabs : headerTabsWhenNotLogin" :displayMyAvatar="true"/>
 	</template>
 	<MkSpacer :contentMax="800">
 		<div ref="rootEl" v-hotkey.global="keymap">
@@ -53,6 +54,7 @@ import { definePageMetadata } from '@/scripts/page-metadata';
 import { eventBus } from '@/scripts/cherrypick/eventBus';
 import { miLocalStorage } from '@/local-storage';
 import { deviceKind } from '@/scripts/device-kind';
+import {unisonReload} from "@/scripts/unison-reload";
 
 let showEl = $ref(false);
 const isFriendly = ref(miLocalStorage.getItem('ui') === 'friendly');
@@ -153,7 +155,27 @@ function focus(): void {
 	tlComponent.focus();
 }
 
-const headerActions = $computed(() => []);
+async function reloadAsk() {
+	const { canceled } = await os.confirm({
+		type: 'info',
+		text: i18n.ts.reloadToApplySetting,
+	});
+	if (canceled) return;
+
+	unisonReload();
+}
+
+const headerActions = $computed(() => [{
+	asFullButton: true,
+	icon: 'ti ti-column-insert-left',
+	text: i18n.ts.friendlyEnableNotification,
+	handler: () => {
+		friendlyEnableNotification.value = !friendlyEnableNotification.value;
+		reloadAsk();
+	},
+}]);
+
+const friendlyEnableNotification = computed(defaultStore.makeGetterSetter('friendlyEnableNotification'));
 
 const headerTabs = $computed(() => [{
 	key: 'home',