wip

locales/index.d.ts

@@ -5302,6 +5302,24 @@ export interface Locale extends ILocale {
      * 名前はありません
      */
     "noName": string;
+    /**
+     * スキップ
+     */
+    "skip": string;
+    "_preferencesProfile": {
+        /**
+         * プロファイル名
+         */
+        "profileName": string;
+        /**
+         * このデバイスを識別する名前を設定してください。
+         */
+        "profileNameDescription": string;
+        /**
+         * 例: 「メインPC」、「スマホ」など
+         */
+        "profileNameDescription2": string;
+    };
     "_preferencesBackup": {
         /**
          * 自動バックアップ
@@ -5323,6 +5341,14 @@ export interface Locale extends ILocale {
          * 復元するバックアップを選択してください
          */
         "selectBackupToRestore": string;
+        /**
+         * 自動バックアップを有効にするにはプロファイル名の設定が必要です。
+         */
+        "youNeedToNameYourProfileToEnableAutoBackup": string;
+        /**
+         * このデバイスで設定の自動バックアップは有効になっていません。
+         */
+        "autoPreferencesBackupIsNotEnabledForThisDevice": string;
     };
     "_accountSettings": {
         /**

locales/ja-JP.yml

@@ -1321,13 +1321,21 @@ resetToDefaultValue: "初期値に戻す"
 overrideByAccount: "アカウントで上書き"
 untitled: "無題"
 noName: "名前はありません"
+skip: "スキップ"
+
+_preferencesProfile:
+  profileName: "プロファイル名"
+  profileNameDescription: "このデバイスを識別する名前を設定してください。"
+  profileNameDescription2: "例: 「メインPC」、「スマホ」など"
 
 _preferencesBackup:
   autoBackup: "自動バックアップ"
   restoreFromBackup: "バックアップから復元"
   noBackupsFoundTitle: "バックアップが見つかりませんでした"
   noBackupsFoundDescription: "自動で作成されたバックアップは見つかりませんでしたが、バックアップファイルを手動で保存している場合、それをインポートして復元することはできます。"
   selectBackupToRestore: "復元するバックアップを選択してください"
+  youNeedToNameYourProfileToEnableAutoBackup: "自動バックアップを有効にするにはプロファイル名の設定が必要です。"
+  autoPreferencesBackupIsNotEnabledForThisDevice: "このデバイスで設定の自動バックアップは有効になっていません。"
 
 _accountSettings:
   requireSigninToViewContents: "コンテンツの表示にログインを必須にする"

packages/frontend/src/boot/common.ts

@@ -190,6 +190,12 @@ export async function common(createVue: () => App<Element>) {
 	});
 	//#endregion
 
+	if (prefer.s.darkTheme && store.state.darkMode) {
+		if (miLocalStorage.getItem('themeId') !== prefer.s.darkTheme.id) applyTheme(prefer.s.darkTheme);
+	} else if (prefer.s.lightTheme && !store.state.darkMode) {
+		if (miLocalStorage.getItem('themeId') !== prefer.s.lightTheme.id) applyTheme(prefer.s.lightTheme);
+	}
+
 	fetchInstanceMetaPromise.then(() => {
 		// TODO: instance.defaultLightTheme/instance.defaultDarkThemeが不正な形式だった場合のケア
 		if (prefer.s.lightTheme == null && instance.defaultLightTheme != null) prefer.set('lightTheme', JSON.parse(instance.defaultLightTheme));

packages/frontend/src/local-storage.ts

@@ -27,6 +27,7 @@ export type Keys = (
 	'locale' |
 	'localeVersion' |
 	'theme' |
+	'themeId' |
 	'customCss' |
 	'message_drafts' |
 	'scratchpad' |

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

@@ -12,6 +12,10 @@ SPDX-License-Identifier: AGPL-3.0-only
 				<div v-if="!narrow || currentPage?.route.name == null" class="nav">
 					<div class="baaadecd">
 						<MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
+						<MkInfo v-if="!store.reactiveState.enablePreferencesAutoCloudBackup.value && store.reactiveState.showPreferencesAutoCloudBackupSuggestion.value" class="info">
+							<div>{{ i18n.ts._preferencesBackup.autoPreferencesBackupIsNotEnabledForThisDevice }}</div>
+							<div><button class="_textButton" @click="enableAutoBackup">{{ i18n.ts.enable }}</button> | <button class="_textButton" @click="skipAutoBackup">{{ i18n.ts.skip }}</button></div>
+						</MkInfo>
 						<MkSuperMenu :def="menuDef" :grid="narrow" :searchIndex="SETTING_INDEX"></MkSuperMenu>
 					</div>
 				</div>
@@ -41,7 +45,8 @@ import { definePageMetadata, provideMetadataReceiver, provideReactiveMetadata }
 import * as os from '@/os.js';
 import { useRouter } from '@/router/supplier.js';
 import { searchIndexes } from '@/scripts/autogen/settings-search-index.js';
-import { getPreferencesProfileMenu } from '@/preferences/utility.js';
+import { enableAutoBackup, getPreferencesProfileMenu } from '@/preferences/utility.js';
+import { store } from '@/store.js';
 
 const SETTING_INDEX = searchIndexes; // TODO: lazy load
 
@@ -66,6 +71,10 @@ const ro = new ResizeObserver((entries, observer) => {
 	narrow.value = entries[0].borderBoxSize[0].inlineSize < NARROW_THRESHOLD;
 });
 
+function skipAutoBackup() {
+	store.set('showPreferencesAutoCloudBackupSuggestion', false);
+}
+
 const menuDef = computed<SuperMenuDef[]>(() => [{
 	items: [{
 		icon: 'ti ti-user',

packages/frontend/src/preferences/utility.ts

@@ -4,8 +4,6 @@
  */
 
 import { ref, watch } from 'vue';
-import { apiUrl } from '@@/js/config.js';
-import * as Misskey from 'misskey-js';
 import type { PreferencesProfile } from './profile.js';
 import type { MenuItem } from '@/types/menu.js';
 import { copyToClipboard } from '@/scripts/copy-to-clipboard.js';
@@ -18,13 +16,20 @@ import { $i } from '@/account.js';
 import { misskeyApi } from '@/scripts/misskey-api.js';
 import { unisonReload } from '@/scripts/unison-reload.js';
 
-const BACKUP_FOLDER_NAME = 'Misskey Preferences Backups';
-
 export function getPreferencesProfileMenu(): MenuItem[] {
 	const autoBackupEnabled = ref(store.state.enablePreferencesAutoCloudBackup);
 
 	watch(autoBackupEnabled, () => {
 		if (autoBackupEnabled.value) {
+			if (profileManager.profile.name == null || profileManager.profile.name.trim() === '') {
+				autoBackupEnabled.value = false;
+				os.alert({
+					type: 'warning',
+					title: i18n.ts._preferencesBackup.youNeedToNameYourProfileToEnableAutoBackup,
+				});
+				return;
+			}
+
 			store.set('enablePreferencesAutoCloudBackup', true);
 		} else {
 			store.set('enablePreferencesAutoCloudBackup', false);
@@ -84,11 +89,13 @@ export function getPreferencesProfileMenu(): MenuItem[] {
 
 async function renameProfile() {
 	const { canceled, result: name } = await os.inputText({
-		title: i18n.ts.rename,
+		title: i18n.ts._preferencesProfile.profileName,
+		text: i18n.ts._preferencesProfile.profileNameDescription + '\n' + i18n.ts._preferencesProfile.profileNameDescription2,
 		placeholder: profileManager.profile.name || null,
 		default: profileManager.profile.name || null,
 	});
-	if (canceled || name == null) return;
+	if (canceled || name == null || name.trim() === '') return;
+
 	profileManager.renameProfile(name);
 }
 
@@ -121,10 +128,13 @@ function importProfile() {
 
 export async function cloudBackup() {
 	if ($i == null) return;
+	if (profileManager.profile.name == null || profileManager.profile.name.trim() === '') {
+		throw new Error('Profile name is not set');
+	}
 
 	await misskeyApi('i/registry/set', {
 		scope: ['client', 'preferences', 'backups'],
-		key: profileManager.profile.name || profileManager.profile.id,
+		key: profileManager.profile.name,
 		value: profileManager.profile,
 	});
 }
@@ -166,5 +176,18 @@ async function restoreFromCloudBackup() {
 	console.log(profile);
 
 	miLocalStorage.setItem('preferences', JSON.stringify(profile));
+	store.set('enablePreferencesAutoCloudBackup', true);
 	unisonReload();
 }
+
+export async function enableAutoBackup() {
+	if (profileManager.profile.name == null || profileManager.profile.name.trim() === '') {
+		await renameProfile();
+	}
+
+	if (profileManager.profile.name == null || profileManager.profile.name.trim() === '') {
+		return;
+	}
+
+	store.set('enablePreferencesAutoCloudBackup', true);
+}

packages/frontend/src/scripts/theme.ts

@@ -103,6 +103,7 @@ export function applyTheme(theme: Theme, persist = true) {
 
 	if (persist) {
 		miLocalStorage.setItem('theme', JSON.stringify(props));
+		miLocalStorage.setItem('themeId', theme.id);
 		miLocalStorage.setItem('colorScheme', colorScheme);
 	}
 

packages/frontend/src/store.ts

@@ -178,6 +178,10 @@ export const store = markRaw(new Storage('base', {
 	},
 
 	enablePreferencesAutoCloudBackup: {
+		where: 'device',
+		default: false,
+	},
+	showPreferencesAutoCloudBackupSuggestion: {
 		where: 'device',
 		default: true,
 	},