Merge branch 'develop'

27 files changed, 92 insertions, 101 deletions

diff --git a/packages/client/src/pages/admin/abuses.vue b/packages/client/src/pages/admin/abuses.vue
index ca94737781..ff1c4c57fc 100644
--- a/packages/client/src/pages/admin/abuses.vue
+++ b/packages/client/src/pages/admin/abuses.vue
@@ -33,8 +33,8 @@
 			</div>
 			-->
 
-			<MkPagination :pagination="pagination" #default="{items}" ref="reports" style="margin-top: var(--margin);">
-				<div class="bcekxzvu _card _gap" v-for="report in items" :key="report.id">
+			<MkPagination #default="{items}" ref="reports" :pagination="pagination" style="margin-top: var(--margin);">
+				<div v-for="report in items" :key="report.id" class="bcekxzvu _card _gap">
 					<div class="_content target">
 						<MkAvatar class="avatar" :user="report.targetUser" :show-indicator="true"/>
 						<div class="info">
@@ -52,7 +52,7 @@
 					</div>
 					<div class="_footer">
 						<div v-if="report.assignee">Assignee: <MkAcct :user="report.assignee"/></div>
-						<MkButton @click="resolve(report)" primary v-if="!report.resolved">{{ $ts.abuseMarkAsResolved }}</MkButton>
+						<MkButton v-if="!report.resolved" primary @click="resolve(report)">{{ $ts.abuseMarkAsResolved }}</MkButton>
 					</div>
 				</div>
 			</MkPagination>
diff --git a/packages/client/src/pages/admin/ads.vue b/packages/client/src/pages/admin/ads.vue
index df6c9d5d00..c802db8ac5 100644
--- a/packages/client/src/pages/admin/ads.vue
+++ b/packages/client/src/pages/admin/ads.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="uqshojas">
-	<section class="_card _gap ads" v-for="ad in ads">
+	<section v-for="ad in ads" class="_card _gap ads">
 		<div class="_content ad">
 			<MkAd v-if="ad.url" :specify="ad"/>
 			<MkInput v-model="ad.url" type="url">
@@ -32,8 +32,8 @@
 				<template #label>{{ $ts.memo }}</template>
 			</MkTextarea>
 			<div class="buttons">
-				<MkButton class="button" inline @click="save(ad)" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
-				<MkButton class="button" inline @click="remove(ad)" danger><i class="fas fa-trash-alt"></i> {{ $ts.remove }}</MkButton>
+				<MkButton class="button" inline primary @click="save(ad)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
+				<MkButton class="button" inline danger @click="remove(ad)"><i class="fas fa-trash-alt"></i> {{ $ts.remove }}</MkButton>
 			</div>
 		</div>
 	</section>
