fix(pizzax): nullの設定値がデフォルトに置き換えられてしまう問題を修正

packages/frontend/package.json

@@ -44,7 +44,6 @@
 		"compare-versions": "6.1.0",
 		"cropperjs": "2.0.0-beta.4",
 		"date-fns": "2.30.0",
-		"defu": "^6.1.4",
 		"escape-regexp": "0.0.1",
 		"estree-walker": "3.0.3",
 		"eventemitter3": "5.0.1",
@@ -52,6 +51,7 @@
 		"insert-text-at-cursor": "0.3.0",
 		"is-file-animated": "1.0.2",
 		"json5": "2.2.3",
+		"lodash.defaultsdeep": "4.6.1",
 		"matter-js": "0.19.0",
 		"mfm-js": "0.24.0",
 		"misskey-bubble-game": "workspace:*",
@@ -101,6 +101,7 @@
 		"@testing-library/vue": "8.0.1",
 		"@types/escape-regexp": "0.0.3",
 		"@types/estree": "1.0.5",
+		"@types/lodash.defaultsdeep": "4.6.9",
 		"@types/matter-js": "0.19.6",
 		"@types/micromatch": "4.0.6",
 		"@types/node": "20.11.5",

packages/frontend/src/pizzax.ts

@@ -7,7 +7,7 @@
 
 import { onUnmounted, Ref, ref, watch } from 'vue';
 import { BroadcastChannel } from 'broadcast-channel';
-import { defu } from 'defu';
+import defaultsDeep from 'lodash.defaultsdeep';
 import { $i } from '@/account.js';
 import { misskeyApi } from '@/scripts/misskey-api.js';
 import { get, set } from '@/scripts/idb-proxy.js';
@@ -81,18 +81,6 @@ export class Storage<T extends StateDef> {
 		this.loaded = this.ready.then(() => this.load());
 	}
 
-	private isPureObject(value: unknown): value is Record<string, unknown> {
-		return typeof value === 'object' && value !== null && !Array.isArray(value);
-	}
-
-	private mergeState<T>(value: T, def: T): T {
-		if (this.isPureObject(value) && this.isPureObject(def)) {
-			if (_DEV_) console.log('Merging state. Incoming: ', value, ' Default: ', def);
-			return defu(value, def) as T;
-		}
-		return value;
-	}
-
 	private async init(): Promise<void> {
 		await this.migrate();
 
@@ -102,11 +90,11 @@ export class Storage<T extends StateDef> {
 
 		for (const [k, v] of Object.entries(this.def) as [keyof T, T[keyof T]['default']][]) {
 			if (v.where === 'device' && Object.prototype.hasOwnProperty.call(deviceState, k)) {
-				this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(deviceState[k], v.default);
+				this.reactiveState[k].value = this.state[k] = defaultsDeep(deviceState[k], v.default);
 			} else if (v.where === 'account' && $i && Object.prototype.hasOwnProperty.call(registryCache, k)) {
-				this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(registryCache[k], v.default);
+				this.reactiveState[k].value = this.state[k] = defaultsDeep(registryCache[k], v.default);
 			} else if (v.where === 'deviceAccount' && Object.prototype.hasOwnProperty.call(deviceAccountState, k)) {
-				this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(deviceAccountState[k], v.default);
+				this.reactiveState[k].value = this.state[k] = defaultsDeep(deviceAccountState[k], v.default);
 			} else {
 				this.reactiveState[k].value = this.state[k] = v.default;
 				if (_DEV_) console.log('Use default value', k, v.default);

pnpm-lock.yaml

@@ -746,9 +746,6 @@ importers:
       date-fns:
         specifier: 2.30.0
         version: 2.30.0
-      defu:
-        specifier: ^6.1.4
-        version: 6.1.4
       escape-regexp:
         specifier: 0.0.1
         version: 0.0.1
@@ -770,6 +767,9 @@ importers:
       json5:
         specifier: 2.2.3
         version: 2.2.3
+      lodash.defaultsdeep:
+        specifier: 4.6.1
+        version: 4.6.1
       matter-js:
         specifier: 0.19.0
         version: 0.19.0
@@ -912,6 +912,9 @@ importers:
       '@types/estree':
         specifier: 1.0.5
         version: 1.0.5
+      '@types/lodash.defaultsdeep':
+        specifier: 4.6.9
+        version: 4.6.9
       '@types/matter-js':
         specifier: 0.19.6
         version: 0.19.6
@@ -7813,6 +7816,12 @@ packages:
       '@types/node': 20.11.5
     dev: false
 
+  /@types/lodash.defaultsdeep@4.6.9:
+    resolution: {integrity: sha512-pLtCFK0YkHfGtGLYLNMTbFB5/G5+RsmQCIbbHH8GOAXjv+gDkVilY98kILfe8JH2Kev0OCReYxp1AjxEjP8ixA==}
+    dependencies:
+      '@types/lodash': 4.14.202
+    dev: true
+
   /@types/lodash@4.14.202:
     resolution: {integrity: sha512-OvlIYQK9tNneDlS0VN54LLd5uiPCBOp7gS5Z0f1mjoJYBrtStzgmJBxONW3U6OZqdtNzZPmn9BS/7WI7BFFcFQ==}
     dev: true
@@ -10589,6 +10598,7 @@ packages:
 
   /defu@6.1.4:
     resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==}
+    dev: true
 
   /del@6.1.1:
     resolution: {integrity: sha512-ua8BhapfP0JUJKC/zV9yHHDW/rDoDxP4Zhn3AkA6/xT6gY7jYXJiaeyBZznYVujhZZET+UgcbZiQ7sN3WqcImg==}
@@ -14155,6 +14165,10 @@ packages:
     resolution: {integrity: sha512-qjxPLHd3r5DnsdGacqOMU6pb/avJzdh9tFX2ymgoZE27BmjXrNy/y4LoaiTeAb+O3gL8AfpJGtqfX/ae2leYYQ==}
     dev: false
 
+  /lodash.defaultsdeep@4.6.1:
+    resolution: {integrity: sha512-3j8wdDzYuWO3lM3Reg03MuQR957t287Rpcxp1njpEa8oDrikb+FwGdW3n+FELh/A6qib6yPit0j/pv9G/yeAqA==}
+    dev: false
+
   /lodash.get@4.4.2:
     resolution: {integrity: sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==}
     dev: true