Refactor

src/client/components/drive.folder.vue

@@ -248,8 +248,8 @@ export default defineComponent({
 			os.contextMenu([{
 				text: this.$t('openInWindow'),
 				icon: faWindowRestore,
-				action: async () => {
-					os.popup(await import('./drive-window.vue'), {
+				action: () => {
+					os.popup(import('./drive-window.vue'), {
 						initialFolder: this.folder
 					}, {
 					}, 'closed');

src/client/components/link.vue

@@ -46,7 +46,7 @@ export default defineComponent({
 			if (!document.body.contains(this.$el)) return;
 			if (this.close) return;
 
-			const { dispose } = os.popup(await import('@/components/url-preview-popup.vue'), {
+			const { dispose } = await os.popup(import('@/components/url-preview-popup.vue'), {
 				url: this.url,
 				source: this.$el
 			});

src/client/components/note.vue

@@ -498,7 +498,7 @@ export default defineComponent({
 		react(viaKeyboard = false) {
 			pleaseLogin();
 			this.blur();
-			os.popup(defineAsyncComponent(() => import('@/components/reaction-picker.vue')), {
+			os.popup(import('@/components/reaction-picker.vue'), {
 				showFocus: viaKeyboard,
 				src: this.$refs.reactButton,
 			}, {
@@ -644,7 +644,7 @@ export default defineComponent({
 						text: this.$t('reportAbuse'),
 						action: () => {
 							const u = `${url}/notes/${this.appearNote.id}`;
-							os.popup(defineAsyncComponent(() => import('@/components/abuse-report-window.vue')), {
+							os.popup(import('@/components/abuse-report-window.vue'), {
 								user: this.appearNote.user,
 								initialComment: `Note: ${u}\n-----\n`
 							}, {}, 'closed');

src/client/components/post-form.vue

@@ -378,13 +378,13 @@ export default defineComponent({
 			this.saveDraft();
 		},
 
-		async setVisibility() {
+		setVisibility() {
 			if (this.channel) {
 				// TODO: information dialog
 				return;
 			}
 
-			os.popup(await import('./visibility-picker.vue'), {
+			os.popup(import('./visibility-picker.vue'), {
 				currentVisibility: this.visibility,
 				currentLocalOnly: this.localOnly,
 				src: this.$refs.visibilityButton

src/client/components/sidebar.vue

@@ -257,8 +257,8 @@ export default defineComponent({
 			}], ev.currentTarget || ev.target);
 		},
 
-		async addAcount() {
-			os.popup(await import('./signin-dialog.vue'), {}, {
+		addAcount() {
+			os.popup(import('./signin-dialog.vue'), {}, {
 				done: res => {
 					this.$store.dispatch('addAcount', res);
 					os.success();
@@ -266,8 +266,8 @@ export default defineComponent({
 			}, 'closed');
 		},
 
-		async createAccount() {
-			os.popup(await import('./signup-dialog.vue'), {}, {
+		createAccount() {
+			os.popup(import('./signup-dialog.vue'), {}, {
 				done: res => {
 					this.$store.dispatch('addAcount', res);
 					this.switchAccountWithToken(res.i);
@@ -275,7 +275,7 @@ export default defineComponent({
 			}, 'closed');
 		},
 
-		async switchAccount(account: any) {
+		switchAccount(account: any) {
 			const token = this.$store.state.device.accounts.find((x: any) => x.id === account.id).token;
 			this.switchAccountWithToken(token);
 		},

src/client/components/taskmanager.vue

@@ -119,8 +119,8 @@ export default defineComponent({
 			os.popups.value = os.popups.value.filter(x => x !== p);
 		};
 
-		const showReq = async req => {
-			os.popup(await import('./taskmanager.api-window.vue'), {
+		const showReq = req => {
+			os.popup(import('./taskmanager.api-window.vue'), {
 				req: req
 			}, {
 			}, 'closed');

src/client/components/url.vue

@@ -71,7 +71,7 @@ export default defineComponent({
 			if (!document.body.contains(this.$el)) return;
 			if (this.close) return;
 
-			const { dispose } = os.popup(await import('@/components/url-preview-popup.vue'), {
+			const { dispose } = await os.popup(import('@/components/url-preview-popup.vue'), {
 				url: this.url,
 				source: this.$el
 			});

src/client/directives/tooltip.ts

@@ -23,13 +23,13 @@ export default {
 			}
 		};
 
-		const show = async e => {
+		const show = e => {
 			if (!document.body.contains(el)) return;
 			if (self._close) return;
 			if (self.text == null) return;
 
 			const showing = ref(true);
-			popup(await import('@/components/ui/tooltip.vue'), {
+			popup(import('@/components/ui/tooltip.vue'), {
 				showing,
 				text: self.text,
 				source: el

src/client/directives/user-preview.ts

@@ -18,13 +18,13 @@ export class UserPreview {
 	}
 
 	@autobind
-	private async show() {
+	private show() {
 		if (!document.body.contains(this.el)) return;
 		if (this.promise) return;
 
 		const showing = ref(true);
 
-		popup(await import('@/components/user-preview.vue'), {
+		popup(import('@/components/user-preview.vue'), {
 			showing,
 			q: this.user,
 			source: this.el

src/client/os.ts

@@ -147,7 +147,9 @@ export const popups = ref([]) as Ref<{
 	props: Record<string, any>;
 }[]>;
 
-export function popup(component: Component | typeof import('*.vue'), props: Record<string, any>, events = {}, disposeEvent?: string) {
+export async function popup(component: Component | typeof import('*.vue') | Promise<Component | typeof import('*.vue')>, props: Record<string, any>, events = {}, disposeEvent?: string) {
+	if (component.then) component = await component;
+
 	if (isModule(component)) component = component.default;
 	markRaw(component);
 
@@ -179,7 +181,7 @@ export function popup(component: Component | typeof import('*.vue'), props: Reco
 
 export function pageWindow(path: string) {
 	const { component, props } = resolve(path);
-	popup(defineAsyncComponent(() => import('@/components/page-window.vue')), {
+	popup(import('@/components/page-window.vue'), {
 		initialPath: path,
 		initialComponent: markRaw(component),
 		initialProps: props,
@@ -188,7 +190,7 @@ export function pageWindow(path: string) {
 
 export function dialog(props: Record<string, any>) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/dialog.vue')), props, {
+		popup(import('@/components/dialog.vue'), props, {
 			done: result => {
 				resolve(result ? result : { canceled: true });
 			},
@@ -202,7 +204,7 @@ export function success() {
 		setTimeout(() => {
 			showing.value = false;
 		}, 1000);
-		popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
+		popup(import('@/components/waiting-dialog.vue'), {
 			success: true,
 			showing: showing
 		}, {
@@ -214,7 +216,7 @@ export function success() {
 export function waiting() {
 	return new Promise((resolve, reject) => {
 		const showing = ref(true);
-		popup(defineAsyncComponent(() => import('@/components/waiting-dialog.vue')), {
+		popup(import('@/components/waiting-dialog.vue'), {
 			success: false,
 			showing: showing
 		}, {
@@ -225,7 +227,7 @@ export function waiting() {
 
 export function form(title, form) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/form-dialog.vue')), { title, form }, {
+		popup(import('@/components/form-dialog.vue'), { title, form }, {
 			done: result => {
 				resolve(result);
 			},
@@ -235,7 +237,7 @@ export function form(title, form) {
 
 export async function selectUser() {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/user-select-dialog.vue')), {}, {
+		popup(import('@/components/user-select-dialog.vue'), {}, {
 			ok: user => {
 				resolve(user);
 			},
@@ -245,7 +247,7 @@ export async function selectUser() {
 
 export async function selectDriveFile(multiple: boolean) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
+		popup(import('@/components/drive-select-dialog.vue'), {
 			type: 'file',
 			multiple
 		}, {
@@ -260,7 +262,7 @@ export async function selectDriveFile(multiple: boolean) {
 
 export async function selectDriveFolder(multiple: boolean) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/drive-select-dialog.vue')), {
+		popup(import('@/components/drive-select-dialog.vue'), {
 			type: 'folder',
 			multiple
 		}, {
@@ -275,7 +277,7 @@ export async function selectDriveFolder(multiple: boolean) {
 
 export async function pickEmoji(src?: HTMLElement) {
 	return new Promise((resolve, reject) => {
-		popup(defineAsyncComponent(() => import('@/components/emoji-picker.vue')), {
+		popup(import('@/components/emoji-picker.vue'), {
 			src
 		}, {
 			done: emoji => {
@@ -287,7 +289,8 @@ export async function pickEmoji(src?: HTMLElement) {
 
 export function modalMenu(items: any[], src?: HTMLElement, options?: { align?: string; viaKeyboard?: boolean }) {
 	return new Promise((resolve, reject) => {
-		const { dispose } = popup(defineAsyncComponent(() => import('@/components/ui/modal-menu.vue')), {
+		let dispose;
+		popup(import('@/components/ui/modal-menu.vue'), {
 			items,
 			src,
 			align: options?.align,
@@ -297,6 +300,8 @@ export function modalMenu(items: any[], src?: HTMLElement, options?: { align?: s
 				resolve();
 				dispose();
 			},
+		}).then(_dispose => {
+			dispose = _dispose;
 		});
 	});
 }
@@ -304,7 +309,8 @@ export function modalMenu(items: any[], src?: HTMLElement, options?: { align?: s
 export function contextMenu(items: any[], ev: MouseEvent) {
 	ev.preventDefault();
 	return new Promise((resolve, reject) => {
-		const { dispose } = popup(defineAsyncComponent(() => import('@/components/ui/context-menu.vue')), {
+		let dispose;
+		popup(import('@/components/ui/context-menu.vue'), {
 			items,
 			ev,
 		}, {
@@ -312,6 +318,8 @@ export function contextMenu(items: any[], ev: MouseEvent) {
 				resolve();
 				dispose();
 			},
+		}).then(_dispose => {
+			dispose = _dispose;
 		});
 	});
 }
@@ -323,11 +331,14 @@ export function post(props: Record<string, any>) {
 		//       Vueが渡されたコンポーネントに内部的に__propsというプロパティを生やす影響で、
 		//       複数のpost formを開いたときに場合によってはエラーになる
 		//       もちろん複数のpost formを開けること自体Misskeyサイドのバグなのだが
-		const { dispose } = popup(MkPostFormDialog, props, {
+		let dispose;
+		popup(MkPostFormDialog, props, {
 			closed: () => {
 				resolve();
 				dispose();
 			},
+		}).then(_dispose => {
+			dispose = _dispose;
 		});
 	});
 }

src/client/pages/instance/emojis.vue

@@ -113,8 +113,8 @@ export default defineComponent({
 			os.promiseDialog(promise);
 		},
 
-		async edit(emoji) {
-			os.popup(await import('./emoji-edit-dialog.vue'), {
+		edit(emoji) {
+			os.popup(import('./emoji-edit-dialog.vue'), {
 				emoji: emoji
 			}, {
 				done: result => {

src/client/pages/instance/file-dialog.vue

@@ -84,8 +84,8 @@ export default defineComponent({
 			Progress.done();
 		},
 
-		async showUser() {
-			os.popup(await import('./user-dialog.vue'), {
+		showUser() {
+			os.popup(import('./user-dialog.vue'), {
 				userId: this.file.userId
 			}, {}, 'closed');
 		},

src/client/pages/instance/files.vue

@@ -131,8 +131,8 @@ export default defineComponent({
 			});
 		},
 
-		async show(file, ev) {
-			os.popup(await import('./file-dialog.vue'), {
+		show(file, ev) {
+			os.popup(import('./file-dialog.vue'), {
 				fileId: file.id
 			}, {}, 'closed');
 		},

src/client/pages/instance/users.vue

@@ -206,8 +206,8 @@ export default defineComponent({
 			});
 		},
 
-		async show(user) {
-			os.popup(await import('./user-dialog.vue'), {
+		show(user) {
+			os.popup(import('./user-dialog.vue'), {
 				userId: user.id
 			}, {}, 'closed');
 		},

src/client/pages/settings/api.vue

@@ -42,8 +42,8 @@ export default defineComponent({
 	},
 
 	methods: {
-		async generateToken() {
-			os.popup(await import('@/components/token-generate-window.vue'), {}, {
+		generateToken() {
+			os.popup(import('@/components/token-generate-window.vue'), {}, {
 				done: async result => {
 					const { name, permissions } = result;
 					const { token } = await os.api('miauth/gen-token', {

src/client/pages/settings/notifications.vue

@@ -72,9 +72,9 @@ export default defineComponent({
 			os.api('notifications/mark-all-as-read');
 		},
 
-		async configure() {
+		configure() {
 			const includingTypes = notificationTypes.filter(x => !this.$store.state.i.mutingNotificationTypes.includes(x));
-			os.popup(await import('@/components/notification-setting-window.vue'), {
+			os.popup(import('@/components/notification-setting-window.vue'), {
 				includingTypes,
 				showGlobalToggle: false,
 			}, {

src/client/pages/settings/other.vue

@@ -69,7 +69,7 @@ export default defineComponent({
 		},
 
 		taskmanager() {
-			os.popup(defineAsyncComponent(() => import('@/components/taskmanager.vue')), {
+			os.popup(import('@/components/taskmanager.vue'), {
 			}, {}, 'closed');
 		}
 	}

src/client/pages/settings/plugins.vue

@@ -117,8 +117,8 @@ export default defineComponent({
 				return;
 			}
 
-			const token = permissions == null || permissions.length === 0 ? null : await new Promise(async (res, rej) => {
-				os.popup(await import('@/components/token-generate-window.vue'), {
+			const token = permissions == null || permissions.length === 0 ? null : await new Promise((res, rej) => {
+				os.popup(import('@/components/token-generate-window.vue'), {
 					title: this.$t('tokenRequested'),
 					information: this.$t('pluginTokenRequestedDescription'),
 					initialName: name,

src/client/pages/settings/reaction.vue

@@ -73,8 +73,8 @@ export default defineComponent({
 			this.changed = false;
 		},
 
-		async preview(ev) {
-			os.popup(await import('@/components/reaction-picker.vue'), {
+		preview(ev) {
+			os.popup(import('@/components/reaction-picker.vue'), {
 				reactions: this.splited,
 				showFocus: false,
 				src: ev.currentTarget || ev.target,
@@ -85,7 +85,7 @@ export default defineComponent({
 			this.reactions = defaultSettings.reactions.join('');
 		},
 
-		async chooseEmoji(ev) {
+		chooseEmoji(ev) {
 			os.pickEmoji(ev.currentTarget || ev.target).then(emoji => {
 				this.reactions += emoji;
 			});

src/client/scripts/get-user-menu.ts

@@ -101,8 +101,8 @@ export function getUserMenu(user) {
 		});
 	}
 
-	async function reportAbuse() {
-		os.popup(await import('@/components/abuse-report-window.vue'), {
+	function reportAbuse() {
+		os.popup(import('@/components/abuse-report-window.vue'), {
 			user: user,
 		}, {}, 'closed');
 	}

src/client/ui/deck.vue

@@ -143,7 +143,7 @@ export default defineComponent({
 			os.post();
 		},
 
-		async onNotification(notification) {
+		onNotification(notification) {
 			if (this.$store.state.i.mutingNotificationTypes.includes(notification.type)) {
 				return;
 			}
@@ -153,7 +153,7 @@ export default defineComponent({
 					id: notification.id
 				});
 
-				os.popup(await import('@/components/toast.vue'), {
+				os.popup(import('@/components/toast.vue'), {
 					notification
 				}, {}, 'closed');
 			}

src/client/ui/deck/notifications-column.vue

@@ -42,8 +42,8 @@ export default defineComponent({
 		this.menu = [{
 			icon: faCog,
 			text: this.$t('notificationSetting'),
-			action: async () => {
-				os.popup(await import('@/components/notification-setting-window.vue'), {
+			action: () => {
+				os.popup(import('@/components/notification-setting-window.vue'), {
 					includingTypes: this.column.includingTypes,
 				}, {
 					done: async (res) => {

src/client/ui/default.vue

@@ -235,7 +235,7 @@ export default defineComponent({
 			}], e);
 		},
 
-		async onNotification(notification) {
+		onNotification(notification) {
 			if (this.$store.state.i.mutingNotificationTypes.includes(notification.type)) {
 				return;
 			}
@@ -244,7 +244,7 @@ export default defineComponent({
 					id: notification.id
 				});
 
-				os.popup(await import('@/components/toast.vue'), {
+				os.popup(import('@/components/toast.vue'), {
 					notification
 				}, {}, 'closed');
 			}

src/client/ui/zen.vue

@@ -95,7 +95,7 @@ export default defineComponent({
 			if (window._scroll) window._scroll();
 		},
 
-		async onNotification(notification) {
+		onNotification(notification) {
 			if (this.$store.state.i.mutingNotificationTypes.includes(notification.type)) {
 				return;
 			}
@@ -104,7 +104,7 @@ export default defineComponent({
 					id: notification.id
 				});
 
-				os.popup(await import('@/components/toast.vue'), {
+				os.popup(import('@/components/toast.vue'), {
 					notification
 				}, {}, 'closed');
 			}

src/client/widgets/notifications.vue

@@ -51,8 +51,8 @@ export default defineComponent({
 	},
 
 	methods: {
-		async configure() {
-			os.popup(await import('@/components/notification-setting-window.vue'), {
+		configure() {
+			os.popup(import('@/components/notification-setting-window.vue'), {
 				includingTypes: this.props.includingTypes,
 			}, {
 				done: async (res) => {