diff --git a/CHANGELOG.md b/CHANGELOG.md
index 06d3e0a8b..1fdc8cdf8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,6 +17,23 @@ npm i -g ts-node
 npm run migrate
 ```
 
+11.20.0 (2019/05/27)
+--------------------
+### ✨Improvements
+* 管理画面からリモートファイルのキャッシュをすべて削除できるように
+* 投稿フォームに投稿のURLをペーストしようとすると引用RNにできるように
+* モバイル版の投稿フォームにファイルをドロップできるように
+* モバイル版でも投稿の下書き自動保存ができるように
+* リモートファイルのキャッシュが期限切れになったときにサムネイルが無くならないように
+* ジョブキュー管理画面を強化
+
+### 🐛Fixes
+* 投稿内のローカルなURLプレビューをクリックしたとき not found になることがある問題を修正
+* デスクトップでユーザーページに遷移するときページが再度読み込みされることがある問題を修正
+* フォロー申請自動承認オプションが常にオフで表示される問題を修正
+* ポートを設定せずに起動したときに適切なエラーメッセージが表示されない問題を修正
+* i18n
+
 11.19.1 (2019/05/26)
 --------------------
 ### 🐛Fixes
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 9153655f3..52f1e2901 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -101,6 +101,34 @@ common:
     follow-users-to-make-your-timeline: "ユーザーをフォローすると投稿がタイムラインに表示されます。"
     explore: "ユーザーを探索する"
 
+  post-form:
+    attach-location-information: "位置情報を添付する"
+    hide-contents: "内容を隠す"
+    reply-placeholder: "この投稿への返信..."
+    quote-placeholder: "この投稿を引用..."
+    option-quote-placeholder: "この投稿を引用... (オプション)"
+    quote-attached: "引用付き"
+    quote-question: "引用として添付しますか？"
+    submit: "投稿"
+    reply: "返信"
+    renote: "Renote"
+    posting: "投稿中"
+    attach-media-from-local: "PCからメディアを添付"
+    attach-media-from-drive: "ドライブからメディアを添付"
+    insert-a-kao: "v('ω')v"
+    create-poll: "アンケートを作成"
+    text-remain: "残り{}文字"
+    recent-tags: "最近"
+    local-only-message: "この投稿はローカルにのみ公開されます"
+    click-to-tagging: "クリックでタグ付け"
+    visibility: "公開範囲"
+    geolocation-alert: "お使いの端末は位置情報に対応していません"
+    error: "エラー"
+    enter-username: "ユーザー名を入力してください"
+    add-visible-user: "ユーザーを追加"
+    cw-placeholder: "内容への注釈 (オプション)"
+    username-prompt: "ユーザー名を入力してください"
+
   weekday-short:
     sunday: "日"
     monday: "月"
@@ -1017,34 +1045,12 @@ desktop/views/components/notifications.vue:
   empty: "ありません！"
 
 desktop/views/components/post-form.vue:
-  add-visible-user: "+ユーザーを追加"
-  attach-location-information: "位置情報を添付する"
-  hide-contents: "内容を隠す"
-  reply-placeholder: "この投稿への返信..."
-  quote-placeholder: "この投稿を引用..."
-  submit: "投稿"
-  reply: "返信"
-  renote: "Renote"
   posted: "投稿しました！"
   replied: "返信しました！"
   reposted: "Renoteしました！"
   note-failed: "投稿に失敗しました"
   reply-failed: "返信に失敗しました"
   renote-failed: "Renoteに失敗しました"
-  posting: "投稿中"
-  attach-media-from-local: "PCからメディアを添付"
-  attach-media-from-drive: "ドライブからメディアを添付"
-  insert-a-kao: "v('ω')v"
-  create-poll: "アンケートを作成"
-  text-remain: "残り{}文字"
-  recent-tags: "最近"
-  local-only-message: "この投稿はローカルにのみ公開されます"
-  click-to-tagging: "クリックでタグ付け"
-  visibility: "公開範囲"
-  geolocation-alert: "お使いの端末は位置情報に対応していません"
-  error: "エラー"
-  enter-username: "ユーザー名を入力してください"
-  annotations: "内容への注釈 (オプション)"
 
 desktop/views/components/post-form-window.vue:
   note: "新規投稿"
@@ -1234,6 +1240,33 @@ admin/views/dashboard.vue:
 admin/views/queue.vue:
   title: "キュー"
   remove-all-jobs: "すべてのジョブをクリア"
+  jobs: "ジョブ"
+  queue: "キュー"
+  domains:
+    deliver: "配送"
+    inbox: "受信"
+    db: "データベース"
+    objectStorage: "オブジェクトストレージ"
+  state: "状態"
+  states:
+    active: "処理中"
+    delayed: "予約済み"
+    waiting: "順番待ち"
+  result-is-truncated: "結果は省略されています"
+  other-queues: "その他のキュー"
+
+admin/views/logs.vue:
+  logs: "ログ"
+  domain: "ドメイン"
+  level: "レベル"
+  levels:
+    all: "全て"
+    info: "情報"
+    success: "成功"
+    warning: "警告"
+    error: "エラー"
+    debug: "デバッグ"
+  delete-all: "全て削除"
 
 admin/views/abuse.vue:
   title: "スパム報告"
@@ -1389,6 +1422,9 @@ admin/views/drive.vue:
   unmark-as-sensitive: "閲覧注意を解除"
   marked-as-sensitive: "閲覧注意に設定しました"
   unmarked-as-sensitive: "閲覧注意を解除しました"
+  clean-remote-files: "リモートファイルのキャッシュを削除"
+  clean-remote-files-are-you-sure: "すべてのリモートファイルのキャッシュを削除してもよろしいですか？"
+  clean-up: "クリーンアップ"
 
 admin/views/users.vue:
   operation: "操作"
@@ -1541,6 +1577,7 @@ admin/views/federation.vue:
     day: "1日ごと"
   blocked-hosts: "ブロック"
   blocked-hosts-info: "ブロックしたいホストを改行で区切って記述します。"
+  save: "保存"
 
 desktop/views/pages/welcome.vue:
   about: "詳しく..."
@@ -1703,18 +1740,6 @@ mobile/views/components/note-sub.vue:
 mobile/views/components/notifications.vue:
   empty: "ありません！"
 
-mobile/views/components/post-form.vue:
-  add-visible-user: "ユーザーを追加"
-  submit: "投稿"
-  reply: "返信"
-  renote: "Renote"
-  quote-placeholder: "この投稿を引用... (オプション)"
-  reply-placeholder: "この投稿への返信..."
-  cw-placeholder: "内容への注釈 (オプション)"
-  geolocation-alert: "お使いの端末は位置情報に対応していません"
-  error: "エラー"
-  username-prompt: "ユーザー名を入力してください"
-
 mobile/views/components/sub-note-content.vue:
   private: "この投稿は非公開です"
   deleted: "この投稿は削除されました"
diff --git a/package.json b/package.json
index 6fc8a0648..b6615ed5b 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "misskey",
 	"author": "syuilo <i@syuilo.com>",
-	"version": "11.19.1",
+	"version": "11.20.0",
 	"codename": "daybreak",
 	"repository": {
 		"type": "git",
diff --git a/src/boot/master.ts b/src/boot/master.ts
index 503f09c1f..6c23a528f 100644
--- a/src/boot/master.ts
+++ b/src/boot/master.ts
@@ -50,7 +50,7 @@ export async function masterMain() {
 		// initialize app
 		config = await init();
 
-		if (config.port == null) {
+		if (config.port == null || Number.isNaN(config.port)) {
 			bootLogger.error('The port is not configured. Please configure port.', null, true);
 			process.exit(1);
 		}
diff --git a/src/client/app/admin/views/drive.vue b/src/client/app/admin/views/drive.vue
index 22b3b7eb9..1152db2b9 100644
--- a/src/client/app/admin/views/drive.vue
+++ b/src/client/app/admin/views/drive.vue
@@ -14,6 +14,10 @@
 			<ui-button @click="show()"><fa :icon="faSearch"/> {{ $t('lookup') }}</ui-button>
 			<ui-textarea v-if="file" :value="file | json5" readonly tall style="margin-top:16px;"></ui-textarea>
 		</section>
+		<section>
+			<ui-button @click="cleanUp()"><fa :icon="faTrashAlt"/> {{ $t('clean-up') }}</ui-button>
+			<ui-button @click="cleanRemoteFiles()"><fa :icon="faTrashAlt"/> {{ $t('clean-remote-files') }}</ui-button>
+		</section>
 	</ui-card>
 
 	<ui-card>
@@ -227,6 +231,29 @@ export default Vue.extend({
 				});
 			});
 		},
+
+		cleanRemoteFiles() {
+			this.$root.dialog({
+				type: 'warning',
+				text: this.$t('clean-remote-files-are-you-sure'),
+				showCancelButton: true
+			}).then(({ canceled }) => {
+				if (canceled) return;
+				this.$root.api('admin/drive/clean-remote-files');
+				this.$root.dialog({
+					type: 'success',
+					splash: true
+				});
+			});
+		},
+
+		cleanUp() {
+			this.$root.api('admin/drive/cleanup');
+			this.$root.dialog({
+				type: 'success',
+				splash: true
+			});
+		}
 	}
 });
 </script>
diff --git a/src/client/app/admin/views/queue.chart.vue b/src/client/app/admin/views/queue.chart.vue
new file mode 100644
index 000000000..ff29aa839
--- /dev/null
+++ b/src/client/app/admin/views/queue.chart.vue
@@ -0,0 +1,181 @@
+<template>
+<div>
+	<ui-info warn v-if="latestStats && latestStats.waiting > 0">The queue is jammed.</ui-info>
+	<ui-horizon-group inputs v-if="latestStats" class="fit-bottom">
+		<ui-input :value="latestStats.activeSincePrevTick | number" type="text" readonly>
+			<span>Process</span>
+			<template #prefix><fa :icon="fasPlayCircle"/></template>
+			<template #suffix>jobs/tick</template>
+		</ui-input>
+		<ui-input :value="latestStats.active | number" type="text" readonly>
+			<span>Active</span>
+			<template #prefix><fa :icon="farPlayCircle"/></template>
+			<template #suffix>jobs</template>
+		</ui-input>
+		<ui-input :value="latestStats.waiting | number" type="text" readonly>
+			<span>Waiting</span>
+			<template #prefix><fa :icon="faStopCircle"/></template>
+			<template #suffix>jobs</template>
+		</ui-input>
+		<ui-input :value="latestStats.delayed | number" type="text" readonly>
+			<span>Delayed</span>
+			<template #prefix><fa :icon="faStopwatch"/></template>
+			<template #suffix>jobs</template>
+		</ui-input>
+	</ui-horizon-group>
+	<div ref="chart" class="wptihjuy"></div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import i18n from '../../i18n';
+import ApexCharts from 'apexcharts';
+import * as tinycolor from 'tinycolor2';
+import { faStopwatch, faPlayCircle as fasPlayCircle } from '@fortawesome/free-solid-svg-icons';
+import { faStopCircle, faPlayCircle as farPlayCircle } from '@fortawesome/free-regular-svg-icons';
+
+export default Vue.extend({
+	i18n: i18n('admin/views/queue.vue'),
+
+	props: {
+		type: {
+			type: String,
+			required: true
+		},
+		connection: {
+			required: true
+		},
+		limit: {
+			type: Number,
+			required: true
+		}
+	},
+
+	data() {
+		return {
+			stats: [],
+			chart: null,
+			faStopwatch, faStopCircle, farPlayCircle, fasPlayCircle
+		};
+	},
+
+	computed: {
+		latestStats(): any {
+			return this.stats.length > 0 ? this.stats[this.stats.length - 1][this.type] : null;
+		}
+	},
+
+	watch: {
+		stats(stats) {
+			this.chart.updateSeries([{
+				name: 'Process',
+				type: 'area',
+				data: stats.map((x, i) => ({ x: i, y: x[this.type].activeSincePrevTick }))
+			}, {
+				name: 'Active',
+				type: 'area',
+				data: stats.map((x, i) => ({ x: i, y: x[this.type].active }))
+			}, {
+				name: 'Waiting',
+				type: 'line',
+				data: stats.map((x, i) => ({ x: i, y: x[this.type].waiting }))
+			}, {
+				name: 'Delayed',
+				type: 'line',
+				data: stats.map((x, i) => ({ x: i, y: x[this.type].delayed }))
+			}]);
+		},
+	},
+
+	mounted() {
+		this.chart = new ApexCharts(this.$refs.chart, {
+			chart: {
+				id: this.type,
+				group: 'queue',
+				type: 'area',
+				height: 200,
+				animations: {
+					dynamicAnimation: {
+						enabled: false
+					}
+				},
+				toolbar: {
+					show: false
+				},
+				zoom: {
+					enabled: false
+				}
+			},
+			dataLabels: {
+				enabled: false
+			},
+			grid: {
+				clipMarkers: false,
+				borderColor: 'rgba(0, 0, 0, 0.1)',
+				xaxis: {
+					lines: {
+						show: true,
+					}
+				},
+			},
+			stroke: {
+				curve: 'straight',
+				width: 2
+			},
+			tooltip: {
+				enabled: false
+			},
+			legend: {
+				labels: {
+					colors: tinycolor(getComputedStyle(document.documentElement).getPropertyValue('--text')).toRgbString()
+				},
+			},
+			series: [] as any,
+			colors: ['#00E396', '#00BCD4', '#FFB300', '#e53935'],
+			xaxis: {
+				type: 'numeric',
+				labels: {
+					show: false
+				},
+				tooltip: {
+					enabled: false
+				}
+			},
+			yaxis: {
+				show: false,
+				min: 0,
+			}
+		});
+
+		this.chart.render();
+
+		this.connection.on('stats', this.onStats);
+		this.connection.on('statsLog', this.onStatsLog);
+
+		this.$once('hook:beforeDestroy', () => {
+			if (this.chart) this.chart.destroy();
+		});
+	},
+
+	methods: {
+		onStats(stats) {
+			this.stats.push(stats);
+			if (this.stats.length > this.limit) this.stats.shift();
+		},
+
+		onStatsLog(statsLog) {
+			for (const stats of statsLog.reverse()) {
+				this.onStats(stats);
+			}
+		},
+	}
+});
+</script>
+
+<style lang="stylus" scoped>
+.wptihjuy
+	min-height 200px !important
+	margin -8px
+
+</style>
diff --git a/src/client/app/admin/views/queue.vue b/src/client/app/admin/views/queue.vue
index b379ba185..43a41ffbe 100644
--- a/src/client/app/admin/views/queue.vue
+++ b/src/client/app/admin/views/queue.vue
@@ -2,59 +2,27 @@
 <div>
 	<ui-card>
 		<template #title><fa :icon="faChartBar"/> {{ $t('title') }}</template>
-		<section class="wptihjuy">
-			<header><fa :icon="faPaperPlane"/> Deliver</header>
-			<ui-info warn v-if="latestStats && latestStats.deliver.waiting > 0">The queue is jammed.</ui-info>
-			<ui-horizon-group inputs v-if="latestStats" class="fit-bottom">
-				<ui-input :value="latestStats.deliver.activeSincePrevTick | number" type="text" readonly>
-					<span>Process</span>
-					<template #prefix><fa :icon="fasPlayCircle"/></template>
-					<template #suffix>jobs/tick</template>
-				</ui-input>
-				<ui-input :value="latestStats.deliver.active | number" type="text" readonly>
-					<span>Active</span>
-					<template #prefix><fa :icon="farPlayCircle"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-				<ui-input :value="latestStats.deliver.waiting | number" type="text" readonly>
-					<span>Waiting</span>
-					<template #prefix><fa :icon="faStopCircle"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-				<ui-input :value="latestStats.deliver.delayed | number" type="text" readonly>
-					<span>Delayed</span>
-					<template #prefix><fa :icon="faStopwatch"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-			</ui-horizon-group>
-			<div ref="deliverChart" class="chart"></div>
+		<section>
+			<header><fa :icon="faPaperPlane"/> {{ $t('domains.deliver') }}</header>
+			<x-chart v-if="connection" :connection="connection" :limit="chartLimit" type="deliver"/>
 		</section>
-		<section class="wptihjuy">
-			<header><fa :icon="faInbox"/> Inbox</header>
-			<ui-info warn v-if="latestStats && latestStats.inbox.waiting > 0">The queue is jammed.</ui-info>
-			<ui-horizon-group inputs v-if="latestStats" class="fit-bottom">
-				<ui-input :value="latestStats.inbox.activeSincePrevTick | number" type="text" readonly>
-					<span>Process</span>
-					<template #prefix><fa :icon="fasPlayCircle"/></template>
-					<template #suffix>jobs/tick</template>
-				</ui-input>
-				<ui-input :value="latestStats.inbox.active | number" type="text" readonly>
-					<span>Active</span>
-					<template #prefix><fa :icon="farPlayCircle"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-				<ui-input :value="latestStats.inbox.waiting | number" type="text" readonly>
-					<span>Waiting</span>
-					<template #prefix><fa :icon="faStopCircle"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-				<ui-input :value="latestStats.inbox.delayed | number" type="text" readonly>
-					<span>Delayed</span>
-					<template #prefix><fa :icon="faStopwatch"/></template>
-					<template #suffix>jobs</template>
-				</ui-input>
-			</ui-horizon-group>
-			<div ref="inboxChart" class="chart"></div>
+		<section>
+			<header><fa :icon="faInbox"/> {{ $t('domains.inbox') }}</header>
+			<x-chart v-if="connection" :connection="connection" :limit="chartLimit" type="inbox"/>
+		</section>
+		<section>
+			<details>
+				<summary>{{ $t('other-queues') }}</summary>
+				<section>
+					<header><fa :icon="faDatabase"/> {{ $t('domains.db') }}</header>
+					<x-chart v-if="connection" :connection="connection" :limit="chartLimit" type="db"/>
+				</section>
+				<ui-hr/>
+				<section>
+					<header><fa :icon="faCloud"/> {{ $t('domains.objectStorage') }}</header>
+					<x-chart v-if="connection" :connection="connection" :limit="chartLimit" type="objectStorage"/>
+				</section>
+			</details>
 		</section>
 		<section>
 			<ui-button @click="removeAllJobs">{{ $t('remove-all-jobs') }}</ui-button>
@@ -69,9 +37,13 @@
 					<template #label>{{ $t('queue') }}</template>
 					<option value="deliver">{{ $t('domains.deliver') }}</option>
 					<option value="inbox">{{ $t('domains.inbox') }}</option>
+					<option value="db">{{ $t('domains.db') }}</option>
+					<option value="objectStorage">{{ $t('domains.objectStorage') }}</option>
 				</ui-select>
 				<ui-select v-model="state">
 					<template #label>{{ $t('state') }}</template>
+					<option value="active">{{ $t('states.active') }}</option>
+					<option value="waiting">{{ $t('states.waiting') }}</option>
 					<option value="delayed">{{ $t('states.delayed') }}</option>
 				</ui-select>
 			</ui-horizon-group>
@@ -94,74 +66,31 @@
 
 <script lang="ts">
 import Vue from 'vue';
+import { faTasks, faInbox, faDatabase, faCloud } from '@fortawesome/free-solid-svg-icons';
+import { faPaperPlane, faChartBar } from '@fortawesome/free-regular-svg-icons';
 import i18n from '../../i18n';
-import ApexCharts from 'apexcharts';
-import * as tinycolor from 'tinycolor2';
-import { faTasks, faInbox, faStopwatch, faPlayCircle as fasPlayCircle } from '@fortawesome/free-solid-svg-icons';
-import { faPaperPlane, faStopCircle, faPlayCircle as farPlayCircle, faChartBar } from '@fortawesome/free-regular-svg-icons';
-
-const limit = 200;
+import XChart from './queue.chart.vue';
 
 export default Vue.extend({
 	i18n: i18n('admin/views/queue.vue'),
 
+	components: {
+		XChart
+	},
+
 	data() {
 		return {
-			stats: [],
-			deliverChart: null,
-			inboxChart: null,
+			connection: null,
+			chartLimit: 200,
 			jobs: [],
 			jobsLimit: 50,
 			domain: 'deliver',
 			state: 'delayed',
-			faTasks, faPaperPlane, faInbox, faStopwatch, faStopCircle, farPlayCircle, fasPlayCircle, faChartBar
+			faTasks, faPaperPlane, faInbox, faChartBar, faDatabase, faCloud
 		};
 	},
 
-	computed: {
-		latestStats(): any {
-			return this.stats[this.stats.length - 1];
-		}
-	},
-
 	watch: {
-		stats(stats) {
-			this.inboxChart.updateSeries([{
-				name: 'Process',
-				type: 'area',
-				data: stats.map((x, i) => ({ x: i, y: x.inbox.activeSincePrevTick }))
-			}, {
-				name: 'Active',
-				type: 'area',
-				data: stats.map((x, i) => ({ x: i, y: x.inbox.active }))
-			}, {
-				name: 'Waiting',
-				type: 'line',
-				data: stats.map((x, i) => ({ x: i, y: x.inbox.waiting }))
-			}, {
-				name: 'Delayed',
-				type: 'line',
-				data: stats.map((x, i) => ({ x: i, y: x.inbox.delayed }))
-			}]);
-			this.deliverChart.updateSeries([{
-				name: 'Process',
-				type: 'area',
-				data: stats.map((x, i) => ({ x: i, y: x.deliver.activeSincePrevTick }))
-			}, {
-				name: 'Active',
-				type: 'area',
-				data: stats.map((x, i) => ({ x: i, y: x.deliver.active }))
-			}, {
-				name: 'Waiting',
-				type: 'line',
-				data: stats.map((x, i) => ({ x: i, y: x.deliver.waiting }))
-			}, {
-				name: 'Delayed',
-				type: 'line',
-				data: stats.map((x, i) => ({ x: i, y: x.deliver.delayed }))
-			}]);
-		},
-
 		domain() {
 			this.jobs = [];
 			this.fetchJobs();
@@ -176,83 +105,14 @@ export default Vue.extend({
 	mounted() {
 		this.fetchJobs();
 
-		const chartOpts = id => ({
-			chart: {
-				id,
-				group: 'queue',
-				type: 'area',
-				height: 200,
-				animations: {
-					dynamicAnimation: {
-						enabled: false
-					}
-				},
-				toolbar: {
-					show: false
-				},
-				zoom: {
-					enabled: false
-				}
-			},
-			dataLabels: {
-				enabled: false
-			},
-			grid: {
-				clipMarkers: false,
-				borderColor: 'rgba(0, 0, 0, 0.1)',
-				xaxis: {
-					lines: {
-						show: true,
-					}
-				},
-			},
-			stroke: {
-				curve: 'straight',
-				width: 2
-			},
-			tooltip: {
-				enabled: false
-			},
-			legend: {
-				labels: {
-					colors: tinycolor(getComputedStyle(document.documentElement).getPropertyValue('--text')).toRgbString()
-				},
-			},
-			series: [] as any,
-			colors: ['#00E396', '#00BCD4', '#FFB300', '#e53935'],
-			xaxis: {
-				type: 'numeric',
-				labels: {
-					show: false
-				},
-				tooltip: {
-					enabled: false
-				}
-			},
-			yaxis: {
-				show: false,
-				min: 0,
-			}
-		});
-
-		this.inboxChart = new ApexCharts(this.$refs.inboxChart, chartOpts('a'));
-		this.deliverChart = new ApexCharts(this.$refs.deliverChart, chartOpts('b'));
-
-		this.inboxChart.render();
-		this.deliverChart.render();
-
-		const connection = this.$root.stream.useSharedConnection('queueStats');
-		connection.on('stats', this.onStats);
-		connection.on('statsLog', this.onStatsLog);
-		connection.send('requestLog', {
+		this.connection = this.$root.stream.useSharedConnection('queueStats');
+		this.connection.send('requestLog', {
 			id: Math.random().toString().substr(2, 8),
-			length: limit
+			length: this.chartLimit
 		});
 
 		this.$once('hook:beforeDestroy', () => {
-			connection.dispose();
-			this.inboxChart.destroy();
-			this.deliverChart.destroy();
+			this.connection.dispose();
 		});
 	},
 
@@ -274,17 +134,6 @@ export default Vue.extend({
 			});
 		},
 
-		onStats(stats) {
-			this.stats.push(stats);
-			if (this.stats.length > limit) this.stats.shift();
-		},
-
-		onStatsLog(statsLog) {
-			for (const stats of statsLog.reverse()) {
-				this.onStats(stats);
-			}
-		},
-
 		fetchJobs() {
 			this.$root.api('admin/queue/jobs', {
 				domain: this.domain,
@@ -299,11 +148,6 @@ export default Vue.extend({
 </script>
 
 <style lang="stylus" scoped>
-.wptihjuy
-	> .chart
-		min-height 200px !important
-		margin 0 -8px
-
 .xvvuvgsv
 	> b
 		margin-right 16px
diff --git a/src/client/app/common/scripts/post-form.ts b/src/client/app/common/scripts/post-form.ts
new file mode 100644
index 000000000..85a578484
--- /dev/null
+++ b/src/client/app/common/scripts/post-form.ts
@@ -0,0 +1,478 @@
+import insertTextAtCursor from 'insert-text-at-cursor';
+import { length } from 'stringz';
+import { toASCII } from 'punycode';
+import MkVisibilityChooser from '../views/components/visibility-chooser.vue';
+import getFace from './get-face';
+import { parse } from '../../../../mfm/parse';
+import { host, url } from '../../config';
+import i18n from '../../i18n';
+import { erase, unique } from '../../../../prelude/array';
+import extractMentions from '../../../../misc/extract-mentions';
+
+export default (opts) => ({
+	i18n: i18n(),
+
+	components: {
+		XPostFormAttaches: () => import('../views/components/post-form-attaches.vue').then(m => m.default),
+		XPollEditor: () => import('../views/components/poll-editor.vue').then(m => m.default)
+	},
+
+	props: {
+		reply: {
+			type: Object,
+			required: false
+		},
+		renote: {
+			type: Object,
+			required: false
+		},
+		mention: {
+			type: Object,
+			required: false
+		},
+		initialText: {
+			type: String,
+			required: false
+		},
+		instant: {
+			type: Boolean,
+			required: false,
+			default: false
+		}
+	},
+
+	data() {
+		return {
+			posting: false,
+			text: '',
+			files: [],
+			uploadings: [],
+			poll: false,
+			pollChoices: [],
+			pollMultiple: false,
+			pollExpiration: [],
+			useCw: false,
+			cw: null,
+			geo: null,
+			visibility: 'public',
+			visibleUsers: [],
+			localOnly: false,
+			autocomplete: null,
+			draghover: false,
+			quoteId: null,
+			recentHashtags: JSON.parse(localStorage.getItem('hashtags') || '[]'),
+			maxNoteTextLength: 1000
+		};
+	},
+
+	computed: {
+		draftId(): string {
+			return this.renote
+				? `renote:${this.renote.id}`
+				: this.reply
+					? `reply:${this.reply.id}`
+					: 'note';
+		},
+
+		placeholder(): string {
+			const xs = [
+				this.$t('@.note-placeholders.a'),
+				this.$t('@.note-placeholders.b'),
+				this.$t('@.note-placeholders.c'),
+				this.$t('@.note-placeholders.d'),
+				this.$t('@.note-placeholders.e'),
+				this.$t('@.note-placeholders.f')
+			];
+			const x = xs[Math.floor(Math.random() * xs.length)];
+
+			return this.renote
+				? opts.mobile ? this.$t('@.post-form.option-quote-placeholder') : this.$t('@.post-form.quote-placeholder')
+				: this.reply
+					? this.$t('@.post-form.reply-placeholder')
+					: x;
+		},
+
+		submitText(): string {
+			return this.renote
+				? this.$t('@.post-form.renote')
+				: this.reply
+					? this.$t('@.post-form.reply')
+					: this.$t('@.post-form.submit');
+		},
+
+		canPost(): boolean {
+			return !this.posting &&
+				(1 <= this.text.length || 1 <= this.files.length || this.poll || this.renote) &&
+				(length(this.text.trim()) <= this.maxNoteTextLength) &&
+				(!this.poll || this.pollChoices.length >= 2);
+		}
+	},
+
+	created() {
+		this.$root.getMeta().then(meta => {
+			this.maxNoteTextLength = meta.maxNoteTextLength;
+		});
+	},
+
+	mounted() {
+		if (this.initialText) {
+			this.text = this.initialText;
+		}
+
+		if (this.mention) {
+			this.text = this.mention.host ? `@${this.mention.username}@${toASCII(this.mention.host)}` : `@${this.mention.username}`;
+			this.text += ' ';
+		}
+
+		if (this.reply && this.reply.user.host != null) {
+			this.text = `@${this.reply.user.username}@${toASCII(this.reply.user.host)} `;
+		}
+
+		if (this.reply && this.reply.text != null) {
+			const ast = parse(this.reply.text);
+
+			for (const x of extractMentions(ast)) {
+				const mention = x.host ? `@${x.username}@${toASCII(x.host)}` : `@${x.username}`;
+
+				// 自分は除外
+				if (this.$store.state.i.username == x.username && x.host == null) continue;
+				if (this.$store.state.i.username == x.username && x.host == host) continue;
+
+				// 重複は除外
+				if (this.text.indexOf(`${mention} `) != -1) continue;
+
+				this.text += `${mention} `;
+			}
+		}
+
+		// デフォルト公開範囲
+		this.applyVisibility(this.$store.state.settings.rememberNoteVisibility ? (this.$store.state.device.visibility || this.$store.state.settings.defaultNoteVisibility) : this.$store.state.settings.defaultNoteVisibility);
+
+		// 公開以外へのリプライ時は元の公開範囲を引き継ぐ
+		if (this.reply && ['home', 'followers', 'specified'].includes(this.reply.visibility)) {
+			this.visibility = this.reply.visibility;
+		}
+
+		if (this.reply) {
+			this.$root.api('users/show', { userId: this.reply.userId }).then(user => {
+				this.visibleUsers.push(user);
+			});
+		}
+
+		// keep cw when reply
+		if (this.$store.state.settings.keepCw && this.reply && this.reply.cw) {
+			this.useCw = true;
+			this.cw = this.reply.cw;
+		}
+
+		this.focus();
+
+		this.$nextTick(() => {
+			this.focus();
+		});
+
+		this.$nextTick(() => {
+			// 書きかけの投稿を復元
+			if (!this.instant && !this.mention) {
+				const draft = JSON.parse(localStorage.getItem('drafts') || '{}')[this.draftId];
+				if (draft) {
+					this.text = draft.data.text;
+					this.files = (draft.data.files || []).filter(e => e);
+					if (draft.data.poll) {
+						this.poll = true;
+						this.$nextTick(() => {
+							(this.$refs.poll as any).set(draft.data.poll);
+						});
+					}
+					this.$emit('change-attached-files', this.files);
+				}
+			}
+
+			this.$nextTick(() => this.watch());
+		});
+	},
+
+	methods: {
+		watch() {
+			this.$watch('text', () => this.saveDraft());
+			this.$watch('poll', () => this.saveDraft());
+			this.$watch('files', () => this.saveDraft());
+		},
+
+		trimmedLength(text: string) {
+			return length(text.trim());
+		},
+
+		addTag(tag: string) {
+			insertTextAtCursor(this.$refs.text, ` #${tag} `);
+		},
+
+		focus() {
+			(this.$refs.text as any).focus();
+		},
+
+		chooseFile() {
+			(this.$refs.file as any).click();
+		},
+
+		chooseFileFromDrive() {
+			this.$chooseDriveFile({
+				multiple: true
+			}).then(files => {
+				for (const x of files) this.attachMedia(x);
+			});
+		},
+
+		attachMedia(driveFile) {
+			this.files.push(driveFile);
+			this.$emit('change-attached-files', this.files);
+		},
+
+		detachMedia(id) {
+			this.files = this.files.filter(x => x.id != id);
+			this.$emit('change-attached-files', this.files);
+		},
+
+		onChangeFile() {
+			for (const x of Array.from((this.$refs.file as any).files)) this.upload(x);
+		},
+
+		upload(file) {
+			(this.$refs.uploader as any).upload(file);
+		},
+
+		onChangeUploadings(uploads) {
+			this.$emit('change-uploadings', uploads);
+		},
+
+		onPollUpdate() {
+			const got = this.$refs.poll.get();
+			this.pollChoices = got.choices;
+			this.pollMultiple = got.multiple;
+			this.pollExpiration = [got.expiration, got.expiresAt || got.expiredAfter];
+			this.saveDraft();
+		},
+
+		setGeo() {
+			if (navigator.geolocation == null) {
+				this.$root.dialog({
+					type: 'warning',
+					text: this.$t('@.post-form.geolocation-alert')
+				});
+				return;
+			}
+
+			navigator.geolocation.getCurrentPosition(pos => {
+				this.geo = pos.coords;
+				this.$emit('geo-attached', this.geo);
+			}, err => {
+				this.$root.dialog({
+					type: 'error',
+					title: this.$t('@.post-form.error'),
+					text: err.message
+				});
+			}, {
+					enableHighAccuracy: true
+				});
+		},
+
+		removeGeo() {
+			this.geo = null;
+			this.$emit('geo-dettached');
+		},
+
+		setVisibility() {
+			const w = this.$root.new(MkVisibilityChooser, {
+				source: this.$refs.visibilityButton,
+				currentVisibility: this.visibility
+			});
+			w.$once('chosen', v => {
+				this.applyVisibility(v);
+			});
+		},
+
+		applyVisibility(v: string) {
+			const m = v.match(/^local-(.+)/);
+			if (m) {
+				this.localOnly = true;
+				this.visibility = m[1];
+			} else {
+				this.localOnly = false;
+				this.visibility = v;
+			}
+		},
+
+		addVisibleUser() {
+			this.$root.dialog({
+				title: this.$t('@.post-form.enter-username'),
+				user: true
+			}).then(({ canceled, result: user }) => {
+				if (canceled) return;
+				this.visibleUsers.push(user);
+			});
+		},
+
+		removeVisibleUser(user) {
+			this.visibleUsers = erase(user, this.visibleUsers);
+		},
+
+		clear() {
+			this.text = '';
+			this.files = [];
+			this.poll = false;
+			this.$emit('change-attached-files', this.files);
+		},
+
+		onKeydown(e) {
+			if ((e.which == 10 || e.which == 13) && (e.ctrlKey || e.metaKey) && this.canPost) this.post();
+		},
+
+		async onPaste(e) {
+			for (const item of Array.from(e.clipboardData.items)) {
+				if (item.kind == 'file') {
+					this.upload(item.getAsFile());
+				}
+			}
+
+			const paste = e.clipboardData.getData('text');
+
+			if (paste.startsWith(url + '/notes/')) {
+				e.preventDefault();
+
+				this.$root.dialog({
+					type: 'info',
+					text: this.$t('@.post-form.quote-question'),
+					showCancelButton: true
+				}).then(({ canceled }) => {
+					if (canceled) {
+						insertTextAtCursor(this.$refs.text, paste);
+						return;
+					}
+
+					this.quoteId = paste.substr(url.length).match(/^\/notes\/(.+?)\/?$/)[1];
+				});
+			}
+		},
+
+		onDragover(e) {
+			const isFile = e.dataTransfer.items[0].kind == 'file';
+			const isDriveFile = e.dataTransfer.types[0] == 'mk_drive_file';
+			if (isFile || isDriveFile) {
+				e.preventDefault();
+				this.draghover = true;
+				e.dataTransfer.dropEffect = e.dataTransfer.effectAllowed == 'all' ? 'copy' : 'move';
+			}
+		},
+
+		onDragenter(e) {
+			this.draghover = true;
+		},
+
+		onDragleave(e) {
+			this.draghover = false;
+		},
+
+		onDrop(e): void {
+			this.draghover = false;
+
+			// ファイルだったら
+			if (e.dataTransfer.files.length > 0) {
+				e.preventDefault();
+				for (const x of Array.from(e.dataTransfer.files)) this.upload(x);
+				return;
+			}
+
+			//#region ドライブのファイル
+			const driveFile = e.dataTransfer.getData('mk_drive_file');
+			if (driveFile != null && driveFile != '') {
+				const file = JSON.parse(driveFile);
+				this.files.push(file);
+				this.$emit('change-attached-files', this.files);
+				e.preventDefault();
+			}
+			//#endregion
+		},
+
+		async emoji() {
+			const Picker = await import('../../desktop/views/components/emoji-picker-dialog.vue').then(m => m.default);
+			const button = this.$refs.emoji;
+			const rect = button.getBoundingClientRect();
+			const vm = this.$root.new(Picker, {
+				x: button.offsetWidth + rect.left + window.pageXOffset,
+				y: rect.top + window.pageYOffset
+			});
+			vm.$once('chosen', emoji => {
+				insertTextAtCursor(this.$refs.text, emoji);
+			});
+		},
+
+		saveDraft() {
+			if (this.instant) return;
+
+			const data = JSON.parse(localStorage.getItem('drafts') || '{}');
+
+			data[this.draftId] = {
+				updatedAt: new Date(),
+				data: {
+					text: this.text,
+					files: this.files,
+					poll: this.poll && this.$refs.poll ? (this.$refs.poll as any).get() : undefined
+				}
+			};
+
+			localStorage.setItem('drafts', JSON.stringify(data));
+		},
+
+		deleteDraft() {
+			const data = JSON.parse(localStorage.getItem('drafts') || '{}');
+
+			delete data[this.draftId];
+
+			localStorage.setItem('drafts', JSON.stringify(data));
+		},
+
+		kao() {
+			this.text += getFace();
+		},
+
+		post() {
+			this.posting = true;
+			const viaMobile = opts.mobile && !this.$store.state.settings.disableViaMobile;
+			this.$root.api('notes/create', {
+				text: this.text == '' ? undefined : this.text,
+				fileIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined,
+				replyId: this.reply ? this.reply.id : undefined,
+				renoteId: this.renote ? this.renote.id : this.quoteId ? this.quoteId : undefined,
+				poll: this.poll ? (this.$refs.poll as any).get() : undefined,
+				cw: this.useCw ? this.cw || '' : undefined,
+				visibility: this.visibility,
+				visibleUserIds: this.visibility == 'specified' ? this.visibleUsers.map(u => u.id) : undefined,
+				localOnly: this.localOnly,
+				geo: this.geo ? {
+					coordinates: [this.geo.longitude, this.geo.latitude],
+					altitude: this.geo.altitude,
+					accuracy: this.geo.accuracy,
+					altitudeAccuracy: this.geo.altitudeAccuracy,
+					heading: isNaN(this.geo.heading) ? null : this.geo.heading,
+					speed: this.geo.speed,
+				} : null,
+				viaMobile: viaMobile
+			}).then(data => {
+				this.clear();
+				this.deleteDraft();
+				this.$emit('posted');
+				if (opts.onSuccess) opts.onSuccess(this);
+			}).catch(err => {
+				if (opts.onSuccess) opts.onFailure(this);
+			}).then(() => {
+				this.posting = false;
+			});
+
+			if (this.text && this.text != '') {
+				const hashtags = parse(this.text).filter(x => x.node.type === 'hashtag').map(x => x.node.props.hashtag);
+				const history = JSON.parse(localStorage.getItem('hashtags') || '[]') as string[];
+				localStorage.setItem('hashtags', JSON.stringify(unique(hashtags.concat(history))));
+			}
+		},
+	}
+});
diff --git a/src/client/app/common/views/components/ui/input.vue b/src/client/app/common/views/components/ui/input.vue
index dd0912f83..e266e141e 100644
--- a/src/client/app/common/views/components/ui/input.vue
+++ b/src/client/app/common/views/components/ui/input.vue
@@ -210,17 +210,25 @@ export default Vue.extend({
 		}
 
 		this.$nextTick(() => {
-			if (this.$refs.prefix) {
-				this.$refs.label.style.left = (this.$refs.prefix.offsetLeft + this.$refs.prefix.offsetWidth) + 'px';
-				if (this.$refs.prefix.offsetWidth) {
-					this.$refs.input.style.paddingLeft = this.$refs.prefix.offsetWidth + 'px';
+			// このコンポーネントが作成された時、非表示状態である場合がある
+			// 非表示状態だと要素の幅などは0になってしまうので、定期的に計算する
+			const clock = setInterval(() => {
+				if (this.$refs.prefix) {
+					this.$refs.label.style.left = (this.$refs.prefix.offsetLeft + this.$refs.prefix.offsetWidth) + 'px';
+					if (this.$refs.prefix.offsetWidth) {
+						this.$refs.input.style.paddingLeft = this.$refs.prefix.offsetWidth + 'px';
+					}
 				}
-			}
-			if (this.$refs.suffix) {
-				if (this.$refs.suffix.offsetWidth) {
-					this.$refs.input.style.paddingRight = this.$refs.suffix.offsetWidth + 'px';
+				if (this.$refs.suffix) {
+					if (this.$refs.suffix.offsetWidth) {
+						this.$refs.input.style.paddingRight = this.$refs.suffix.offsetWidth + 'px';
+					}
 				}
-			}
+			}, 100);
+
+			this.$once('hook:beforeDestroy', () => {
+				clearInterval(clock);
+			});
 		});
 
 		this.$on('keydown', (e: KeyboardEvent) => {
diff --git a/src/client/app/common/views/components/url-preview.vue b/src/client/app/common/views/components/url-preview.vue
index 6e0d73eef..9c61e4605 100644
--- a/src/client/app/common/views/components/url-preview.vue
+++ b/src/client/app/common/views/components/url-preview.vue
@@ -9,7 +9,7 @@
 	</blockquote>
 </div>
 <div v-else class="mk-url-preview">
-	<component :is="self ? 'router-link' : 'a'" :class="{ mini: narrow, compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="self ? null : '_blank'" :title="url" v-if="!fetching">
+	<component :is="hasRoute ? 'router-link' : 'a'" :class="{ mini: narrow, compact }" :[attr]="hasRoute ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url" v-if="!fetching">
 		<div class="thumbnail" v-if="thumbnail" :style="`background-image: url('${thumbnail}')`">
 			<button v-if="!playerEnabled && player.url" @click.prevent="playerEnabled = true" :title="$t('enable-player')"><fa :icon="['far', 'play-circle']"/></button>
 		</div>
@@ -61,7 +61,13 @@ export default Vue.extend({
 	},
 
 	data() {
+		const isSelf = this.url.startsWith(local);
+		const hasRoute =
+			this.url.substr(local.length).startsWith('/@') ||
+			this.url.substr(local.length).startsWith('/notes/') ||
+			this.url.substr(local.length).startsWith('/pages/');
 		return {
+			local,
 			fetching: true,
 			title: null,
 			description: null,
@@ -75,9 +81,10 @@ export default Vue.extend({
 			},
 			tweetUrl: null,
 			playerEnabled: false,
-			local,
-			self: this.url.startsWith(local),
-			attr: this.url.startsWith(local) ? 'to' : 'href'
+			self: isSelf,
+			hasRoute: hasRoute,
+			attr: hasRoute ? 'to' : 'href',
+			target: hasRoute ? null : '_blank'
 		};
 	},
 
diff --git a/src/client/app/common/views/pages/page-editor/els/page-editor.el.counter.vue b/src/client/app/common/views/pages/page-editor/els/page-editor.el.counter.vue
index 95c15b01b..4fc2aac8f 100644
--- a/src/client/app/common/views/pages/page-editor/els/page-editor.el.counter.vue
+++ b/src/client/app/common/views/pages/page-editor/els/page-editor.el.counter.vue
@@ -5,7 +5,7 @@
 	<section style="padding: 0 16px 0 16px;">
 		<ui-input v-model="value.name"><template #prefix><fa :icon="faMagic"/></template><span>{{ $t('blocks._counter.name') }}</span></ui-input>
 		<ui-input v-model="value.text"><span>{{ $t('blocks._counter.text') }}</span></ui-input>
-		<ui-input v-model="value.inc" type="number"><span>{{ $t('blocks._counter.increment') }}</span></ui-input>
+		<ui-input v-model="value.inc" type="number"><span>{{ $t('blocks._counter.inc') }}</span></ui-input>
 	</section>
 </x-container>
 </template>
diff --git a/src/client/app/desktop/views/components/notifications.vue b/src/client/app/desktop/views/components/notifications.vue
index 9ca06f411..6a8bc48ff 100644
--- a/src/client/app/desktop/views/components/notifications.vue
+++ b/src/client/app/desktop/views/components/notifications.vue
@@ -104,18 +104,18 @@
 									<mk-user-name :user="notification.note.user"/>
 								</router-link>
 							</p>
-							<a class="note-preview" :href="notification.note | notePage" :title="getNoteSummary(notification.note)">
+							<router-link class="note-preview" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
 								<mfm :text="getNoteSummary(notification.note)" :should-break="false" :plain-text="true" :custom-emojis="notification.note.emojis"/>
-							</a>
+							</router-link>
 						</div>
 					</template>
 
 					<template v-if="notification.type == 'pollVote'">
 						<mk-avatar class="avatar" :user="notification.user"/>
 						<div class="text">
-							<p><fa icon="chart-pie"/><a :href="notification.user | userPage" v-user-preview="notification.user.id">
+							<p><fa icon="chart-pie"/><router-link :to="notification.user | userPage" v-user-preview="notification.user.id">
 								<mk-user-name :user="notification.user"/>
-							</a></p>
+							</router-link></p>
 							<router-link class="note-ref" :to="notification.note | notePage" :title="getNoteSummary(notification.note)">
 								<fa icon="quote-left"/>
 									<mfm :text="getNoteSummary(notification.note)" :should-break="false" :plain-text="true" :custom-emojis="notification.note.emojis"/>
diff --git a/src/client/app/desktop/views/components/post-form.vue b/src/client/app/desktop/views/components/post-form.vue
index 64652e0eb..39b7781a1 100644
--- a/src/client/app/desktop/views/components/post-form.vue
+++ b/src/client/app/desktop/views/components/post-form.vue
@@ -10,14 +10,15 @@
 			<span v-for="u in visibleUsers">
 				<mk-user-name :user="u"/><a @click="removeVisibleUser(u)">[x]</a>
 			</span>
-			<a @click="addVisibleUser">{{ $t('add-visible-user') }}</a>
+			<a @click="addVisibleUser">{{ $t('@.post-form.add-visible-user') }}</a>
 		</div>
 		<div class="hashtags" v-if="recentHashtags.length > 0 && $store.state.settings.suggestRecentHashtags">
-			<b>{{ $t('recent-tags') }}:</b>
-			<a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('click-to-tagging')">#{{ tag }}</a>
+			<b>{{ $t('@.post-form.recent-tags') }}:</b>
+			<a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('@.post-form.click-to-tagging')">#{{ tag }}</a>
 		</div>
-		<div class="local-only" v-if="localOnly == true">{{ $t('local-only-message') }}</div>
-		<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('annotations')" v-autocomplete="{ model: 'cw' }">
+		<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div>
+		<div class="local-only" v-if="localOnly == true">{{ $t('@.post-form.local-only-message') }}</div>
+		<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }">
 		<div class="textarea">
 			<textarea :class="{ with: (files.length != 0 || poll) }"
 				ref="text" v-model="text" :disabled="posting"
@@ -32,13 +33,13 @@
 		</div>
 	</div>
 	<mk-uploader ref="uploader" @uploaded="attachMedia" @change="onChangeUploadings"/>
-	<button class="upload" :title="$t('attach-media-from-local')" @click="chooseFile"><fa icon="upload"/></button>
-	<button class="drive" :title="$t('attach-media-from-drive')" @click="chooseFileFromDrive"><fa icon="cloud"/></button>
-	<button class="kao" :title="$t('insert-a-kao')" @click="kao"><fa :icon="['far', 'smile']"/></button>
-	<button class="poll" :title="$t('create-poll')" @click="poll = !poll"><fa icon="chart-pie"/></button>
-	<button class="cw" :title="$t('hide-contents')" @click="useCw = !useCw"><fa :icon="['far', 'eye-slash']"/></button>
-	<button class="geo" :title="$t('attach-location-information')" @click="geo ? removeGeo() : setGeo()"><fa icon="map-marker-alt"/></button>
-	<button class="visibility" :title="$t('visibility')" @click="setVisibility" ref="visibilityButton">
+	<button class="upload" :title="$t('@.post-form.attach-media-from-local')" @click="chooseFile"><fa icon="upload"/></button>
+	<button class="drive" :title="$t('@.post-form.attach-media-from-drive')" @click="chooseFileFromDrive"><fa icon="cloud"/></button>
+	<button class="kao" :title="$t('@.post-form.insert-a-kao')" @click="kao"><fa :icon="['far', 'smile']"/></button>
+	<button class="poll" :title="$t('@.post-form.create-poll')" @click="poll = !poll"><fa icon="chart-pie"/></button>
+	<button class="cw" :title="$t('@.post-form.hide-contents')" @click="useCw = !useCw"><fa :icon="['far', 'eye-slash']"/></button>
+	<button class="geo" :title="$t('@.post-form.attach-location-information')" @click="geo ? removeGeo() : setGeo()"><fa icon="map-marker-alt"/></button>
+	<button class="visibility" :title="$t('@.post-form.visibility')" @click="setVisibility" ref="visibilityButton">
 		<span v-if="visibility === 'public'"><fa icon="globe"/></span>
 		<span v-if="visibility === 'home'"><fa icon="home"/></span>
 		<span v-if="visibility === 'followers'"><fa icon="unlock"/></span>
@@ -46,7 +47,7 @@
 	</button>
 	<p class="text-count" :class="{ over: trimmedLength(text) > maxNoteTextLength }">{{ maxNoteTextLength - trimmedLength(text) }}</p>
 	<ui-button primary :wait="posting" class="submit" :disabled="!canPost" @click="post">
-		{{ posting ? $t('posting') : submitText }}<mk-ellipsis v-if="posting"/>
+		{{ posting ? $t('@.post-form.posting') : submitText }}<mk-ellipsis v-if="posting"/>
 	</ui-button>
 	<input ref="file" type="file" multiple="multiple" tabindex="-1" @change="onChangeFile"/>
 	<div class="dropzone" v-if="draghover"></div>
@@ -56,465 +57,29 @@
 <script lang="ts">
 import Vue from 'vue';
 import i18n from '../../../i18n';
-import insertTextAtCursor from 'insert-text-at-cursor';
-import getFace from '../../../common/scripts/get-face';
-import MkVisibilityChooser from '../../../common/views/components/visibility-chooser.vue';
-import { parse } from '../../../../../mfm/parse';
-import { host } from '../../../config';
-import { erase, unique } from '../../../../../prelude/array';
-import { length } from 'stringz';
-import { toASCII } from 'punycode';
-import extractMentions from '../../../../../misc/extract-mentions';
-import XPostFormAttaches from '../../../common/views/components/post-form-attaches.vue';
+import form from '../../../common/scripts/post-form';
 
 export default Vue.extend({
 	i18n: i18n('desktop/views/components/post-form.vue'),
 
-	components: {
-		MkVisibilityChooser,
-		XPostFormAttaches,
-		XPollEditor: () => import('../../../common/views/components/poll-editor.vue').then(m => m.default)
-	},
-
-	props: {
-		reply: {
-			type: Object,
-			required: false
-		},
-		renote: {
-			type: Object,
-			required: false
-		},
-		mention: {
-			type: Object,
-			required: false
-		},
-		initialText: {
-			type: String,
-			required: false
-		},
-		instant: {
-			type: Boolean,
-			required: false,
-			default: false
-		}
-	},
-
-	data() {
-		return {
-			posting: false,
-			text: '',
-			files: [],
-			uploadings: [],
-			poll: false,
-			pollChoices: [],
-			pollMultiple: false,
-			pollExpiration: [],
-			useCw: false,
-			cw: null,
-			geo: null,
-			visibility: 'public',
-			visibleUsers: [],
-			localOnly: false,
-			autocomplete: null,
-			draghover: false,
-			recentHashtags: JSON.parse(localStorage.getItem('hashtags') || '[]'),
-			maxNoteTextLength: 1000
-		};
-	},
-
-	created() {
-		this.$root.getMeta().then(meta => {
-			this.maxNoteTextLength = meta.maxNoteTextLength;
-		});
-	},
-
-	computed: {
-		draftId(): string {
-			return this.renote
-				? `renote:${this.renote.id}`
-				: this.reply
-					? `reply:${this.reply.id}`
-					: 'note';
-		},
-
-		placeholder(): string {
-			const xs = [
-				this.$t('@.note-placeholders.a'),
-				this.$t('@.note-placeholders.b'),
-				this.$t('@.note-placeholders.c'),
-				this.$t('@.note-placeholders.d'),
-				this.$t('@.note-placeholders.e'),
-				this.$t('@.note-placeholders.f')
-			];
-			const x = xs[Math.floor(Math.random() * xs.length)];
-
-			return this.renote
-				? this.$t('quote-placeholder')
-				: this.reply
-					? this.$t('reply-placeholder')
-					: x;
-		},
-
-		submitText(): string {
-			return this.renote
-				? this.$t('renote')
-				: this.reply
-					? this.$t('reply')
-					: this.$t('submit');
-		},
-
-		canPost(): boolean {
-			return !this.posting &&
-				(1 <= this.text.length || 1 <= this.files.length || this.poll || this.renote) &&
-				(length(this.text.trim()) <= this.maxNoteTextLength) &&
-				(!this.poll || this.pollChoices.length >= 2);
-		}
-	},
-
-	mounted() {
-		if (this.initialText) {
-			this.text = this.initialText;
-		}
-
-		if (this.mention) {
-			this.text = this.mention.host ? `@${this.mention.username}@${toASCII(this.mention.host)}` : `@${this.mention.username}`;
-			this.text += ' ';
-		}
-
-		if (this.reply && this.reply.user.host != null) {
-			this.text = `@${this.reply.user.username}@${toASCII(this.reply.user.host)} `;
-		}
-
-		if (this.reply && this.reply.text != null) {
-			const ast = parse(this.reply.text);
-
-			for (const x of extractMentions(ast)) {
-				const mention = x.host ? `@${x.username}@${toASCII(x.host)}` : `@${x.username}`;
-
-				// 自分は除外
-				if (this.$store.state.i.username == x.username && x.host == null) continue;
-				if (this.$store.state.i.username == x.username && x.host == host) continue;
-
-				// 重複は除外
-				if (this.text.indexOf(`${mention} `) != -1) continue;
-
-				this.text += `${mention} `;
+	mixins: [
+		form({
+			onSuccess: self => {
+				self.$notify(self.renote
+					? self.$t('reposted')
+					: self.reply
+						? self.$t('replied')
+						: self.$t('posted'));
+			},
+			onFailure: self => {
+				self.$notify(self.renote
+					? self.$t('renote-failed')
+					: self.reply
+						? self.$t('reply-failed')
+						: self.$t('note-failed'));
 			}
-		}
-
-		// デフォルト公開範囲
-		this.applyVisibility(this.$store.state.settings.rememberNoteVisibility ? (this.$store.state.device.visibility || this.$store.state.settings.defaultNoteVisibility) : this.$store.state.settings.defaultNoteVisibility);
-
-		// 公開以外へのリプライ時は元の公開範囲を引き継ぐ
-		if (this.reply && ['home', 'followers', 'specified'].includes(this.reply.visibility)) {
-			this.visibility = this.reply.visibility;
-		}
-
-		if (this.reply) {
-			this.$root.api('users/show', { userId: this.reply.userId }).then(user => {
-				this.visibleUsers.push(user);
-			});
-		}
-
-		// keep cw when reply
-		if (this.$store.state.settings.keepCw && this.reply && this.reply.cw) {
-			this.useCw = true;
-			this.cw = this.reply.cw;
-		}
-
-		this.$nextTick(() => {
-			// 書きかけの投稿を復元
-			if (!this.instant && !this.mention) {
-				const draft = JSON.parse(localStorage.getItem('drafts') || '{}')[this.draftId];
-				if (draft) {
-					this.text = draft.data.text;
-					this.files = (draft.data.files || []).filter(e => e);
-					if (draft.data.poll) {
-						this.poll = true;
-						this.$nextTick(() => {
-							(this.$refs.poll as any).set(draft.data.poll);
-						});
-					}
-					this.$emit('change-attached-files', this.files);
-				}
-			}
-
-			this.$nextTick(() => this.watch());
-		});
-	},
-
-	methods: {
-		trimmedLength(text: string) {
-			return length(text.trim());
-		},
-
-		addTag(tag: string) {
-			insertTextAtCursor(this.$refs.text, ` #${tag} `);
-		},
-
-		watch() {
-			this.$watch('text', () => this.saveDraft());
-			this.$watch('poll', () => this.saveDraft());
-			this.$watch('files', () => this.saveDraft());
-		},
-
-		focus() {
-			(this.$refs.text as any).focus();
-		},
-
-		chooseFile() {
-			(this.$refs.file as any).click();
-		},
-
-		chooseFileFromDrive() {
-			this.$chooseDriveFile({
-				multiple: true
-			}).then(files => {
-				for (const x of files) this.attachMedia(x);
-			});
-		},
-
-		attachMedia(driveFile) {
-			this.files.push(driveFile);
-			this.$emit('change-attached-files', this.files);
-		},
-
-		detachMedia(id) {
-			this.files = this.files.filter(x => x.id != id);
-			this.$emit('change-attached-files', this.files);
-		},
-
-		onChangeFile() {
-			for (const x of Array.from((this.$refs.file as any).files)) this.upload(x);
-		},
-
-		onPollUpdate() {
-			const got = this.$refs.poll.get();
-			this.pollChoices = got.choices;
-			this.pollMultiple = got.multiple;
-			this.pollExpiration = [got.expiration, got.expiresAt || got.expiredAfter];
-			this.saveDraft();
-		},
-
-		upload(file) {
-			(this.$refs.uploader as any).upload(file);
-		},
-
-		onChangeUploadings(uploads) {
-			this.$emit('change-uploadings', uploads);
-		},
-
-		clear() {
-			this.text = '';
-			this.files = [];
-			this.poll = false;
-			this.$emit('change-attached-files', this.files);
-		},
-
-		onKeydown(e) {
-			if ((e.which == 10 || e.which == 13) && (e.ctrlKey || e.metaKey) && this.canPost) this.post();
-		},
-
-		onPaste(e) {
-			for (const item of Array.from(e.clipboardData.items)) {
-				if (item.kind == 'file') {
-					this.upload(item.getAsFile());
-				}
-			}
-		},
-
-		onDragover(e) {
-			const isFile = e.dataTransfer.items[0].kind == 'file';
-			const isDriveFile = e.dataTransfer.types[0] == 'mk_drive_file';
-			if (isFile || isDriveFile) {
-				e.preventDefault();
-				this.draghover = true;
-				e.dataTransfer.dropEffect = e.dataTransfer.effectAllowed == 'all' ? 'copy' : 'move';
-			}
-		},
-
-		onDragenter(e) {
-			this.draghover = true;
-		},
-
-		onDragleave(e) {
-			this.draghover = false;
-		},
-
-		onDrop(e): void {
-			this.draghover = false;
-
-			// ファイルだったら
-			if (e.dataTransfer.files.length > 0) {
-				e.preventDefault();
-				for (const x of Array.from(e.dataTransfer.files)) this.upload(x);
-				return;
-			}
-
-			//#region ドライブのファイル
-			const driveFile = e.dataTransfer.getData('mk_drive_file');
-			if (driveFile != null && driveFile != '') {
-				const file = JSON.parse(driveFile);
-				this.files.push(file);
-				this.$emit('change-attached-files', this.files);
-				e.preventDefault();
-			}
-			//#endregion
-		},
-
-		setGeo() {
-			if (navigator.geolocation == null) {
-				this.$root.dialog({
-					type: 'warning',
-					text: this.$t('geolocation-alert')
-				});
-				return;
-			}
-
-			navigator.geolocation.getCurrentPosition(pos => {
-				this.geo = pos.coords;
-				this.$emit('geo-attached', this.geo);
-			}, err => {
-				this.$root.dialog({
-					type: 'error',
-					title: this.$t('error'),
-					text: err.message
-				});
-			}, {
-					enableHighAccuracy: true
-				});
-		},
-
-		removeGeo() {
-			this.geo = null;
-			this.$emit('geo-dettached');
-		},
-
-		setVisibility() {
-			const w = this.$root.new(MkVisibilityChooser, {
-				source: this.$refs.visibilityButton,
-				currentVisibility: this.visibility
-			});
-			w.$once('chosen', v => {
-				this.applyVisibility(v);
-			});
-		},
-
-		applyVisibility(v :string) {
-			const m = v.match(/^local-(.+)/);
-			if (m) {
-				this.localOnly = true;
-				this.visibility = m[1];
-			} else {
-				this.localOnly = false;
-				this.visibility = v;
-			}
-		},
-
-		addVisibleUser() {
-			this.$root.dialog({
-				title: this.$t('enter-username'),
-				user: true
-			}).then(({ canceled, result: user }) => {
-				if (canceled) return;
-				this.visibleUsers.push(user);
-			});
-		},
-
-		removeVisibleUser(user) {
-			this.visibleUsers = erase(user, this.visibleUsers);
-		},
-
-		async emoji() {
-			const Picker = await import('./emoji-picker-dialog.vue').then(m => m.default);
-			const button = this.$refs.emoji;
-			const rect = button.getBoundingClientRect();
-			const vm = this.$root.new(Picker, {
-				x: button.offsetWidth + rect.left + window.pageXOffset,
-				y: rect.top + window.pageYOffset
-			});
-			vm.$once('chosen', emoji => {
-				insertTextAtCursor(this.$refs.text, emoji);
-			});
-		},
-
-		post() {
-			this.posting = true;
-
-			this.$root.api('notes/create', {
-				text: this.text == '' ? undefined : this.text,
-				fileIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined,
-				replyId: this.reply ? this.reply.id : undefined,
-				renoteId: this.renote ? this.renote.id : undefined,
-				poll: this.poll ? (this.$refs.poll as any).get() : undefined,
-				cw: this.useCw ? this.cw || '' : undefined,
-				visibility: this.visibility,
-				visibleUserIds: this.visibility == 'specified' ? this.visibleUsers.map(u => u.id) : undefined,
-				localOnly: this.localOnly,
-				geo: this.geo ? {
-					coordinates: [this.geo.longitude, this.geo.latitude],
-					altitude: this.geo.altitude,
-					accuracy: this.geo.accuracy,
-					altitudeAccuracy: this.geo.altitudeAccuracy,
-					heading: isNaN(this.geo.heading) ? null : this.geo.heading,
-					speed: this.geo.speed,
-				} : null
-			}).then(data => {
-				this.clear();
-				this.deleteDraft();
-				this.$emit('posted');
-				this.$notify(this.renote
-					? this.$t('reposted')
-					: this.reply
-						? this.$t('replied')
-						: this.$t('posted'));
-			}).catch(err => {
-				this.$notify(this.renote
-					? this.$t('renote-failed')
-					: this.reply
-						? this.$t('reply-failed')
-						: this.$t('note-failed'));
-			}).then(() => {
-				this.posting = false;
-			});
-
-			if (this.text && this.text != '') {
-				const hashtags = parse(this.text).filter(x => x.node.type === 'hashtag').map(x => x.node.props.hashtag);
-				const history = JSON.parse(localStorage.getItem('hashtags') || '[]') as string[];
-				localStorage.setItem('hashtags', JSON.stringify(unique(hashtags.concat(history))));
-			}
-		},
-
-		saveDraft() {
-			if (this.instant) return;
-
-			const data = JSON.parse(localStorage.getItem('drafts') || '{}');
-
-			data[this.draftId] = {
-				updatedAt: new Date(),
-				data: {
-					text: this.text,
-					files: this.files,
-					poll: this.poll && this.$refs.poll ? (this.$refs.poll as any).get() : undefined
-				}
-			}
-
-			localStorage.setItem('drafts', JSON.stringify(data));
-		},
-
-		deleteDraft() {
-			const data = JSON.parse(localStorage.getItem('drafts') || '{}');
-
-			delete data[this.draftId];
-
-			localStorage.setItem('drafts', JSON.stringify(data));
-		},
-
-		kao() {
-			this.text += getFace();
-		},
-	}
+		}),
+	],
 });
 </script>
 
diff --git a/src/client/app/mobile/views/components/post-form.vue b/src/client/app/mobile/views/components/post-form.vue
index 85246036a..495fa0cf2 100644
--- a/src/client/app/mobile/views/components/post-form.vue
+++ b/src/client/app/mobile/views/components/post-form.vue
@@ -1,6 +1,11 @@
 <template>
 <div class="gafaadew">
-	<div class="form">
+	<div class="form"
+		@dragover.stop="onDragover"
+		@dragenter="onDragenter"
+		@dragleave="onDragleave"
+		@drop.stop="onDrop"
+	>
 		<header>
 			<button class="cancel" @click="cancel"><fa icon="times"/></button>
 			<div>
@@ -17,10 +22,11 @@
 					<mk-user-name :user="u"/>
 					<a @click="removeVisibleUser(u)">[x]</a>
 				</span>
-				<a @click="addVisibleUser">+{{ $t('add-visible-user') }}</a>
+				<a @click="addVisibleUser">+{{ $t('@.post-form.add-visible-user') }}</a>
 			</div>
-			<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('annotations')" v-autocomplete="{ model: 'cw' }">
-			<textarea v-model="text" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }"></textarea>
+			<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }">
+			<textarea v-model="text" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }" @paste="onPaste"></textarea>
+			<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div>
 			<x-post-form-attaches class="attaches" :files="files"/>
 			<x-poll-editor v-if="poll" ref="poll" @destroyed="poll = false" @updated="onPollUpdate()"/>
 			<mk-uploader ref="uploader" @uploaded="attachMedia" @change="onChangeUploadings"/>
@@ -50,337 +56,21 @@
 <script lang="ts">
 import Vue from 'vue';
 import i18n from '../../../i18n';
-import insertTextAtCursor from 'insert-text-at-cursor';
-import MkVisibilityChooser from '../../../common/views/components/visibility-chooser.vue';
-import getFace from '../../../common/scripts/get-face';
-import { parse } from '../../../../../mfm/parse';
-import { host } from '../../../config';
-import { erase, unique } from '../../../../../prelude/array';
-import { length } from 'stringz';
-import { toASCII } from 'punycode';
-import extractMentions from '../../../../../misc/extract-mentions';
+import form from '../../../common/scripts/post-form';
 
 export default Vue.extend({
-	i18n: i18n('mobile/views/components/post-form.vue'),
-	components: {
-		XPostFormAttaches: () => import('../../../common/views/components/post-form-attaches.vue').then(m => m.default),
-		XPollEditor: () => import('../../../common/views/components/poll-editor.vue').then(m => m.default)
-	},
+	i18n: i18n(),
 
-	props: {
-		reply: {
-			type: Object,
-			required: false
-		},
-		renote: {
-			type: Object,
-			required: false
-		},
-		mention: {
-			type: Object,
-			required: false
-		},
-		initialText: {
-			type: String,
-			required: false
-		},
-		instant: {
-			type: Boolean,
-			required: false,
-			default: false
-		}
-	},
-
-	data() {
-		return {
-			posting: false,
-			text: '',
-			uploadings: [],
-			files: [],
-			poll: false,
-			pollChoices: [],
-			pollMultiple: false,
-			geo: null,
-			visibility: 'public',
-			visibleUsers: [],
-			localOnly: false,
-			useCw: false,
-			cw: null,
-			recentHashtags: JSON.parse(localStorage.getItem('hashtags') || '[]'),
-			maxNoteTextLength: 1000
-		};
-	},
-
-	created() {
-		this.$root.getMeta().then(meta => {
-			this.maxNoteTextLength = meta.maxNoteTextLength;
-		});
-	},
-
-	computed: {
-		draftId(): string {
-			return this.renote
-				? `renote:${this.renote.id}`
-				: this.reply
-					? `reply:${this.reply.id}`
-					: 'note';
-		},
-
-		placeholder(): string {
-			const xs = [
-				this.$t('@.note-placeholders.a'),
-				this.$t('@.note-placeholders.b'),
-				this.$t('@.note-placeholders.c'),
-				this.$t('@.note-placeholders.d'),
-				this.$t('@.note-placeholders.e'),
-				this.$t('@.note-placeholders.f')
-			];
-			const x = xs[Math.floor(Math.random() * xs.length)];
-
-			return this.renote
-				? this.$t('quote-placeholder')
-				: this.reply
-					? this.$t('reply-placeholder')
-					: x;
-		},
-
-		submitText(): string {
-			return this.renote
-				? this.$t('renote')
-				: this.reply
-					? this.$t('reply')
-					: this.$t('submit');
-		},
-
-		canPost(): boolean {
-			return !this.posting &&
-				(1 <= this.text.length || 1 <= this.files.length || this.poll || this.renote) &&
-				(this.text.trim().length <= this.maxNoteTextLength) &&
-				(!this.poll || this.pollChoices.length >= 2);
-		}
-	},
-
-	mounted() {
-		if (this.initialText) {
-			this.text = this.initialText;
-		}
-
-		if (this.reply && this.reply.user.host != null) {
-			this.text = `@${this.reply.user.username}@${toASCII(this.reply.user.host)} `;
-		}
-
-		if (this.mention) {
-			this.text = this.mention.host ? `@${this.mention.username}@${toASCII(this.mention.host)}` : `@${this.mention.username}`;
-			this.text += ' ';
-		}
-
-		if (this.reply && this.reply.text != null) {
-			const ast = parse(this.reply.text);
-
-			for (const x of extractMentions(ast)) {
-				const mention = x.host ? `@${x.username}@${toASCII(x.host)}` : `@${x.username}`;
-
-				// 自分は除外
-				if (this.$store.state.i.username == x.username && x.host == null) continue;
-				if (this.$store.state.i.username == x.username && x.host == host) continue;
-
-				// 重複は除外
-				if (this.text.indexOf(`${mention} `) != -1) continue;
-
-				this.text += `${mention} `;
-			}
-		}
-
-		// デフォルト公開範囲
-		this.applyVisibility(this.$store.state.settings.rememberNoteVisibility ? (this.$store.state.device.visibility || this.$store.state.settings.defaultNoteVisibility) : this.$store.state.settings.defaultNoteVisibility);
-
-		// 公開以外へのリプライ時は元の公開範囲を引き継ぐ
-		if (this.reply && ['home', 'followers', 'specified'].includes(this.reply.visibility)) {
-			this.visibility = this.reply.visibility;
-		}
-
-		if (this.reply) {
-			this.$root.api('users/show', { userId: this.reply.userId }).then(user => {
-				this.visibleUsers.push(user);
-			});
-		}
-
-		// keep cw when reply
-		if (this.$store.state.settings.keepCw && this.reply && this.reply.cw) {
-			this.useCw = true;
-			this.cw = this.reply.cw;
-		}
-
-		this.focus();
-
-		this.$nextTick(() => {
-			this.focus();
-		});
-	},
+	mixins: [
+		form({
+			mobile: true
+		}),
+	],
 
 	methods: {
-		trimmedLength(text: string) {
-			return length(text.trim());
-		},
-
-		addTag(tag: string) {
-			insertTextAtCursor(this.$refs.text, ` #${tag} `);
-		},
-
-		focus() {
-			(this.$refs.text as any).focus();
-		},
-
-		addVisibleUser() {
-			this.$root.dialog({
-				title: this.$t('enter-username'),
-				user: true
-			}).then(({ canceled, result: user }) => {
-				if (canceled) return;
-				this.visibleUsers.push(user);
-			});
-		},
-
-		chooseFile() {
-			(this.$refs.file as any).click();
-		},
-
-		chooseFileFromDrive() {
-			this.$chooseDriveFile({
-				multiple: true
-			}).then(files => {
-				for (const x of files) this.attachMedia(x);
-			});
-		},
-
-		attachMedia(driveFile) {
-			this.files.push(driveFile);
-			this.$emit('change-attached-files', this.files);
-		},
-
-		detachMedia(id) {
-			this.files = this.files.filter(x => x.id != id);
-			this.$emit('change-attached-files', this.files);
-		},
-
-		onChangeFile() {
-			for (const x of Array.from((this.$refs.file as any).files)) this.upload(x);
-		},
-
-		onPollUpdate() {
-			const got = this.$refs.poll.get();
-			this.pollChoices = got.choices;
-			this.pollMultiple = got.multiple;
-		},
-
-		upload(file) {
-			(this.$refs.uploader as any).upload(file);
-		},
-
-		onChangeUploadings(uploads) {
-			this.$emit('change-uploadings', uploads);
-		},
-
-		setGeo() {
-			if (navigator.geolocation == null) {
-				this.$root.dialog({
-					type: 'warning',
-					text: this.$t('geolocation-alert')
-				});
-				return;
-			}
-
-			navigator.geolocation.getCurrentPosition(pos => {
-				this.geo = pos.coords;
-			}, err => {
-				this.$root.dialog({
-					type: 'error',
-					title: this.$t('error'),
-					text: err.message
-				});
-			}, {
-					enableHighAccuracy: true
-				});
-		},
-
-		removeGeo() {
-			this.geo = null;
-		},
-
-		setVisibility() {
-			const w = this.$root.new(MkVisibilityChooser, {
-				source: this.$refs.visibilityButton,
-				currentVisibility: this.visibility
-			});
-			w.$once('chosen', v => {
-				this.applyVisibility(v);
-			});
-		},
-
-		applyVisibility(v :string) {
-			const m = v.match(/^local-(.+)/);
-			if (m) {
-				this.localOnly = true;
-				this.visibility = m[1];
-			} else {
-				this.localOnly = false;
-				this.visibility = v;
-			}
-		},
-
-		removeVisibleUser(user) {
-			this.visibleUsers = erase(user, this.visibleUsers);
-		},
-
-		clear() {
-			this.text = '';
-			this.files = [];
-			this.poll = false;
-			this.$emit('change-attached-files');
-		},
-
-		post() {
-			this.posting = true;
-			const viaMobile = !this.$store.state.settings.disableViaMobile;
-			this.$root.api('notes/create', {
-				text: this.text == '' ? undefined : this.text,
-				fileIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined,
-				replyId: this.reply ? this.reply.id : undefined,
-				renoteId: this.renote ? this.renote.id : undefined,
-				poll: this.poll ? (this.$refs.poll as any).get() : undefined,
-				cw: this.useCw ? this.cw || '' : undefined,
-				geo: this.geo ? {
-					coordinates: [this.geo.longitude, this.geo.latitude],
-					altitude: this.geo.altitude,
-					accuracy: this.geo.accuracy,
-					altitudeAccuracy: this.geo.altitudeAccuracy,
-					heading: isNaN(this.geo.heading) ? null : this.geo.heading,
-					speed: this.geo.speed,
-				} : null,
-				visibility: this.visibility,
-				visibleUserIds: this.visibility == 'specified' ? this.visibleUsers.map(u => u.id) : undefined,
-				localOnly: this.localOnly,
-				viaMobile: viaMobile
-			}).then(data => {
-				this.$emit('posted');
-			}).catch(err => {
-				this.posting = false;
-			});
-
-			if (this.text && this.text != '') {
-				const hashtags = parse(this.text).filter(x => x.node.type === 'hashtag').map(x => x.node.props.hashtag);
-				const history = JSON.parse(localStorage.getItem('hashtags') || '[]') as string[];
-				localStorage.setItem('hashtags', JSON.stringify(unique(hashtags.concat(history))));
-			}
-		},
-
 		cancel() {
 			this.$emit('cancel');
 		},
-
-		kao() {
-			this.text += getFace();
-		}
 	}
 });
 </script>
diff --git a/src/daemons/queue-stats.ts b/src/daemons/queue-stats.ts
index f9ba90a0b..e560354c7 100644
--- a/src/daemons/queue-stats.ts
+++ b/src/daemons/queue-stats.ts
@@ -1,6 +1,6 @@
 import * as Deque from 'double-ended-queue';
 import Xev from 'xev';
-import { deliverQueue, inboxQueue } from '../queue';
+import { deliverQueue, inboxQueue, dbQueue, objectStorageQueue } from '../queue';
 
 const ev = new Xev();
 
@@ -18,6 +18,8 @@ export default function() {
 
 	let activeDeliverJobs = 0;
 	let activeInboxJobs = 0;
+	let activeDbJobs = 0;
+	let activeObjectStorageJobs = 0;
 
 	deliverQueue.on('global:active', () => {
 		activeDeliverJobs++;
@@ -27,9 +29,19 @@ export default function() {
 		activeInboxJobs++;
 	});
 
+	dbQueue.on('global:active', () => {
+		activeDbJobs++;
+	});
+
+	objectStorageQueue.on('global:active', () => {
+		activeObjectStorageJobs++;
+	});
+
 	async function tick() {
 		const deliverJobCounts = await deliverQueue.getJobCounts();
 		const inboxJobCounts = await inboxQueue.getJobCounts();
+		const dbJobCounts = await dbQueue.getJobCounts();
+		const objectStorageJobCounts = await objectStorageQueue.getJobCounts();
 
 		const stats = {
 			deliver: {
@@ -43,7 +55,19 @@ export default function() {
 				active: inboxJobCounts.active,
 				waiting: inboxJobCounts.waiting,
 				delayed: inboxJobCounts.delayed
-			}
+			},
+			db: {
+				activeSincePrevTick: activeDbJobs,
+				active: dbJobCounts.active,
+				waiting: dbJobCounts.waiting,
+				delayed: dbJobCounts.delayed
+			},
+			objectStorage: {
+				activeSincePrevTick: activeObjectStorageJobs,
+				active: objectStorageJobCounts.active,
+				waiting: objectStorageJobCounts.waiting,
+				delayed: objectStorageJobCounts.delayed
+			},
 		};
 
 		ev.emit('queueStats', stats);
@@ -53,6 +77,8 @@ export default function() {
 
 		activeDeliverJobs = 0;
 		activeInboxJobs = 0;
+		activeDbJobs = 0;
+		activeObjectStorageJobs = 0;
 	}
 
 	tick();
diff --git a/src/models/repositories/user.ts b/src/models/repositories/user.ts
index f81fa6bc7..d3cd75b17 100644
--- a/src/models/repositories/user.ts
+++ b/src/models/repositories/user.ts
@@ -176,6 +176,7 @@ export class UserRepository extends Repository<User> {
 				autoWatch: profile!.autoWatch,
 				alwaysMarkNsfw: profile!.alwaysMarkNsfw,
 				carefulBot: profile!.carefulBot,
+				autoAcceptFollowed: profile!.autoAcceptFollowed,
 				hasUnreadMessagingMessage: this.getHasUnreadMessagingMessage(user.id),
 				hasUnreadNotification: Notifications.count({
 					where: {
diff --git a/src/queue/index.ts b/src/queue/index.ts
index a010004f1..70233d831 100644
--- a/src/queue/index.ts
+++ b/src/queue/index.ts
@@ -8,6 +8,7 @@ import { program } from '../argv';
 import processDeliver from './processors/deliver';
 import processInbox from './processors/inbox';
 import processDb from './processors/db';
+import procesObjectStorage from './processors/object-storage';
 import { queueLogger } from './logger';
 import { DriveFile } from '../models/entities/drive-file';
 
@@ -34,9 +35,12 @@ function renderError(e: Error): any {
 export const deliverQueue = initializeQueue('deliver');
 export const inboxQueue = initializeQueue('inbox');
 export const dbQueue = initializeQueue('db');
+export const objectStorageQueue = initializeQueue('objectStorage');
 
 const deliverLogger = queueLogger.createSubLogger('deliver');
 const inboxLogger = queueLogger.createSubLogger('inbox');
+const dbLogger = queueLogger.createSubLogger('db');
+const objectStorageLogger = queueLogger.createSubLogger('objectStorage');
 
 deliverQueue
 	.on('waiting', (jobId) => deliverLogger.debug(`waiting id=${jobId}`))
@@ -54,6 +58,22 @@ inboxQueue
 	.on('error', (job: any, err: Error) => inboxLogger.error(`error ${err}`, { job, e: renderError(err) }))
 	.on('stalled', (job) => inboxLogger.warn(`stalled id=${job.id} activity=${job.data.activity ? job.data.activity.id : 'none'}`));
 
+dbQueue
+	.on('waiting', (jobId) => dbLogger.debug(`waiting id=${jobId}`))
+	.on('active', (job) => dbLogger.debug(`active id=${job.id}`))
+	.on('completed', (job, result) => dbLogger.debug(`completed(${result}) id=${job.id}`))
+	.on('failed', (job, err) => dbLogger.warn(`failed(${err}) id=${job.id}`, { job, e: renderError(err) }))
+	.on('error', (job: any, err: Error) => dbLogger.error(`error ${err}`, { job, e: renderError(err) }))
+	.on('stalled', (job) => dbLogger.warn(`stalled id=${job.id}`));
+
+objectStorageQueue
+	.on('waiting', (jobId) => objectStorageLogger.debug(`waiting id=${jobId}`))
+	.on('active', (job) => objectStorageLogger.debug(`active id=${job.id}`))
+	.on('completed', (job, result) => objectStorageLogger.debug(`completed(${result}) id=${job.id}`))
+	.on('failed', (job, err) => objectStorageLogger.warn(`failed(${err}) id=${job.id}`, { job, e: renderError(err) }))
+	.on('error', (job: any, err: Error) => objectStorageLogger.error(`error ${err}`, { job, e: renderError(err) }))
+	.on('stalled', (job) => objectStorageLogger.warn(`stalled id=${job.id}`));
+
 export function deliver(user: ILocalUser, content: any, to: any) {
 	if (content == null) return null;
 
@@ -165,11 +185,21 @@ export function createImportUserListsJob(user: ILocalUser, fileId: DriveFile['id
 	});
 }
 
+export function createDeleteObjectStorageFileJob(key: string) {
+	return objectStorageQueue.add('deleteFile', {
+		key: key
+	}, {
+		removeOnComplete: true,
+		removeOnFail: true
+	});
+}
+
 export default function() {
 	if (!program.onlyServer) {
 		deliverQueue.process(128, processDeliver);
 		inboxQueue.process(128, processInbox);
 		processDb(dbQueue);
+		procesObjectStorage(objectStorageQueue);
 	}
 }
 
diff --git a/src/queue/processors/db/delete-drive-files.ts b/src/queue/processors/db/delete-drive-files.ts
index 4e4eab86b..5ecee9139 100644
--- a/src/queue/processors/db/delete-drive-files.ts
+++ b/src/queue/processors/db/delete-drive-files.ts
@@ -1,7 +1,7 @@
 import * as Bull from 'bull';
 
 import { queueLogger } from '../../logger';
-import deleteFile from '../../../services/drive/delete-file';
+import { deleteFile } from '../../../services/drive/delete-file';
 import { Users, DriveFiles } from '../../../models';
 import { MoreThan } from 'typeorm';
 
diff --git a/src/queue/processors/object-storage/delete-file.ts b/src/queue/processors/object-storage/delete-file.ts
new file mode 100644
index 000000000..8e6b5f959
--- /dev/null
+++ b/src/queue/processors/object-storage/delete-file.ts
@@ -0,0 +1,22 @@
+import * as Bull from 'bull';
+import * as Minio from 'minio';
+import { fetchMeta } from '../../../misc/fetch-meta';
+
+export default async (job: Bull.Job) => {
+	const meta = await fetchMeta();
+
+	const minio = new Minio.Client({
+		endPoint: meta.objectStorageEndpoint!,
+		region: meta.objectStorageRegion ? meta.objectStorageRegion : undefined,
+		port: meta.objectStoragePort ? meta.objectStoragePort : undefined,
+		useSSL: meta.objectStorageUseSSL,
+		accessKey: meta.objectStorageAccessKey!,
+		secretKey: meta.objectStorageSecretKey!,
+	});
+
+	const key: string = job.data.key;
+
+	await minio.removeObject(meta.objectStorageBucket!, key);
+
+	return 'Success';
+};
diff --git a/src/queue/processors/object-storage/index.ts b/src/queue/processors/object-storage/index.ts
new file mode 100644
index 000000000..f2fc08f1a
--- /dev/null
+++ b/src/queue/processors/object-storage/index.ts
@@ -0,0 +1,12 @@
+import * as Bull from 'bull';
+import deleteFile from './delete-file';
+
+const jobs = {
+	deleteFile,
+} as any;
+
+export default function(q: Bull.Queue) {
+	for (const [k, v] of Object.entries(jobs)) {
+		q.process(k, v as any);
+	}
+}
diff --git a/src/server/api/endpoints/admin/delete-all-files-of-a-user.ts b/src/server/api/endpoints/admin/delete-all-files-of-a-user.ts
index 84e9c363e..276d1f37b 100644
--- a/src/server/api/endpoints/admin/delete-all-files-of-a-user.ts
+++ b/src/server/api/endpoints/admin/delete-all-files-of-a-user.ts
@@ -1,6 +1,6 @@
 import $ from 'cafy';
 import define from '../../define';
-import del from '../../../../services/drive/delete-file';
+import { deleteFile } from '../../../../services/drive/delete-file';
 import { DriveFiles } from '../../../../models';
 import { ID } from '../../../../misc/cafy-id';
 
@@ -27,6 +27,6 @@ export default define(meta, async (ps, me) => {
 	});
 
 	for (const file of files) {
-		del(file);
+		deleteFile(file);
 	}
 });
diff --git a/src/server/api/endpoints/admin/drive/clean-remote-files.ts b/src/server/api/endpoints/admin/drive/clean-remote-files.ts
new file mode 100644
index 000000000..a861052bb
--- /dev/null
+++ b/src/server/api/endpoints/admin/drive/clean-remote-files.ts
@@ -0,0 +1,21 @@
+import { Not, IsNull } from 'typeorm';
+import define from '../../../define';
+import { deleteFile } from '../../../../../services/drive/delete-file';
+import { DriveFiles } from '../../../../../models';
+
+export const meta = {
+	tags: ['admin'],
+
+	requireCredential: true,
+	requireModerator: true,
+};
+
+export default define(meta, async (ps, me) => {
+	const files = await DriveFiles.find({
+		userHost: Not(IsNull())
+	});
+
+	for (const file of files) {
+		deleteFile(file, true);
+	}
+});
diff --git a/src/server/api/endpoints/admin/drive/cleanup.ts b/src/server/api/endpoints/admin/drive/cleanup.ts
new file mode 100644
index 000000000..272416dee
--- /dev/null
+++ b/src/server/api/endpoints/admin/drive/cleanup.ts
@@ -0,0 +1,21 @@
+import { IsNull } from 'typeorm';
+import define from '../../../define';
+import { deleteFile } from '../../../../../services/drive/delete-file';
+import { DriveFiles } from '../../../../../models';
+
+export const meta = {
+	tags: ['admin'],
+
+	requireCredential: true,
+	requireModerator: true,
+};
+
+export default define(meta, async (ps, me) => {
+	const files = await DriveFiles.find({
+		userId: IsNull()
+	});
+
+	for (const file of files) {
+		deleteFile(file);
+	}
+});
diff --git a/src/server/api/endpoints/admin/federation/delete-all-files.ts b/src/server/api/endpoints/admin/federation/delete-all-files.ts
index befb36226..24ad9ce80 100644
--- a/src/server/api/endpoints/admin/federation/delete-all-files.ts
+++ b/src/server/api/endpoints/admin/federation/delete-all-files.ts
@@ -1,6 +1,6 @@
 import $ from 'cafy';
 import define from '../../../define';
-import del from '../../../../../services/drive/delete-file';
+import { deleteFile } from '../../../../../services/drive/delete-file';
 import { DriveFiles } from '../../../../../models';
 
 export const meta = {
@@ -22,6 +22,6 @@ export default define(meta, async (ps, me) => {
 	});
 
 	for (const file of files) {
-		del(file);
+		deleteFile(file);
 	}
 });
diff --git a/src/server/api/endpoints/admin/queue/stats.ts b/src/server/api/endpoints/admin/queue/stats.ts
index baeecba30..83684685f 100644
--- a/src/server/api/endpoints/admin/queue/stats.ts
+++ b/src/server/api/endpoints/admin/queue/stats.ts
@@ -1,5 +1,5 @@
 import define from '../../../define';
-import { deliverQueue, inboxQueue } from '../../../../../queue';
+import { deliverQueue, inboxQueue, dbQueue, objectStorageQueue } from '../../../../../queue';
 
 export const meta = {
 	tags: ['admin'],
@@ -13,9 +13,13 @@ export const meta = {
 export default define(meta, async (ps) => {
 	const deliverJobCounts = await deliverQueue.getJobCounts();
 	const inboxJobCounts = await inboxQueue.getJobCounts();
+	const dbJobCounts = await dbQueue.getJobCounts();
+	const objectStorageJobCounts = await objectStorageQueue.getJobCounts();
 
 	return {
 		deliver: deliverJobCounts,
-		inbox: inboxJobCounts
+		inbox: inboxJobCounts,
+		db: dbJobCounts,
+		objectStorage: objectStorageJobCounts,
 	};
 });
diff --git a/src/server/api/endpoints/drive/files/delete.ts b/src/server/api/endpoints/drive/files/delete.ts
index d8cc5ec0a..d6a20f352 100644
--- a/src/server/api/endpoints/drive/files/delete.ts
+++ b/src/server/api/endpoints/drive/files/delete.ts
@@ -1,6 +1,6 @@
 import $ from 'cafy';
 import { ID } from '../../../../../misc/cafy-id';
-import del from '../../../../../services/drive/delete-file';
+import { deleteFile } from '../../../../../services/drive/delete-file';
 import { publishDriveStream } from '../../../../../services/stream';
 import define from '../../../define';
 import { ApiError } from '../../../error';
@@ -57,7 +57,7 @@ export default define(meta, async (ps, user) => {
 	}
 
 	// Delete
-	await del(file);
+	await deleteFile(file);
 
 	// Publish fileDeleted event
 	publishDriveStream(user.id, 'fileDeleted', file.id);
diff --git a/src/services/drive/add-file.ts b/src/services/drive/add-file.ts
index eb0b0abaa..d21c67d18 100644
--- a/src/services/drive/add-file.ts
+++ b/src/services/drive/add-file.ts
@@ -7,7 +7,7 @@ import * as uuid from 'uuid';
 import * as sharp from 'sharp';
 
 import { publishMainStream, publishDriveStream } from '../stream';
-import delFile from './delete-file';
+import { deleteFile } from './delete-file';
 import { fetchMeta } from '../../misc/fetch-meta';
 import { GenerateVideoThumbnail } from './generate-video-thumbnail';
 import { driveLogger } from './logger';
@@ -233,7 +233,7 @@ async function deleteOldFile(user: IRemoteUser) {
 	const oldFile = await q.getOne();
 
 	if (oldFile) {
-		delFile(oldFile, true);
+		deleteFile(oldFile, true);
 	}
 }
 
diff --git a/src/services/drive/delete-file.ts b/src/services/drive/delete-file.ts
index b429ca0db..258c0853f 100644
--- a/src/services/drive/delete-file.ts
+++ b/src/services/drive/delete-file.ts
@@ -1,11 +1,10 @@
-import * as Minio from 'minio';
 import { DriveFile } from '../../models/entities/drive-file';
 import { InternalStorage } from './internal-storage';
 import { DriveFiles, Instances, Notes } from '../../models';
 import { driveChart, perUserDriveChart, instanceChart } from '../chart';
-import { fetchMeta } from '../../misc/fetch-meta';
+import { createDeleteObjectStorageFileJob } from '../../queue';
 
-export default async function(file: DriveFile, isExpired = false) {
+export async function deleteFile(file: DriveFile, isExpired = false) {
 	if (file.storedInternal) {
 		InternalStorage.del(file.accessKey!);
 
@@ -17,25 +16,14 @@ export default async function(file: DriveFile, isExpired = false) {
 			InternalStorage.del(file.webpublicAccessKey!);
 		}
 	} else if (!file.isLink) {
-		const meta = await fetchMeta();
-
-		const minio = new Minio.Client({
-			endPoint: meta.objectStorageEndpoint!,
-			region: meta.objectStorageRegion ? meta.objectStorageRegion : undefined,
-			port: meta.objectStoragePort ? meta.objectStoragePort : undefined,
-			useSSL: meta.objectStorageUseSSL,
-			accessKey: meta.objectStorageAccessKey!,
-			secretKey: meta.objectStorageSecretKey!,
-		});
-
-		await minio.removeObject(meta.objectStorageBucket!, file.accessKey!);
+		createDeleteObjectStorageFileJob(file.accessKey!);
 
 		if (file.thumbnailUrl) {
-			await minio.removeObject(meta.objectStorageBucket!, file.thumbnailAccessKey!);
+			createDeleteObjectStorageFileJob(file.thumbnailAccessKey!);
 		}
 
 		if (file.webpublicUrl) {
-			await minio.removeObject(meta.objectStorageBucket!, file.webpublicAccessKey!);
+			createDeleteObjectStorageFileJob(file.webpublicAccessKey!);
 		}
 	}
 
@@ -44,8 +32,8 @@ export default async function(file: DriveFile, isExpired = false) {
 		DriveFiles.update(file.id, {
 			isLink: true,
 			url: file.uri,
-			thumbnailUrl: null,
-			webpublicUrl: null
+			thumbnailUrl: file.uri,
+			webpublicUrl: file.uri
 		});
 	} else {
 		DriveFiles.delete(file.id);
diff --git a/src/tools/clean-remote-files.ts b/src/tools/clean-remote-files.ts
deleted file mode 100644
index 633a6fc04..000000000
--- a/src/tools/clean-remote-files.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import * as promiseLimit from 'promise-limit';
-import del from '../services/drive/delete-file';
-import { DriveFiles } from '../models';
-import { Not, IsNull } from 'typeorm';
-import { DriveFile } from '../models/entities/drive-file';
-import { ensure } from '../prelude/ensure';
-
-const limit = promiseLimit(16);
-
-DriveFiles.find({
-	userHost: Not(IsNull())
-}).then(async files => {
-	console.log(`there is ${files.length} files`);
-
-	await Promise.all(files.map(file => limit(() => job(file))));
-
-	console.log('ALL DONE');
-});
-
-async function job(file: DriveFile): Promise<any> {
-	file = await DriveFiles.findOne(file.id).then(ensure);
-
-	await del(file, true);
-
-	console.log('done', file.id);
-}