fix(editor): Improve dragndrop of input pills with spaces (#9656)

packages/editor-ui/src/components/AssignmentCollection/AssignmentCollection.vue

@@ -13,7 +13,8 @@ import { computed, reactive, watch } from 'vue';
 import DropArea from '../DropArea/DropArea.vue';
 import ParameterOptions from '../ParameterOptions.vue';
 import Assignment from './Assignment.vue';
-import { inputDataToAssignments, nameFromExpression, typeFromExpression } from './utils';
+import { inputDataToAssignments, typeFromExpression } from './utils';
+import { propertyNameFromExpression } from '@/utils/mappingUtils';
 
 interface Props {
 	parameter: INodeProperties;
@@ -49,7 +50,7 @@ const issues = computed(() => {
 });
 
 const empty = computed(() => state.paramValue.assignments.length === 0);
-const activeDragField = computed(() => nameFromExpression(ndvStore.draggableData));
+const activeDragField = computed(() => propertyNameFromExpression(ndvStore.draggableData));
 const inputData = computed(() => ndvStore.ndvInputData?.[0]?.json);
 const actions = computed(() => {
 	return [
@@ -82,7 +83,7 @@ function addAssignment(): void {
 function dropAssignment(expression: string): void {
 	state.paramValue.assignments.push({
 		id: uuid(),
-		name: nameFromExpression(expression),
+		name: propertyNameFromExpression(expression),
 		value: `=${expression}`,
 		type: typeFromExpression(expression),
 	});

packages/editor-ui/src/components/AssignmentCollection/__tests__/utils.test.ts

@@ -1,15 +0,0 @@
-import { nameFromExpression } from '../utils';
-
-describe('AssignmentCollection > utils', () => {
-	describe('nameFromExpression', () => {
-		test('should extract assignment name from previous node', () => {
-			expect(nameFromExpression('{{ $json.foo.bar }}')).toBe('foo.bar');
-		});
-
-		test('should extract assignment name from another node', () => {
-			expect(nameFromExpression("{{ $('Node's \"Name\" (copy)').item.json.foo.bar }}")).toBe(
-				'foo.bar',
-			);
-		});
-	});
-});

packages/editor-ui/src/components/AssignmentCollection/utils.ts

@@ -3,13 +3,6 @@ import type { AssignmentValue, IDataObject } from 'n8n-workflow';
 import { resolveParameter } from '@/composables/useWorkflowHelpers';
 import { v4 as uuid } from 'uuid';
 
-export function nameFromExpression(expression: string): string {
-	return expression
-		.replace(/^{{\s*|\s*}}$/g, '')
-		.replace('$json.', '')
-		.replace(/^\$\(.*\)(\.item\.json)?\.(.*)/, '$2');
-}
-
 export function inferAssignmentType(value: unknown): string {
 	if (typeof value === 'boolean') return 'boolean';
 	if (typeof value === 'number') return 'number';