@@ -101,10 +101,9 @@ export default defineComponent({
 		},
 
 		remove(ad) {
-			os.dialog({
+			os.confirm({
 				type: 'warning',
 				text: this.$t('removeAreYouSure', { x: ad.url }),
-				showCancelButton: true
 			}).then(({ canceled }) => {
 				if (canceled) return;
 				this.ads = this.ads.filter(x => x != ad);
diff --git a/packages/client/src/pages/admin/announcements.vue b/packages/client/src/pages/admin/announcements.vue
index a64008967f..3614cb1441 100644
--- a/packages/client/src/pages/admin/announcements.vue
+++ b/packages/client/src/pages/admin/announcements.vue
@@ -1,6 +1,6 @@
 <template>
 <div class="ztgjmzrw">
-	<section class="_card _gap announcements" v-for="announcement in announcements">
+	<section v-for="announcement in announcements" class="_card _gap announcements">
 		<div class="_content announcement">
 			<MkInput v-model="announcement.title">
 				<template #label>{{ $ts.title }}</template>
@@ -13,7 +13,7 @@
 			</MkInput>
 			<p v-if="announcement.reads">{{ $t('nUsersRead', { n: announcement.reads }) }}</p>
 			<div class="buttons">
-				<MkButton class="button" inline @click="save(announcement)" primary><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
+				<MkButton class="button" inline primary @click="save(announcement)"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
 				<MkButton class="button" inline @click="remove(announcement)"><i class="fas fa-trash-alt"></i> {{ $ts.remove }}</MkButton>
 			</div>
 		</div>
@@ -76,10 +76,9 @@ export default defineComponent({
 		},
 
 		remove(announcement) {
-			os.dialog({
+			os.confirm({
 				type: 'warning',
 				text: this.$t('removeAreYouSure', { x: announcement.title }),
-				showCancelButton: true
 			}).then(({ canceled }) => {
 				if (canceled) return;
 				this.announcements = this.announcements.filter(x => x != announcement);
@@ -90,24 +89,24 @@ export default defineComponent({
 		save(announcement) {
 			if (announcement.id == null) {
 				os.api('admin/announcements/create', announcement).then(() => {
-					os.dialog({
+					os.alert({
 						type: 'success',
 						text: this.$ts.saved
 					});
 				}).catch(e => {
-					os.dialog({
+					os.alert({
 						type: 'error',
 						text: e
 					});
 				});
 			} else {
 				os.api('admin/announcements/update', announcement).then(() => {
-					os.dialog({
+					os.alert({
 						type: 'success',
 						text: this.$ts.saved
 					});
 				}).catch(e => {
-					os.dialog({
+					os.alert({
 						type: 'error',
 						text: e
 					});
diff --git a/packages/client/src/pages/admin/bot-protection.vue b/packages/client/src/pages/admin/bot-protection.vue
index 8f7873baa3..5a97083841 100644
--- a/packages/client/src/pages/admin/bot-protection.vue
+++ b/packages/client/src/pages/admin/bot-protection.vue
@@ -9,7 +9,7 @@
 		</FormRadios>
 
 		<template v-if="provider === 'hcaptcha'">
-			<div class="_debobigegoItem _debobigegoNoConcat" v-sticky-container>
+			<div v-sticky-container class="_debobigegoItem _debobigegoNoConcat">
 				<div class="_debobigegoLabel">hCaptcha</div>
 				<div class="main">
 					<FormInput v-model="hcaptchaSiteKey">
@@ -22,7 +22,7 @@
 					</FormInput>
 				</div>
 			</div>
-			<div class="_debobigegoItem _debobigegoNoConcat" v-sticky-container>
+			<div v-sticky-container class="_debobigegoItem _debobigegoNoConcat">
 				<div class="_debobigegoLabel">{{ $ts.preview }}</div>
 				<div class="_debobigegoPanel" style="padding: var(--debobigegoContentHMargin);">
 					<MkCaptcha provider="hcaptcha" :sitekey="hcaptchaSiteKey || '10000000-ffff-ffff-ffff-000000000001'"/>
@@ -30,7 +30,7 @@
 			</div>
 		</template>
 		<template v-else-if="provider === 'recaptcha'">
-			<div class="_debobigegoItem _debobigegoNoConcat" v-sticky-container>
+			<div v-sticky-container class="_debobigegoItem _debobigegoNoConcat">
 				<div class="_debobigegoLabel">reCAPTCHA</div>
 				<div class="main">
 					<FormInput v-model="recaptchaSiteKey">
@@ -43,7 +43,7 @@
 					</FormInput>
 				</div>
 			</div>
-			<div v-if="recaptchaSiteKey" class="_debobigegoItem _debobigegoNoConcat" v-sticky-container>
+			<div v-if="recaptchaSiteKey" v-sticky-container class="_debobigegoItem _debobigegoNoConcat">
 				<div class="_debobigegoLabel">{{ $ts.preview }}</div>
 				<div class="_debobigegoPanel" style="padding: var(--debobigegoContentHMargin);">
 					<MkCaptcha provider="recaptcha" :sitekey="recaptchaSiteKey"/>
@@ -51,7 +51,7 @@
 			</div>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/database.vue b/packages/client/src/pages/admin/database.vue
index b550831e02..b09f1ad867 100644
--- a/packages/client/src/pages/admin/database.vue
+++ b/packages/client/src/pages/admin/database.vue
@@ -1,6 +1,6 @@
 <template>
 <FormBase>
-	<FormSuspense :p="databasePromiseFactory" v-slot="{ result: database }">
+	<FormSuspense v-slot="{ result: database }" :p="databasePromiseFactory">
 		<FormGroup v-for="table in database" :key="table[0]">
 			<template #label>{{ table[0] }}</template>
 			<FormKeyValueView>
diff --git a/packages/client/src/pages/admin/email-settings.vue b/packages/client/src/pages/admin/email-settings.vue
index 3733f53a23..873a853918 100644
--- a/packages/client/src/pages/admin/email-settings.vue
+++ b/packages/client/src/pages/admin/email-settings.vue
@@ -8,7 +8,7 @@
 				<span>{{ $ts.emailAddress }}</span>
 			</FormInput>
 
-			<div class="_debobigegoItem _debobigegoNoConcat" v-sticky-container>
+			<div v-sticky-container class="_debobigegoItem _debobigegoNoConcat">
 				<div class="_debobigegoLabel">{{ $ts.smtpConfig }}</div>
 				<div class="main">
 					<FormInput v-model="smtpHost">
@@ -31,7 +31,7 @@
 			<FormButton @click="testEmail">{{ $ts.testEmail }}</FormButton>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
@@ -96,11 +96,10 @@ export default defineComponent({
 		},
 
 		async testEmail() {
-			const { canceled, result: destination } = await os.dialog({
+			const { canceled, result: destination } = await os.inputText({
 				title: this.$ts.destination,
-				input: {
-					placeholder: this.$instance.maintainerEmail
-				}
+				type: 'email',
+				placeholder: this.$instance.maintainerEmail
 			});
 			if (canceled) return;
 			os.apiWithDialog('admin/send-email', {
diff --git a/packages/client/src/pages/admin/emoji-edit-dialog.vue b/packages/client/src/pages/admin/emoji-edit-dialog.vue
index e612855105..a45d92fa16 100644
--- a/packages/client/src/pages/admin/emoji-edit-dialog.vue
+++ b/packages/client/src/pages/admin/emoji-edit-dialog.vue
@@ -11,13 +11,13 @@
 	<div class="_monolithic_">
 		<div class="yigymqpb _section">
 			<img :src="emoji.url" class="img"/>
-			<MkInput class="_formBlock" v-model="name">
+			<MkInput v-model="name" class="_formBlock">
 				<template #label>{{ $ts.name }}</template>
 			</MkInput>
-			<MkInput class="_formBlock" v-model="category" :datalist="categories">
+			<MkInput v-model="category" class="_formBlock" :datalist="categories">
 				<template #label>{{ $ts.category }}</template>
 			</MkInput>
-			<MkInput class="_formBlock" v-model="aliases">
+			<MkInput v-model="aliases" class="_formBlock">
 				<template #label>{{ $ts.tags }}</template>
 				<template #caption>{{ $ts.setMultipleBySeparatingWithSpace }}</template>
 			</MkInput>
@@ -89,10 +89,9 @@ export default defineComponent({
 		},
 
 		async del() {
-			const { canceled } = await os.dialog({
+			const { canceled } = await os.confirm({
 				type: 'warning',
 				text: this.$t('removeAreYouSure', { x: this.emoji.name }),
-				showCancelButton: true
 			});
 			if (canceled) return;
 
diff --git a/packages/client/src/pages/admin/emojis.vue b/packages/client/src/pages/admin/emojis.vue
index c9ba193dd1..6f9a955da2 100644
--- a/packages/client/src/pages/admin/emojis.vue
+++ b/packages/client/src/pages/admin/emojis.vue
@@ -1,15 +1,15 @@
 <template>
 <div class="ogwlenmc">
-	<div class="local" v-if="tab === 'local'">
+	<div v-if="tab === 'local'" class="local">
 		<MkInput v-model="query" :debounce="true" type="search" style="margin: var(--margin);">
 			<template #prefix><i class="fas fa-search"></i></template>
 			<template #label>{{ $ts.search }}</template>
 		</MkInput>
-		<MkPagination :pagination="pagination" ref="emojis">
+		<MkPagination ref="emojis" :pagination="pagination">
 			<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
 			<template #default="{items}">
 				<div class="ldhfsamy">
-					<button class="emoji _panel _button" v-for="emoji in items" :key="emoji.id" @click="edit(emoji)">
+					<button v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" @click="edit(emoji)">
 						<img :src="emoji.url" class="img" :alt="emoji.name"/>
 						<div class="body">
 							<div class="name _monospace">{{ emoji.name }}</div>
@@ -21,7 +21,7 @@
 		</MkPagination>
 	</div>
 
-	<div class="remote" v-else-if="tab === 'remote'">
+	<div v-else-if="tab === 'remote'" class="remote">
 		<MkInput v-model="queryRemote" :debounce="true" type="search" style="margin: var(--margin);">
 			<template #prefix><i class="fas fa-search"></i></template>
 			<template #label>{{ $ts.search }}</template>
@@ -29,11 +29,11 @@
 		<MkInput v-model="host" :debounce="true" style="margin: var(--margin);">
 			<template #label>{{ $ts.host }}</template>
 		</MkInput>
-		<MkPagination :pagination="remotePagination" ref="remoteEmojis">
+		<MkPagination ref="remoteEmojis" :pagination="remotePagination">
 			<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
 			<template #default="{items}">
 				<div class="ldhfsamy">
-					<div class="emoji _panel _button" v-for="emoji in items" :key="emoji.id" @click="remoteMenu(emoji, $event)">
+					<div v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" @click="remoteMenu(emoji, $event)">
 						<img :src="emoji.url" class="img" :alt="emoji.name"/>
 						<div class="body">
 							<div class="name _monospace">{{ emoji.name }}</div>
diff --git a/packages/client/src/pages/admin/file-dialog.vue b/packages/client/src/pages/admin/file-dialog.vue
index 016a012ea5..f0774b2946 100644
--- a/packages/client/src/pages/admin/file-dialog.vue
+++ b/packages/client/src/pages/admin/file-dialog.vue
@@ -4,8 +4,8 @@
 	@close="$refs.dialog.close()"
 	@closed="$emit('closed')"
 >
-	<template #header v-if="file">{{ file.name }}</template>
-	<div class="cxqhhsmd" v-if="file">
+	<template v-if="file" #header>{{ file.name }}</template>
+	<div v-if="file" class="cxqhhsmd">
 		<div class="_section">
 			<MkDriveFileThumbnail class="thumbnail" :file="file" fit="contain"/>
 			<div class="info">
@@ -16,7 +16,7 @@
 		</div>
 		<div class="_section">
 			<div class="_content">
-				<MkSwitch @update:modelValue="toggleIsSensitive" v-model="isSensitive">NSFW</MkSwitch>
+				<MkSwitch v-model="isSensitive" @update:modelValue="toggleIsSensitive">NSFW</MkSwitch>
 			</div>
 		</div>
 		<div class="_section">
@@ -25,7 +25,7 @@
 				<MkButton full danger @click="del"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton>
 			</div>
 		</div>
-		<div class="_section" v-if="info">
+		<div v-if="info" class="_section">
 			<details class="_content rawdata">
 				<pre><code>{{ JSON.stringify(info, null, 2) }}</code></pre>
 			</details>
@@ -86,10 +86,9 @@ export default defineComponent({
 		},
 
 		async del() {
-			const { canceled } = await os.dialog({
+			const { canceled } = await os.confirm({
 				type: 'warning',
 				text: this.$t('removeAreYouSure', { x: this.file.name }),
-				showCancelButton: true
 			});
 			if (canceled) return;
 
diff --git a/packages/client/src/pages/admin/files-settings.vue b/packages/client/src/pages/admin/files-settings.vue
index 03d8f3de1f..df25bd0fb2 100644
--- a/packages/client/src/pages/admin/files-settings.vue
+++ b/packages/client/src/pages/admin/files-settings.vue
@@ -23,7 +23,7 @@
 			<template #desc>{{ $ts.inMb }}</template>
 		</FormInput>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/files.vue b/packages/client/src/pages/admin/files.vue
index e291d97bbc..a6b0f8e59e 100644
--- a/packages/client/src/pages/admin/files.vue
+++ b/packages/client/src/pages/admin/files.vue
@@ -3,10 +3,10 @@
 	<MkContainer :foldable="true" class="lookup">
 		<template #header><i class="fas fa-search"></i> {{ $ts.lookup }}</template>
 		<div class="xrmjdkdw-lookup">
-			<MkInput class="item" v-model="q" type="text" @enter="find()">
+			<MkInput v-model="q" class="item" type="text" @enter="find()">
 				<template #label>{{ $ts.fileIdOrUrl }}</template>
 			</MkInput>
-			<MkButton @click="find()" primary><i class="fas fa-search"></i> {{ $ts.lookup }}</MkButton>
+			<MkButton primary @click="find()"><i class="fas fa-search"></i> {{ $ts.lookup }}</MkButton>
 		</div>
 	</MkContainer>
 
@@ -28,8 +28,8 @@
 					<template #label>MIME type</template>
 				</MkInput>
 			</div>
-			<MkPagination :pagination="pagination" #default="{items}" class="urempief" ref="files">
-				<button class="file _panel _button _gap" v-for="file in items" :key="file.id" @click="show(file, $event)">
+			<MkPagination #default="{items}" ref="files" :pagination="pagination" class="urempief">
+				<button v-for="file in items" :key="file.id" class="file _panel _button _gap" @click="show(file, $event)">
 					<MkDriveFileThumbnail class="thumbnail" :file="file" fit="contain"/>
 					<div class="body">
 						<div>
@@ -124,10 +124,9 @@ export default defineComponent({
 
 	methods: {
 		clear() {
-			os.dialog({
+			os.confirm({
 				type: 'warning',
 				text: this.$ts.clearCachedFilesConfirm,
-				showCancelButton: true
 			}).then(({ canceled }) => {
 				if (canceled) return;
 
@@ -146,7 +145,7 @@ export default defineComponent({
 				this.show(file);
 			}).catch(e => {
 				if (e.code === 'NO_SUCH_FILE') {
-					os.dialog({
+					os.alert({
 						type: 'error',
 						text: this.$ts.notFound
 					});
diff --git a/packages/client/src/pages/admin/index.vue b/packages/client/src/pages/admin/index.vue
index d3f9406db7..e363d1bd03 100644
--- a/packages/client/src/pages/admin/index.vue
+++ b/packages/client/src/pages/admin/index.vue
@@ -1,6 +1,6 @@
 <template>
-<div class="hiyeyicy" :class="{ wide: !narrow }" ref="el">
-	<div class="nav" v-if="!narrow || page == null">
+<div ref="el" class="hiyeyicy" :class="{ wide: !narrow }">
+	<div v-if="!narrow || page == null" class="nav">
 		<MkHeader :info="header"></MkHeader>
 	
 		<MkSpacer :content-max="700">
@@ -19,7 +19,7 @@
 	<div class="main">
 		<MkStickyContainer>
 			<template #header><MkHeader v-if="childInfo && !childInfo.hideHeader" :info="childInfo"/></template>
-			<component :is="component" :key="page" @info="onInfo" v-bind="pageProps"/>
+			<component :is="component" :key="page" v-bind="pageProps" @info="onInfo"/>
 		</MkStickyContainer>
 	</div>
 </div>
@@ -281,12 +281,12 @@ export default defineComponent({
 
 		const invite = () => {
 			os.api('admin/invite').then(x => {
-				os.dialog({
+				os.alert({
 					type: 'info',
 					text: x.code
 				});
 			}).catch(e => {
-				os.dialog({
+				os.alert({
 					type: 'error',
 					text: e
 				});
diff --git a/packages/client/src/pages/admin/instance-block.vue b/packages/client/src/pages/admin/instance-block.vue
index f5b249698d..2e899de687 100644
--- a/packages/client/src/pages/admin/instance-block.vue
+++ b/packages/client/src/pages/admin/instance-block.vue
@@ -6,7 +6,7 @@
 			<template #desc>{{ $ts.blockedInstancesDescription }}</template>
 		</FormTextarea>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/instance.vue b/packages/client/src/pages/admin/instance.vue
index 26eefe243f..51fcb8675a 100644
--- a/packages/client/src/pages/admin/instance.vue
+++ b/packages/client/src/pages/admin/instance.vue
@@ -106,11 +106,11 @@
 			<MkSwitch :model-value="isBlocked" class="switch" @update:modelValue="changeBlock">{{ $ts.blockThisInstance }}</MkSwitch>
 			<details>
 				<summary>{{ $ts.deleteAllFiles }}</summary>
-				<MkButton @click="deleteAllFiles()" style="margin: 0.5em 0 0.5em 0;"><i class="fas fa-trash-alt"></i> {{ $ts.deleteAllFiles }}</MkButton>
+				<MkButton style="margin: 0.5em 0 0.5em 0;" @click="deleteAllFiles()"><i class="fas fa-trash-alt"></i> {{ $ts.deleteAllFiles }}</MkButton>
 			</details>
 			<details>
 				<summary>{{ $ts.removeAllFollowing }}</summary>
-				<MkButton @click="removeAllFollowing()" style="margin: 0.5em 0 0.5em 0;"><i class="fas fa-minus-circle"></i> {{ $ts.removeAllFollowing }}</MkButton>
+				<MkButton style="margin: 0.5em 0 0.5em 0;" @click="removeAllFollowing()"><i class="fas fa-minus-circle"></i> {{ $ts.removeAllFollowing }}</MkButton>
 				<MkInfo warn>{{ $t('removeAllFollowingDescription', { host: instance.host }) }}</MkInfo>
 			</details>
 		</div>
diff --git a/packages/client/src/pages/admin/integrations-discord.vue b/packages/client/src/pages/admin/integrations-discord.vue
index 81e47499c6..50539a0a36 100644
--- a/packages/client/src/pages/admin/integrations-discord.vue
+++ b/packages/client/src/pages/admin/integrations-discord.vue
@@ -19,7 +19,7 @@
 			</FormInput>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/integrations-github.vue b/packages/client/src/pages/admin/integrations-github.vue
index 2bbc3ae9a1..ea6e8261ff 100644
--- a/packages/client/src/pages/admin/integrations-github.vue
+++ b/packages/client/src/pages/admin/integrations-github.vue
@@ -19,7 +19,7 @@
 			</FormInput>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/integrations-twitter.vue b/packages/client/src/pages/admin/integrations-twitter.vue
index 19ed216ab9..7147a035f8 100644
--- a/packages/client/src/pages/admin/integrations-twitter.vue
+++ b/packages/client/src/pages/admin/integrations-twitter.vue
@@ -19,7 +19,7 @@
 			</FormInput>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/object-storage.vue b/packages/client/src/pages/admin/object-storage.vue
index 0f1431c258..8984686b5e 100644
--- a/packages/client/src/pages/admin/object-storage.vue
+++ b/packages/client/src/pages/admin/object-storage.vue
@@ -58,7 +58,7 @@
 			</FormSwitch>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/other-settings.vue b/packages/client/src/pages/admin/other-settings.vue
index e8f872bf0a..eb214a21c8 100644
--- a/packages/client/src/pages/admin/other-settings.vue
+++ b/packages/client/src/pages/admin/other-settings.vue
@@ -16,7 +16,7 @@
 				Pro account
 			</FormSwitch>
 		</FormGroup>
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/overview.vue b/packages/client/src/pages/admin/overview.vue
index e1352945a1..da5fc0ba6d 100644
--- a/packages/client/src/pages/admin/overview.vue
+++ b/packages/client/src/pages/admin/overview.vue
@@ -1,18 +1,18 @@
 <template>
-<div class="edbbcaef" v-size="{ max: [740] }">
+<div v-size="{ max: [740] }" class="edbbcaef">
 	<div v-if="stats" class="cfcdecdf" style="margin: var(--margin)">
 		<div class="number _panel">
 			<div class="label">Users</div>
 			<div class="value _monospace">
 				{{ number(stats.originalUsersCount) }}
-				<MkNumberDiff v-if="usersComparedToThePrevDay != null" class="diff" :value="usersComparedToThePrevDay" v-tooltip="$ts.dayOverDayChanges"><template #before>(</template><template #after>)</template></MkNumberDiff>
+				<MkNumberDiff v-if="usersComparedToThePrevDay != null" v-tooltip="$ts.dayOverDayChanges" class="diff" :value="usersComparedToThePrevDay"><template #before>(</template><template #after>)</template></MkNumberDiff>
 			</div>
 		</div>
 		<div class="number _panel">
 			<div class="label">Notes</div>
 			<div class="value _monospace">
 				{{ number(stats.originalNotesCount) }}
-				<MkNumberDiff v-if="notesComparedToThePrevDay != null" class="diff" :value="notesComparedToThePrevDay" v-tooltip="$ts.dayOverDayChanges"><template #before>(</template><template #after>)</template></MkNumberDiff>
+				<MkNumberDiff v-if="notesComparedToThePrevDay != null" v-tooltip="$ts.dayOverDayChanges" class="diff" :value="notesComparedToThePrevDay"><template #before>(</template><template #after>)</template></MkNumberDiff>
 			</div>
 		</div>
 	</div>
@@ -44,15 +44,15 @@
 				<div class="label">Misskey</div>
 				<div class="value _monospace">{{ version }}</div>
 			</div>
-			<div class="number _panel" v-if="serverInfo">
+			<div v-if="serverInfo" class="number _panel">
 				<div class="label">Node.js</div>
 				<div class="value _monospace">{{ serverInfo.node }}</div>
 			</div>
-			<div class="number _panel" v-if="serverInfo">
+			<div v-if="serverInfo" class="number _panel">
 				<div class="label">PostgreSQL</div>
 				<div class="value _monospace">{{ serverInfo.psql }}</div>
 			</div>
-			<div class="number _panel" v-if="serverInfo">
+			<div v-if="serverInfo" class="number _panel">
 				<div class="label">Redis</div>
 				<div class="value _monospace">{{ serverInfo.redis }}</div>
 			</div>
diff --git a/packages/client/src/pages/admin/proxy-account.vue b/packages/client/src/pages/admin/proxy-account.vue
index 5852c6a20d..14ef92a747 100644
--- a/packages/client/src/pages/admin/proxy-account.vue
+++ b/packages/client/src/pages/admin/proxy-account.vue
@@ -9,7 +9,7 @@
 			<template #caption>{{ $ts.proxyAccountDescription }}</template>
 		</FormGroup>
 
-		<FormButton @click="chooseProxyAccount" primary>{{ $ts.selectAccount }}</FormButton>
+		<FormButton primary @click="chooseProxyAccount">{{ $ts.selectAccount }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/queue.vue b/packages/client/src/pages/admin/queue.vue
index 896298840c..37a87089cb 100644
--- a/packages/client/src/pages/admin/queue.vue
+++ b/packages/client/src/pages/admin/queue.vue
@@ -6,7 +6,7 @@
 	<XQueue :connection="connection" domain="deliver">
 		<template #title>Out</template>
 	</XQueue>
-	<FormButton @click="clear()" danger><i class="fas fa-trash-alt"></i> {{ $ts.clearQueue }}</FormButton>
+	<FormButton danger @click="clear()"><i class="fas fa-trash-alt"></i> {{ $ts.clearQueue }}</FormButton>
 </FormBase>
 </template>
 
@@ -57,11 +57,10 @@ export default defineComponent({
 
 	methods: {
 		clear() {
-			os.dialog({
+			os.confirm({
 				type: 'warning',
 				title: this.$ts.clearQueueConfirmTitle,
 				text: this.$ts.clearQueueConfirmText,
-				showCancelButton: true
 			}).then(({ canceled }) => {
 				if (canceled) return;
 
diff --git a/packages/client/src/pages/admin/relays.vue b/packages/client/src/pages/admin/relays.vue
index fd0ce97d57..3e2f1c6f26 100644
--- a/packages/client/src/pages/admin/relays.vue
+++ b/packages/client/src/pages/admin/relays.vue
@@ -1,8 +1,8 @@
 <template>
 <FormBase class="relaycxt">
-	<FormButton @click="addRelay" primary><i class="fas fa-plus"></i> {{ $ts.addRelay }}</FormButton>
+	<FormButton primary @click="addRelay"><i class="fas fa-plus"></i> {{ $ts.addRelay }}</FormButton>
 
-	<div class="_debobigegoItem" v-for="relay in relays" :key="relay.inbox">
+	<div v-for="relay in relays" :key="relay.inbox" class="_debobigegoItem">
 		<div class="_debobigegoPanel" style="padding: 16px;">
 			<div>{{ relay.inbox }}</div>
 			<div>{{ $t(`_relayStatus.${relay.status}`) }}</div>
@@ -53,11 +53,10 @@ export default defineComponent({
 
 	methods: {
 		async addRelay() {
-			const { canceled, result: inbox } = await os.dialog({
+			const { canceled, result: inbox } = await os.inputText({
 				title: this.$ts.addRelay,
-				input: {
-					placeholder: this.$ts.inboxUrl
-				}
+				type: 'url',
+				placeholder: this.$ts.inboxUrl
 			});
 			if (canceled) return;
 			os.api('admin/relays/add', {
@@ -65,7 +64,7 @@ export default defineComponent({
 			}).then((relay: any) => {
 				this.refresh();
 			}).catch((e: any) => {
-				os.dialog({
+				os.alert({
 					type: 'error',
 					text: e.message || e
 				});
@@ -78,7 +77,7 @@ export default defineComponent({
 			}).then(() => {
 				this.refresh();
 			}).catch((e: any) => {
-				os.dialog({
+				os.alert({
 					type: 'error',
 					text: e.message || e
 				});
diff --git a/packages/client/src/pages/admin/security.vue b/packages/client/src/pages/admin/security.vue
index ad53ec4fcf..adfb2e786c 100644
--- a/packages/client/src/pages/admin/security.vue
+++ b/packages/client/src/pages/admin/security.vue
@@ -3,16 +3,16 @@
 	<FormSuspense :p="init">
 		<FormLink to="/admin/bot-protection">
 			<i class="fas fa-shield-alt"></i> {{ $ts.botProtection }}
-			<template #suffix v-if="enableHcaptcha">hCaptcha</template>
-			<template #suffix v-else-if="enableRecaptcha">reCAPTCHA</template>
-			<template #suffix v-else>{{ $ts.none }} ({{ $ts.notRecommended }})</template>
+			<template v-if="enableHcaptcha" #suffix>hCaptcha</template>
+			<template v-else-if="enableRecaptcha" #suffix>reCAPTCHA</template>
+			<template v-else #suffix>{{ $ts.none }} ({{ $ts.notRecommended }})</template>
 		</FormLink>
 
 		<FormSwitch v-model="enableRegistration">{{ $ts.enableRegistration }}</FormSwitch>
 
 		<FormSwitch v-model="emailRequiredForSignup">{{ $ts.emailRequiredForSignup }}</FormSwitch>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/service-worker.vue b/packages/client/src/pages/admin/service-worker.vue
index 9e91d6d64f..f34cb03e4e 100644
--- a/packages/client/src/pages/admin/service-worker.vue
+++ b/packages/client/src/pages/admin/service-worker.vue
@@ -18,7 +18,7 @@
 			</FormInput>
 		</template>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/settings.vue b/packages/client/src/pages/admin/settings.vue
index 66aa3e21db..d88445abdb 100644
--- a/packages/client/src/pages/admin/settings.vue
+++ b/packages/client/src/pages/admin/settings.vue
@@ -52,7 +52,7 @@
 		<FormSwitch v-model="enableGlobalTimeline">{{ $ts.enableGlobalTimeline }}</FormSwitch>
 		<FormInfo>{{ $ts.disablingTimelinesInfo }}</FormInfo>
 
-		<FormButton @click="save" primary><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
+		<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
 	</FormSuspense>
 </FormBase>
 </template>
diff --git a/packages/client/src/pages/admin/users.vue b/packages/client/src/pages/admin/users.vue
index f4a2ffa6d2..016a013e51 100644
--- a/packages/client/src/pages/admin/users.vue
+++ b/packages/client/src/pages/admin/users.vue
@@ -30,23 +30,23 @@
 				<template #prefix>@</template>
 				<template #label>{{ $ts.username }}</template>
 			</MkInput>
-			<MkInput v-model="searchHost" style="flex: 1;" type="text" spellcheck="false" @update:modelValue="$refs.users.reload()" :disabled="pagination.params().origin === 'local'">
+			<MkInput v-model="searchHost" style="flex: 1;" type="text" spellcheck="false" :disabled="pagination.params().origin === 'local'" @update:modelValue="$refs.users.reload()">
 				<template #prefix>@</template>
 				<template #label>{{ $ts.host }}</template>
 			</MkInput>
 		</div>
 
-		<MkPagination :pagination="pagination" #default="{items}" class="users" ref="users">
-			<button class="user _panel _button _gap" v-for="user in items" :key="user.id" @click="show(user)">
+		<MkPagination #default="{items}" ref="users" :pagination="pagination" class="users">
+			<button v-for="user in items" :key="user.id" class="user _panel _button _gap" @click="show(user)">
 				<MkAvatar class="avatar" :user="user" :disable-link="true" :show-indicator="true"/>
 				<div class="body">
 					<header>
 						<MkUserName class="name" :user="user"/>
 						<span class="acct">@{{ acct(user) }}</span>
-						<span class="staff" v-if="user.isAdmin"><i class="fas fa-bookmark"></i></span>
-						<span class="staff" v-if="user.isModerator"><i class="far fa-bookmark"></i></span>
-						<span class="punished" v-if="user.isSilenced"><i class="fas fa-microphone-slash"></i></span>
-						<span class="punished" v-if="user.isSuspended"><i class="fas fa-snowflake"></i></span>
+						<span v-if="user.isAdmin" class="staff"><i class="fas fa-bookmark"></i></span>
+						<span v-if="user.isModerator" class="staff"><i class="far fa-bookmark"></i></span>
+						<span v-if="user.isSilenced" class="punished"><i class="fas fa-microphone-slash"></i></span>
+						<span v-if="user.isSuspended" class="punished"><i class="fas fa-snowflake"></i></span>
 					</header>
 					<div>
 						<span>{{ $ts.lastUsed }}: <MkTime v-if="user.updatedAt" :time="user.updatedAt" mode="detail"/></span>
@@ -150,15 +150,14 @@ export default defineComponent({
 		},
 
 		async addUser() {
-			const { canceled: canceled1, result: username } = await os.dialog({
+			const { canceled: canceled1, result: username } = await os.inputText({
 				title: this.$ts.username,
-				input: true
 			});
 			if (canceled1) return;
 
-			const { canceled: canceled2, result: password } = await os.dialog({
+			const { canceled: canceled2, result: password } = await os.inputText({
 				title: this.$ts.password,
-				input: { type: 'password' }
+				type: 'password'
 			});
 			if (canceled2) return;