fix(frontend): まれにリアクション・絵文字ピッカーが動作しなくなる問題を修正 (#17349)

* Revert "fix(frontend): popupのりアクティビティがチャンクをまたいで切れる事がある問題を修正"

This reverts commit 0a93f526dd.

* fix: iOS PWA でリアクション・絵文字ピッカーが動作しない問題を修正

Agent-Logs-Url: https://github.com/lqvp/misskey-tempura/sessions/44526368-0e6a-4a94-8991-fcdc094d2b96

Co-authored-by: lqvp <183242690+lqvp@users.noreply.github.com>

* refactor

* fix

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: lqvp <183242690+lqvp@users.noreply.github.com>

packages/frontend/src/os.ts

@@ -5,9 +5,9 @@
 
 // TODO: なんでもかんでもos.tsに突っ込むのやめたいのでよしなに分割する
 
-import { markRaw, ref, defineAsyncComponent, nextTick, effectScope, isRef, shallowReactive, watch } from 'vue';
+import { markRaw, ref, defineAsyncComponent, nextTick } from 'vue';
 import * as Misskey from 'misskey-js';
-import type { Component, MaybeRef, ShallowReactive } from 'vue';
+import type { Component, MaybeRef } from 'vue';
 import type { ComponentEmit, ComponentProps as CP } from 'vue-component-type-helpers';
 import type { Form, GetFormResultType } from '@/utility/form.js';
 import type { MenuItem } from '@/types/menu.js';
@@ -145,7 +145,7 @@ let popupIdCount = 0;
 export const popups = ref<{
 	id: number;
 	component: Component;
-	props: ShallowReactive<Record<string, any>>;
+	props: Record<string, any>;
 	events: Record<string, any>;
 }[]>([]);
 
@@ -183,32 +183,6 @@ type ComponentEmitsObject<C extends Component, IE = OverloadToUnion<ComponentEmi
 		: (...args: any[]) => void;
 }>;
 
-// ref をそのまま保持せず popup 側の reactive props に同期するようにして、スコープをまたいでリアクティビティが切れるのを防止する
-function normalizePopupProps<T extends Record<string, any>>(props: T): {
-	resolvedProps: ShallowReactive<T>;
-	stopSync: () => void;
-} {
-	const resolvedProps = shallowReactive<T>({} as T) as T; // shallowReactiveの返り値はreadonlyだが、実際には書き換えるので元の型で扱う
-	const scope = effectScope();
-
-	scope.run(() => {
-		for (const [key, value] of Object.entries(props)) {
-			if (isRef(value)) {
-				watch(value, (resolvedValue) => {
-					resolvedProps[key as keyof T] = resolvedValue as T[keyof T];
-				}, { immediate: true });
-			} else {
-				resolvedProps[key as keyof T] = value;
-			}
-		}
-	});
-
-	return {
-		resolvedProps: resolvedProps as ShallowReactive<T>,
-		stopSync: () => scope.stop(),
-	};
-}
-
 // NOTE: ジェネリック型つきのコンポーネントでは、emitsの型推論がうまく働かない（型変数を取り出すことはできないため）
 // NOTE: emitsがOverloadToUnionで対応しているオーバーロードの数を超える場合は、OverloadToUnionの個数を増やせばOK
 export function popup<T extends Component>(
@@ -219,24 +193,20 @@ export function popup<T extends Component>(
 	markRaw(component);
 
 	const id = ++popupIdCount;
-	const { resolvedProps, stopSync } = normalizePopupProps(props);
-	let disposed = false;
 	const dispose = () => {
-		if (disposed) return;
-		disposed = true;
-		stopSync();
-
+		// このsetTimeoutが無いと挙動がおかしくなる(autocompleteが閉じなくなる)。Vueのバグ？
 		nextTick(() => {
 			popups.value = popups.value.filter(p => p.id !== id);
 		});
 	};
-
-	popups.value.push({
+	const state = {
 		component,
-		props: resolvedProps,
+		props,
 		events,
 		id,
-	});
+	};
+
+	popups.value.push(state);
 
 	return {
 		dispose,