Merge pull request #17217 from misskey-dev/develop

Release: 2026.3.0

2 files changed, 35 insertions, 36 deletions

diff --git a/packages/frontend/src/lib/nirax.ts b/packages/frontend/src/lib/nirax.ts
index 74dda9decd..ce77a2baa9 100644
--- a/packages/frontend/src/lib/nirax.ts
+++ b/packages/frontend/src/lib/nirax.ts
@@ -125,7 +125,7 @@ type GetSinglePathQuery<Def extends RouteDef, Path extends FlattenAllPaths<Route
 					? ChildPath extends FlattenAllPaths<Children>
 						? GetPathQuery<Children, ChildPath>
 						: Record<string, never>
-				: never
+					: never
 				: never
 			: never
 		: Def['path'] extends Path
@@ -133,9 +133,9 @@ type GetSinglePathQuery<Def extends RouteDef, Path extends FlattenAllPaths<Route
 				? Query extends Record<string, string>
 					? UnwrapReadOnly<{ [Key in keyof Query]?: string; }>
 					: Record<string, never>
+				: Record<string, never>
 			: Record<string, never>
-		: Record<string, never>
-	>;
+>;
 
 type GetPathQuery<Defs extends RouteDef[], Path extends FlattenAllPaths<Defs>> = GetSinglePathQuery<Defs[number], Path>;
 
@@ -320,11 +320,11 @@ export class Nirax<DEF extends RouteDef[]> extends EventEmitter<RouterEvents> {
 
 					if (route.query != null && queryString != null) {
 						const queryObject = [...new URLSearchParams(queryString).entries()]
-							.reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {});
+							.reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {}) as Record<string, string>;
 
 						for (const q in route.query) {
 							const as = route.query[q];
-							if (queryObject[q]) {
+							if (queryObject[q] != null) {
 								props.set(as, safeURIDecode(queryObject[q]));
 							}
 						}
diff --git a/packages/frontend/src/lib/pizzax.ts b/packages/frontend/src/lib/pizzax.ts
index 80543d10e4..0dd8a82957 100644
--- a/packages/frontend/src/lib/pizzax.ts
+++ b/packages/frontend/src/lib/pizzax.ts
@@ -7,7 +7,7 @@
 
 // TODO: Misskeyのドメイン知識があるのでutilityなどに移動する
 
-import { onUnmounted, ref, watch } from 'vue';
+import { customRef, ref, watch, onScopeDispose } from 'vue';
 import { BroadcastChannel } from 'broadcast-channel';
 import type { Ref } from 'vue';
 import { $i } from '@/i.js';
@@ -223,44 +223,43 @@ export class Pizzax<T extends StateDef> {
 	}
 
 	/**
-	 * 特定のキーの、簡易的なgetter/setterを作ります
+	 * 特定のキーの、簡易的なcomputed refを作ります
 	 * 主にvue上で設定コントロールのmodelとして使う用
 	 */
-	// TODO: 廃止
-	public makeGetterSetter<K extends keyof T, R = T[K]['default']>(
+	public model<K extends keyof T, R = T[K]['default']>(
+		key: K,
+	): Ref<R>;
+	public model<K extends keyof T, R extends Exclude<any, T[K]['default']>>(
+		key: K,
+		getter: (v: T[K]['default']) => R,
+		setter: (v: R) => T[K]['default'],
+	): Ref<R>;
+
+	public model<K extends keyof T, R>(
 		key: K,
 		getter?: (v: T[K]['default']) => R,
 		setter?: (v: R) => T[K]['default'],
-	): {
-			get: () => R;
-			set: (value: R) => void;
-		} {
-		const valueRef = ref(this.s[key]);
+	): Ref<R> {
+		return customRef<R>((track, trigger) => {
+			const watchStop = watch(this.r[key], () => {
+				trigger();
+			});
 
-		const stop = watch(this.r[key], val => {
-			valueRef.value = val;
-		});
+			onScopeDispose(() => {
+				watchStop();
+			}, true);
 
-		// NOTE: vueコンポーネント内で呼ばれない限りは、onUnmounted は無意味なのでメモリリークする
-		onUnmounted(() => {
-			stop();
+			return {
+				get: () => {
+					track();
+					return (getter != null ? getter(this.s[key]) : this.s[key]) as R;
+				},
+				set: (value) => {
+					const val = setter != null ? setter(value) : value;
+					this.set(key, val as T[K]['default']);
+				},
+			};
 		});
-
-		// TODO: VueのcustomRef使うと良い感じになるかも
-		return {
-			get: () => {
-				if (getter) {
-					return getter(valueRef.value);
-				} else {
-					return valueRef.value;
-				}
-			},
-			set: (value) => {
-				const val = setter ? setter(value) : value;
-				this.set(key, val);
-				valueRef.value = val;
-			},
-		};
 	}
 
 	// localStorage => indexedDBのマイグレーション