Add folder, template, enableCreate, enableSelect options to the files interface (#9184)

app/src/interfaces/files/files.vue

@@ -90,7 +90,9 @@
 		<v-dialog v-if="!disabled" v-model="showUpload">
 			<v-card>
 				<v-card-title>{{ t('upload_file') }}</v-card-title>
-				<v-card-text><v-upload multiple from-url @input="onUpload" /></v-card-text>
+				<v-card-text>
+					<v-upload multiple from-url :folder="folder" @input="onUpload" />
+				</v-card-text>
 				<v-card-actions>
 					<v-button @click="showUpload = false">{{ t('done') }}</v-button>
 				</v-card-actions>
@@ -154,6 +156,10 @@ export default defineComponent({
 			type: Boolean,
 			default: true,
 		},
+		folder: {
+			type: String,
+			default: undefined,
+		},
 	},
 	emits: ['input'],
 	setup(props, { emit }) {

app/src/interfaces/files/index.ts

@@ -1,7 +1,7 @@
 import { defineInterface } from '@directus/shared/utils';
 import InterfaceFiles from './files.vue';
-// import Options from '../list-m2m/options.vue';
 import PreviewSVG from './preview.svg?raw';
+import { ExtensionsOptionsContext } from '@directus/shared/types';
 
 export default defineInterface({
 	id: 'files',
@@ -13,8 +13,59 @@ export default defineInterface({
 	types: ['alias'],
 	localTypes: ['files'],
 	group: 'relational',
-	// options: Options,
-	options: [],
+	options: ({ relations }: ExtensionsOptionsContext) => [
+		{
+			field: 'folder',
+			name: '$t:interfaces.system-folder.folder',
+			type: 'uuid',
+			meta: {
+				width: 'full',
+				interface: 'system-folder',
+				note: '$t:interfaces.system-folder.field_hint',
+			},
+			schema: {
+				default_value: undefined,
+			},
+		},
+		{
+			field: 'template',
+			name: '$t:display_template',
+			meta: {
+				interface: 'system-display-template',
+				options: {
+					collectionName: relations.m2o?.related_collection ?? null,
+				},
+			},
+		},
+		{
+			field: 'enableCreate',
+			name: '$t:creating_items',
+			schema: {
+				default_value: true,
+			},
+			meta: {
+				interface: 'boolean',
+				options: {
+					label: '$t:enable_create_button',
+				},
+				width: 'half',
+			},
+		},
+		{
+			field: 'enableSelect',
+			name: '$t:selecting_items',
+			schema: {
+				default_value: true,
+			},
+			meta: {
+				interface: 'boolean',
+				options: {
+					label: '$t:enable_select_button',
+				},
+				width: 'half',
+			},
+		},
+	],
 	recommendedDisplays: ['related-values'],
 	preview: PreviewSVG,
 });