From e23526536ee52c89a7c883d07d5edfaf4ea2f71d Mon Sep 17 00:00:00 2001
From: rijkvanzanten <rijkvanzanten@me.com>
Date: Thu, 3 Sep 2020 16:36:13 -0400
Subject: [PATCH] Support recommended displays in field setup

---
 app/src/lang/en-US/index.json                               | 2 ++
 .../routes/data-model/field-detail/components/display.vue   | 2 +-
 .../routes/data-model/field-detail/components/interface.vue | 2 +-
 .../modules/settings/routes/data-model/fields/fields.vue    | 6 +++++-
 4 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/app/src/lang/en-US/index.json b/app/src/lang/en-US/index.json
index 8a904591d4..0b3e41df7e 100644
--- a/app/src/lang/en-US/index.json
+++ b/app/src/lang/en-US/index.json
@@ -258,6 +258,8 @@
 	"this_collection": "This Collection",
 	"related_collection": "Related Collection",
 
+	"related_values": "Related Values",
+
 	"last_page": "Last Page",
 	"last_login": "Last Login",
 
diff --git a/app/src/modules/settings/routes/data-model/field-detail/components/display.vue b/app/src/modules/settings/routes/data-model/field-detail/components/display.vue
index ba169bdbf8..0ae115f7f4 100644
--- a/app/src/modules/settings/routes/data-model/field-detail/components/display.vue
+++ b/app/src/modules/settings/routes/data-model/field-detail/components/display.vue
@@ -76,7 +76,7 @@ export default defineComponent({
 				return item;
 			});
 
-			if (displayItems.length >= 5) {
+			if (displayItems.length >= 5 && recommended.length > 0) {
 				return [
 					...recommended.map((key) => displayItems.find((item) => item.value === key)),
 					{ divider: true },
diff --git a/app/src/modules/settings/routes/data-model/field-detail/components/interface.vue b/app/src/modules/settings/routes/data-model/field-detail/components/interface.vue
index de99a38d7d..1660d63fd8 100644
--- a/app/src/modules/settings/routes/data-model/field-detail/components/interface.vue
+++ b/app/src/modules/settings/routes/data-model/field-detail/components/interface.vue
@@ -109,7 +109,7 @@ export default defineComponent({
 				return item;
 			});
 
-			if (interfaceItems.length >= 5) {
+			if (interfaceItems.length >= 5 && recommended.length > 0) {
 				return [
 					...recommended.map((key) => interfaceItems.find((item) => item.value === key)),
 					{ divider: true },
diff --git a/app/src/modules/settings/routes/data-model/fields/fields.vue b/app/src/modules/settings/routes/data-model/fields/fields.vue
index 1ef3c8aa7c..f3db2f5af5 100644
--- a/app/src/modules/settings/routes/data-model/fields/fields.vue
+++ b/app/src/modules/settings/routes/data-model/fields/fields.vue
@@ -89,7 +89,7 @@ import FieldsManagement from './components/fields-management.vue';
 
 import useItem from '@/composables/use-item';
 import router from '@/router';
-import { useCollectionsStore } from '@/stores';
+import { useCollectionsStore, useFieldsStore } from '@/stores';
 import marked from 'marked';
 
 export default defineComponent({
@@ -114,6 +114,7 @@ export default defineComponent({
 		const { collection } = toRefs(props);
 		const { info: collectionInfo, fields } = useCollection(collection);
 		const collectionsStore = useCollectionsStore();
+		const fieldsStore = useFieldsStore();
 
 		const { isNew, edits, item, saving, loading, error, save, remove, deleting, saveAsCopy, isBatch } = useItem(
 			ref('directus_collections'),
@@ -147,12 +148,15 @@ export default defineComponent({
 
 		async function deleteAndQuit() {
 			await remove();
+			await collectionsStore.hydrate();
+			await fieldsStore.hydrate();
 			router.push(`/settings/data-model`);
 		}
 
 		async function saveAndQuit() {
 			await save();
 			await collectionsStore.hydrate();
+			await fieldsStore.hydrate();
 			router.push(`/settings/data-model`);
 		}
 	},