インポート/エクスポート設定を復活

src/client/pages/settings/import-export.vue

@@ -9,10 +9,9 @@
 			<option value="mute">{{ $t('_exportOrImport.muteList') }}</option>
 			<option value="blocking">{{ $t('_exportOrImport.blockingList') }}</option>
 		</MkSelect>
-		<MkButton inline @click="doExport()"><Fa :icon="faDownload"/> {{ $t('export') }}</MkButton>
-		<MkButton inline @click="doImport()" :disabled="!['following', 'user-lists'].includes(exportTarget)"><Fa :icon="faUpload"/> {{ $t('import') }}</MkButton>
+		<MkButton inline primary @click="doExport"><Fa :icon="faDownload"/> {{ $t('export') }}</MkButton>
+		<MkButton inline primary @click="doImport" :disabled="!['following', 'user-lists'].includes(exportTarget)"><Fa :icon="faUpload"/> {{ $t('import') }}</MkButton>
 	</div>
-	<input ref="file" type="file" style="display: none;" @change="onChangeFile"/>
 </section>
 </template>
 
@@ -21,8 +20,8 @@ import { defineComponent } from 'vue';
 import { faDownload, faUpload, faBoxes } from '@fortawesome/free-solid-svg-icons';
 import MkButton from '@/components/ui/button.vue';
 import MkSelect from '@/components/ui/select.vue';
-import { apiUrl } from '@/config';
 import * as os from '@/os';
+import { selectFile } from '@/scripts/select-file';
 
 export default defineComponent({
 	components: {
@@ -59,29 +58,9 @@ export default defineComponent({
 			});
 		},
 
-		doImport() {
-			(this.$refs.file as any).click();
-		},
-
-		onChangeFile() {
-			const [file] = Array.from((this.$refs.file as any).files);
+		async doImport(e) {
+			const file = await selectFile(e.currentTarget || e.target);
 			
-			const data = new FormData();
-			data.append('file', file);
-			data.append('i', this.$store.state.i.token);
-
-			const promise = fetch(apiUrl + '/drive/files/create', {
-				method: 'POST',
-				body: data
-			})
-			.then(response => response.json())
-			.then(f => {
-				this.reqImport(f);
-			});
-			os.promiseDialog(promise);
-		},
-
-		reqImport(file) {
 			os.api(
 				this.exportTarget == 'following' ? 'i/import-following' :
 				this.exportTarget == 'user-lists' ? 'i/import-user-lists' :
@@ -98,7 +77,7 @@ export default defineComponent({
 					text: e.message
 				});
 			});
-		}
+		},
 	}
 });
 </script>