system-field interface does not work with collection option

[hanneskuettner]

Describe the Bug

When trying to use the system-field interface (for creating options for an interface extension) the collection prop that is intended as an alternative to the collectionField to retrieve fields from that collection does not work as expected.

This is due to the form-field-interface component passing in the fields collection by default, overriding the possible value from field.meta.options.

directus/app/src/components/v-form/form-field-interface.vue

Lines 11 to 28 in f016e22

	<component
	:is="componentName"
	v-bind="(field.meta && field.meta.options) || {}"
	:autofocus="disabled !== true && autofocus"
	:disabled="disabled"
	:loading="loading"
	:value="modelValue === undefined ? field.schema?.default_value : modelValue"
	:width="(field.meta && field.meta.width) || 'full'"
	:type="field.type"
	:collection="field.collection"
	:field="field.field"
	:field-data="field"
	:primary-key="primaryKey"
	:length="field.schema && field.schema.max_length"
	:direction="direction"
	@input="$emit('update:modelValue', $event)"
	@set-field-value="$emit('setFieldValue', $event)"
	/>

The system-fields (plural) interface calls the prop collectionName and it works flawlessly.

To Reproduce

Create a interface extension with the following options

options: ({ field: { collection } }) => {
		return [
			{
				field: 'my_field',
				name: 'Blocks Field',
				meta: {
					interface: 'system-field',
					options: {
						collection
					},
					width: 'half',
				},
			},
		];
	}

Create a field with the interface an observe the following error:

Directus Version

v9.25.1

Hosting Strategy

Self-Hosted (Docker Image)