feat: ロールでアップロード可能なファイル種別を設定可能に (#16081)

* wip

* Update RoleService.ts

* wip

* Update RoleService.ts

* Update CHANGELOG.md

4 files changed, 51 insertions, 1 deletions

diff --git a/packages/frontend/src/components/MkUploaderDialog.vue b/packages/frontend/src/components/MkUploaderDialog.vue
index b171546854..fb27dcbf58 100644
--- a/packages/frontend/src/components/MkUploaderDialog.vue
+++ b/packages/frontend/src/components/MkUploaderDialog.vue
@@ -69,6 +69,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</MkSelect>
 
 			<div>{{ i18n.tsx._uploader.maxFileSizeIsX({ x: $i.policies.maxFileSizeMb + 'MB' }) }}</div>
+			<div>{{ i18n.ts._uploader.allowedTypes }}: {{ $i.policies.uploadableFileTypes.join(', ') }}</div>
 		</div>
 	</div>
 
@@ -281,7 +282,7 @@ function showMenu(ev: MouseEvent, item: typeof items.value[0]) {
 				if (item.abort != null) {
 					item.abort();
 				}
-			}
+			},
 		});
 	}
 
diff --git a/packages/frontend/src/pages/admin/roles.editor.vue b/packages/frontend/src/pages/admin/roles.editor.vue
index 2473d4e90d..5da969b835 100644
--- a/packages/frontend/src/pages/admin/roles.editor.vue
+++ b/packages/frontend/src/pages/admin/roles.editor.vue
@@ -406,6 +406,26 @@ SPDX-License-Identifier: AGPL-3.0-only
 				</div>
 			</MkFolder>
 
+			<MkFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])">
+				<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
+				<template #suffix>
+					<span v-if="role.policies.uploadableFileTypes.useDefault" :class="$style.useDefaultLabel">{{ i18n.ts._role.useBaseValue }}</span>
+					<span v-else>...</span>
+					<span :class="$style.priorityIndicator"><i :class="getPriorityIcon(role.policies.uploadableFileTypes)"></i></span>
+				</template>
+				<div class="_gaps">
+					<MkSwitch v-model="role.policies.uploadableFileTypes.useDefault" :readonly="readonly">
+						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
+					</MkSwitch>
+					<MkTextarea :modelValue="role.policies.uploadableFileTypes.value.join('\n')" :disabled="role.policies.uploadableFileTypes.useDefault" :readonly="readonly" @update:modelValue="role.policies.uploadableFileTypes.value = $event.split('\n')">
+						<template #caption>{{ i18n.ts._role._options.uploadableFileTypes_caption }}</template>
+					</MkTextarea>
+					<MkRange v-model="role.policies.uploadableFileTypes.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
+						<template #label>{{ i18n.ts._role.priority }}</template>
+					</MkRange>
+				</div>
+			</MkFolder>
+
 			<MkFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])">
 				<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
 				<template #suffix>
diff --git a/packages/frontend/src/pages/admin/roles.vue b/packages/frontend/src/pages/admin/roles.vue
index c7f47cef55..c70ae12851 100644
--- a/packages/frontend/src/pages/admin/roles.vue
+++ b/packages/frontend/src/pages/admin/roles.vue
@@ -146,6 +146,13 @@ SPDX-License-Identifier: AGPL-3.0-only
 						</MkInput>
 					</MkFolder>
 
+					<MkFolder v-if="matchQuery([i18n.ts._role._options.uploadableFileTypes, 'uploadableFileTypes'])">
+						<template #label>{{ i18n.ts._role._options.uploadableFileTypes }}</template>
+						<template #suffix>...</template>
+						<MkTextarea :modelValue="policies.uploadableFileTypes.join('\n')">
+						</MkTextarea>
+					</MkFolder>
+
 					<MkFolder v-if="matchQuery([i18n.ts._role._options.alwaysMarkNsfw, 'alwaysMarkNsfw'])">
 						<template #label>{{ i18n.ts._role._options.alwaysMarkNsfw }}</template>
 						<template #suffix>{{ policies.alwaysMarkNsfw ? i18n.ts.yes : i18n.ts.no }}</template>
@@ -312,6 +319,7 @@ import { definePage } from '@/page.js';
 import { instance, fetchInstance } from '@/instance.js';
 import MkFoldableSection from '@/components/MkFoldableSection.vue';
 import { useRouter } from '@/router.js';
+import MkTextarea from '@/components/MkTextarea.vue';
 
 const router = useRouter();
 const baseRoleQ = ref('');
diff --git a/packages/frontend/src/utility/drive.ts b/packages/frontend/src/utility/drive.ts
index 56d3f998cb..de473c9b11 100644
--- a/packages/frontend/src/utility/drive.ts
+++ b/packages/frontend/src/utility/drive.ts
@@ -39,6 +39,21 @@ export function uploadFile(file: File | Blob, options: {
 	const filePromise = new Promise<Misskey.entities.DriveFile>((resolve, reject) => {
 		if ($i == null) return reject();
 
+		const allowedMimeTypes = $i.policies.uploadableFileTypes;
+		const isAllowedMimeType = allowedMimeTypes.some(mimeType => {
+			if (mimeType === '*' || mimeType === '*/*') return true;
+			if (mimeType.endsWith('/*')) return file.type.startsWith(mimeType.slice(0, -1));
+			return file.type === mimeType;
+		});
+		if (!isAllowedMimeType) {
+			os.alert({
+				type: 'error',
+				title: i18n.ts.failedToUpload,
+				text: i18n.ts.cannotUploadBecauseUnallowedFileType,
+			});
+			return reject();
+		}
+
 		if ((file.size > instance.maxFileSize) || (file.size > ($i.policies.maxFileSizeMb * 1024 * 1024))) {
 			os.alert({
 				type: 'error',
@@ -75,6 +90,12 @@ export function uploadFile(file: File | Blob, options: {
 							title: i18n.ts.failedToUpload,
 							text: i18n.ts.cannotUploadBecauseNoFreeSpace,
 						});
+					} else if (res.error?.id === '4becd248-7f2c-48c4-a9f0-75edc4f9a1ea') {
+						os.alert({
+							type: 'error',
+							title: i18n.ts.failedToUpload,
+							text: i18n.ts.cannotUploadBecauseUnallowedFileType,
+						});
 					} else {
 						os.alert({
 							type: 'error',