Improve post form attaches; Fix #4673, Resolve #2327, Resolve #2145 [v11] (#4674)

* improve post form attaches

* Fix

* chain

* 右クリックでも反応するように

src/client/app/admin/views/drive.vue

@@ -38,7 +38,7 @@
 				<div class="kidvdlkg" v-for="file in files">
 					<div @click="file._open = !file._open">
 						<div>
-							<div class="thumbnail" :style="thumbnail(file)"></div>
+							<x-file-thumbnail class="thumbnail" :file="file" fit="contain" @click="showFileMenu(file)"/>
 						</div>
 						<div>
 							<header>
@@ -75,10 +75,15 @@ import Vue from 'vue';
 import i18n from '../../i18n';
 import { faCloud, faTerminal, faSearch } from '@fortawesome/free-solid-svg-icons';
 import { faTrashAlt, faEye, faEyeSlash } from '@fortawesome/free-regular-svg-icons';
+import XFileThumbnail from '../../common/views/components/drive-file-thumbnail.vue';
 
 export default Vue.extend({
 	i18n: i18n('admin/views/drive.vue'),
 
+	components: {
+		XFileThumbnail
+	},
+
 	data() {
 		return {
 			file: null,
@@ -151,13 +156,6 @@ export default Vue.extend({
 			});
 		},
 
-		thumbnail(file: any): any {
-			return {
-				'background-color': file.properties.avgColor || 'transparent',
-				'background-image': `url(${file.thumbnailUrl})`
-			};
-		},
-
 		async del(file: any) {
 			const process = async () => {
 				await this.$root.api('drive/files/delete', { fileId: file.id });
@@ -179,9 +177,9 @@ export default Vue.extend({
 			this.$root.api('drive/files/update', {
 				fileId: file.id,
 				isSensitive: !file.isSensitive
+			}).then(() => {
+				file.isSensitive = !file.isSensitive;
 			});
-
-			file.isSensitive = !file.isSensitive;
 		},
 
 		async show() {