From 89293d92a93c8016ef202a25578a2b1cbacea262 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jos=C3=A9=20Varela?= <joselcvarela@gmail.com>
Date: Tue, 28 Mar 2023 12:03:56 +0100
Subject: [PATCH] App: Fix saving required relational fields (#17842)

* Fix saving relational fields

* Be more specific on variable name

* Fix missing quotes
---
 app/src/composables/use-item.ts | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/app/src/composables/use-item.ts b/app/src/composables/use-item.ts
index f8e79e8e1a..6e7f01ec22 100644
--- a/app/src/composables/use-item.ts
+++ b/app/src/composables/use-item.ts
@@ -11,7 +11,7 @@ import { validateItem } from '@/utils/validate-item';
 import { useCollection } from '@directus/shared/composables';
 import { getEndpoint } from '@directus/shared/utils';
 import { AxiosResponse } from 'axios';
-import { merge } from 'lodash';
+import { mergeWith } from 'lodash';
 import { computed, ComputedRef, Ref, ref, watch } from 'vue';
 import { usePermissions } from './use-permissions';
 import { Field, Query, Relation } from '@directus/shared/types';
@@ -120,12 +120,20 @@ export function useItem(
 		saving.value = true;
 		validationErrors.value = [];
 
-		const errors = validateItem(
-			merge({}, defaultValues.value, item.value, edits.value),
-			fieldsWithPermissions.value,
-			isNew.value
+		const payloadToValidate = mergeWith(
+			{},
+			defaultValues.value,
+			item.value,
+			edits.value,
+			function (from: any, to: any) {
+				if (typeof to !== 'undefined') {
+					return to;
+				}
+			}
 		);
 
+		const errors = validateItem(payloadToValidate, fieldsWithPermissions.value, isNew.value);
+
 		if (errors.length > 0) {
 			validationErrors.value = errors;
 			saving.value = false;