diff --git a/.changeset/tame-dolphins-begin.md b/.changeset/tame-dolphins-begin.md
new file mode 100644
index 0000000000000..f5fca630c4bad
--- /dev/null
+++ b/.changeset/tame-dolphins-begin.md
@@ -0,0 +1,5 @@
+---
+"@directus/app": patch
+---
+
+Switched to technical collection/field names in settings for clarity
diff --git a/app/src/components/v-field-list/v-field-list-item.vue b/app/src/components/v-field-list/v-field-list-item.vue
index 74316a5c81caf..9a397e17f04e1 100644
--- a/app/src/components/v-field-list/v-field-list-item.vue
+++ b/app/src/components/v-field-list/v-field-list-item.vue
@@ -3,11 +3,15 @@
v-if="field.children || supportedFunctions.length > 0"
:clickable="!field.disabled && (relationalFieldSelectable || !field.relatedCollection)"
:value="field.path"
+ :class="{ 'raw-field-names': rawFieldNames }"
@click="$emit('add', [field.key])"
>
-
+
@@ -24,7 +28,7 @@
@@ -50,13 +54,23 @@
:relational-field-selectable="relationalFieldSelectable"
:parent="field.field"
:allow-select-all="allowSelectAll"
+ :raw-field-names="rawFieldNames"
@add="$emit('add', $event)"
/>
-
+
-
+
@@ -86,6 +100,7 @@ interface Props {
relationalFieldSelectable?: boolean;
allowSelectAll?: boolean;
parent?: string | null;
+ rawFieldNames?: boolean;
}
const props = withDefaults(defineProps(), {
@@ -94,6 +109,7 @@ const props = withDefaults(defineProps(), {
relationalFieldSelectable: true,
allowSelectAll: false,
parent: null,
+ rawFieldNames: false,
});
const emit = defineEmits(['add']);
@@ -129,4 +145,8 @@ const addAll = () => {
--v-icon-color: var(--primary);
--v-list-item-color: var(--primary);
}
+
+.raw-field-names {
+ --v-list-item-content-font-family: var(--family-monospace);
+}
diff --git a/app/src/components/v-field-list/v-field-list.vue b/app/src/components/v-field-list/v-field-list.vue
index 9186fc2b03592..98ab8d48454a3 100644
--- a/app/src/components/v-field-list/v-field-list.vue
+++ b/app/src/components/v-field-list/v-field-list.vue
@@ -27,6 +27,7 @@
:include-functions="includeFunctions"
:relational-field-selectable="relationalFieldSelectable"
:allow-select-all="allowSelectAll"
+ :raw-field-names="rawFieldNames"
@add="$emit('add', $event)"
/>
@@ -49,6 +50,7 @@ interface Props {
includeRelations?: boolean;
relationalFieldSelectable?: boolean;
allowSelectAll?: boolean;
+ rawFieldNames?: boolean;
}
const props = withDefaults(defineProps(), {
@@ -58,6 +60,7 @@ const props = withDefaults(defineProps(), {
includeRelations: true,
relationalFieldSelectable: true,
allowSelectAll: false,
+ rawFieldNames: false,
});
const emit = defineEmits(['add']);
diff --git a/app/src/components/v-select/select-list-item-group.vue b/app/src/components/v-select/select-list-item-group.vue
index 8dc7391a34e0c..bfcdf8b423a18 100644
--- a/app/src/components/v-select/select-list-item-group.vue
+++ b/app/src/components/v-select/select-list-item-group.vue
@@ -27,6 +27,7 @@
{{ item.text }}
(), {
+ itemLabelFontFamily: 'var(--v-select-font-family)',
modelValue: null,
multiple: true,
allowOther: false,
@@ -58,3 +61,9 @@ const isActive = computed(() => {
}
});
+
+
diff --git a/app/src/components/v-select/v-select.vue b/app/src/components/v-select/v-select.vue
index d9956e1edfcf8..bcb1cc5e5c4bd 100644
--- a/app/src/components/v-select/v-select.vue
+++ b/app/src/components/v-select/v-select.vue
@@ -68,6 +68,7 @@
-