Finalize interface names (#5521)

* Rename button-links->presentation-links

* Rename checkboxes->select-multiple-checkbox

* Rename code->input-code

* Rename checkboxes files

* Rename color->select-color

* Rename divider->presentation-divider

* Rename dropdown-multiselect->select-multiple-dropdown

* Rename hash->input-hash

* Rename icon->select-icon

* Rename image->file-image

* Rename m2a-builder->list-m2a

* Rename many-to-many->list-m2m

* Rename many-to-one->select-dropdown-m2o

* Rename markdown->input-rich-text-md

* Rename notice->presentation-notice

* Rename one-to-many->list-o2m

* Rename radio-buttons->select-radio

* Rename repeater->list

* Rename text-input->input

* Rename textarea->input-multiline

* Rename toggle->boolean

* Rename tree-view->list-o2m-tree-view

* Rename wysiwyg->input-rich-text-html

* Use correct interfaces in system defaults

* Rename collection->system-collection

* Rename collections->system-collections

* Rename display-template->system-display-template

* Rename field->system-field

* Rename interface->system-interface

* Rename interface-options->system-interface-options

* Rename scope->interface-scope

* Rename tfa-setup->system-mfa-setup

* Fix oversights

* Remove old todo

* Some more tweaks

* Add migration, fix dropdown name in system use

* Merge numeric + input

* Replace dropdown->select-dropdown in app use

* Merge slug->input, user->select-dropdown-m2o

* Fix type issue

* Fix seeder field name

app/src/interfaces/_system/system-interface/index.ts

@@ -0,0 +1,13 @@
+import { defineInterface } from '@/interfaces/define';
+import InterfaceSystemInterface from './system-interface.vue';
+
+export default defineInterface({
+	id: 'system-interface',
+	name: '$t:interfaces.system-interface.interface',
+	description: '$t:interfaces.system-interface.description',
+	icon: 'box',
+	component: InterfaceSystemInterface,
+	types: ['string'],
+	system: true,
+	options: [],
+});

app/src/interfaces/_system/system-interface/system-interface.vue

@@ -0,0 +1,64 @@
+<template>
+	<v-notice v-if="selectedType === undefined">
+		{{ $t('select_field_type') }}
+	</v-notice>
+	<v-select
+		v-else
+		:items="items"
+		@input="$listeners.input"
+		:value="value"
+		:placeholder="$t('interfaces.system-interface.placeholder')"
+	/>
+</template>
+
+<script lang="ts">
+import { defineComponent, computed, inject, ref, watch } from '@vue/composition-api';
+import { getInterfaces } from '@/interfaces';
+import { InterfaceConfig } from '@/interfaces/types';
+
+export default defineComponent({
+	props: {
+		value: {
+			type: String,
+			default: null,
+		},
+		typeField: {
+			type: String,
+			default: null,
+		},
+	},
+	setup(props, { emit }) {
+		const { interfaces } = getInterfaces();
+
+		const values = inject('values', ref<Record<string, any>>({}));
+
+		const selectedType = computed(() => {
+			if (props.typeField === null || !values.value[props.typeField]) return;
+			return values.value[props.typeField];
+		});
+
+		watch(
+			() => values.value[props.typeField],
+			() => {
+				emit('input', null);
+			}
+		);
+
+		const items = computed(() => {
+			return interfaces.value
+				.filter((inter: InterfaceConfig) => inter.relational !== true && inter.system !== true)
+				.filter(
+					(inter: InterfaceConfig) => selectedType.value === undefined || inter.types.includes(selectedType.value)
+				)
+				.map((inter: InterfaceConfig) => {
+					return {
+						text: inter.name,
+						value: inter.id,
+					};
+				});
+		});
+
+		return { items, selectedType, values };
+	},
+});
+</script>