diff --git a/app/src/composables/use-form-fields/use-form-fields.ts b/app/src/composables/use-form-fields/use-form-fields.ts
index 869470b2a2..a29fe38673 100644
--- a/app/src/composables/use-form-fields/use-form-fields.ts
+++ b/app/src/composables/use-form-fields/use-form-fields.ts
@@ -2,13 +2,20 @@ import { FormField } from '@/components/v-form/types';
 import { getInterface } from '@/interfaces';
 import { Field } from '@directus/shared/types';
 import { getDefaultInterfaceForType } from '@/utils/get-default-interface-for-type';
-import { clone, orderBy } from 'lodash';
+import { cloneDeep, orderBy } from 'lodash';
 import { computed, ComputedRef, Ref } from 'vue';
 import { translate } from '@/utils/translate-object-values';
 
 export default function useFormFields(fields: Ref<Field[]>): { formFields: ComputedRef<Field[]> } {
 	const formFields = computed(() => {
-		let formFields = clone(fields.value);
+		let formFields = cloneDeep(fields.value);
+
+		formFields = formFields.filter((field) => {
+			const systemFake = field.field?.startsWith('$') || false;
+			return systemFake === false;
+		});
+
+		formFields = orderBy(formFields, [(field) => !!field.meta?.system, 'meta.sort', 'meta.id'], ['desc', 'asc', 'asc']);
 
 		formFields = formFields.map((field, index) => {
 			if (!field.meta) return field;
@@ -27,10 +34,11 @@ export default function useFormFields(fields: Ref<Field[]>): { formFields: Compu
 				(field as FormField).hideLoader = true;
 			}
 
-			if (index !== 0 && field.meta!.width === 'half') {
-				const prevField = formFields[index - 1];
+			if (index !== 0 && field.meta!.width === 'half' && field.meta!.hidden !== true) {
+				const previousFields = [...formFields].slice(0, index).reverse();
+				const prevNonHiddenField = previousFields.find((field) => field.meta?.hidden !== true);
 
-				if (prevField.meta?.width === 'half') {
+				if (prevNonHiddenField && prevNonHiddenField.meta?.width === 'half') {
 					field.meta.width = 'half-right';
 				}
 			}
@@ -38,13 +46,6 @@ export default function useFormFields(fields: Ref<Field[]>): { formFields: Compu
 			return field;
 		});
 
-		formFields = formFields.filter((field) => {
-			const systemFake = field.field?.startsWith('$') || false;
-			return systemFake === false;
-		});
-
-		formFields = orderBy(formFields, [(field) => !!field.meta?.system, 'meta.sort', 'meta.id'], ['desc', 'asc', 'asc']);
-
 		formFields = translate(formFields);
 
 		return formFields;