enhance(frontend): migrate overridedDeviceKind to preference

packages/frontend/src/boot/common.ts

@@ -202,7 +202,7 @@ export async function common(createVue: () => App<Element>) {
 		if (prefer.s.darkTheme == null && instance.defaultDarkTheme != null) prefer.set('darkTheme', JSON.parse(instance.defaultDarkTheme));
 	});
 
-	watch(store.reactiveState.overridedDeviceKind, (kind) => {
+	watch(prefer.r.overridedDeviceKind, (kind) => {
 		updateDeviceKind(kind);
 	}, { immediate: true });
 

packages/frontend/src/boot/main-boot.ts

@@ -154,6 +154,7 @@ export async function mainBoot() {
 				prefer.set('lightTheme', ColdDeviceStorage.get('lightTheme'));
 				prefer.set('darkTheme', ColdDeviceStorage.get('darkTheme'));
 				prefer.set('syncDeviceDarkMode', ColdDeviceStorage.get('syncDeviceDarkMode'));
+				prefer.set('overridedDeviceKind', store.state.overridedDeviceKind);
 				prefer.set('widgets', store.state.widgets);
 				prefer.set('keepCw', store.state.keepCw);
 				prefer.set('collapseRenotes', store.state.collapseRenotes);

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

@@ -385,8 +385,7 @@ import MkPreferenceContainer from '@/components/MkPreferenceContainer.vue';
 const lang = ref(miLocalStorage.getItem('lang'));
 const dataSaver = ref(prefer.s.dataSaver);
 
-const overridedDeviceKind = computed(store.makeGetterSetter('overridedDeviceKind'));
-
+const overridedDeviceKind = prefer.model('overridedDeviceKind');
 const keepCw = prefer.model('keepCw');
 const serverDisconnectedBehavior = prefer.model('serverDisconnectedBehavior');
 const hemisphere = prefer.model('hemisphere');

packages/frontend/src/pizzax.ts

@@ -237,6 +237,7 @@ export class Storage<T extends StateDef> {
 	 * 特定のキーの、簡易的なgetter/setterを作ります
 	 * 主にvue上で設定コントロールのmodelとして使う用
 	 */
+	// TODO: 廃止
 	public makeGetterSetter<K extends keyof T, R = T[K]['default']>(
 		key: K,
 		getter?: (v: T[K]['default']) => R,

packages/frontend/src/preferences/def.ts

@@ -8,6 +8,7 @@ import { hemisphere } from '@@/js/intl-const.js';
 import type { Theme } from '@/theme.js';
 import type { SoundType } from '@/utility/sound.js';
 import type { Plugin } from '@/plugin.js';
+import type { DeviceKind } from '@/utility/device-kind.js';
 import { DEFAULT_DEVICE_KIND } from '@/utility/device-kind.js';
 
 /** サウンド設定 */
@@ -45,6 +46,9 @@ export const PREF_DEF = {
 		}[],
 	},
 
+	overridedDeviceKind: {
+		default: null as DeviceKind | null,
+	},
 	themes: {
 		default: [] as Theme[],
 	},

packages/frontend/src/store.ts

@@ -81,10 +81,6 @@ export const store = markRaw(new Storage('base', {
 			},
 		},
 	},
-	overridedDeviceKind: {
-		where: 'device',
-		default: null as DeviceKind | null,
-	},
 	darkMode: {
 		where: 'device',
 		default: false,
@@ -153,6 +149,10 @@ export const store = markRaw(new Storage('base', {
 			data: Record<string, any>;
 		}[],
 	},
+	overridedDeviceKind: {
+		where: 'device',
+		default: null as DeviceKind | null,
+	},
 	defaultSideView: {
 		where: 'device',
 		default: false,