Fix OnAddMany triggering save twice

mick-schroeder · Jul 1, 2021 · 1501206 · 1501206
1 parent 5638f4d
commit 1501206
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/src/js/components/form/creator-field.jsx b/src/js/components/form/creator-field.jsx
@@ -98,8 +98,17 @@ CreatorTypeSelector.propTypes = {
 const CreatorFieldInputWrap = memo(forwardRef((props, ref) => {
 	const { active, creator, index, inModal, isForm, isReadOnly, label, name, onCancel, onAddMany,
 	onEditableCommit, onFieldClick, onFieldFocus, } = props;
+	const ignoreNextChange = useRef(null);
 	const shouldUseEditable = !isForm && !inModal;
 
+	const handleEditableCommit = useCallback((newValue, hasChanged, srcEvent) => {
+		if(ignoreNextChange.current !== srcEvent.target) {
+			onEditableCommit(newValue, hasChanged, srcEvent);
+		}
+		ignoreNextChange.current = null;
+
+	}, [onEditableCommit]);
+
 	const handlePaste = useCallback(ev => {
 		const clipboardData = ev.clipboardData || window.clipboardData;
 		const pastedData = clipboardData.getData('Text');
@@ -126,7 +135,8 @@ const CreatorFieldInputWrap = memo(forwardRef((props, ref) => {
 			[name]: creator[name].slice(0, selectionStart) + entries[entries.length - 1] + creator[name].slice(selectionEnd)
 		};
 
-		onAddMany([...additionalCreators, lastCreator], index);
+		ignoreNextChange.current = ev.target;
+		onAddMany([...additionalCreators, lastCreator], index, ev);
 	}, [creator, index, inModal, name, onAddMany]);
 
 	const formField = <Input
@@ -137,7 +147,7 @@ const CreatorFieldInputWrap = memo(forwardRef((props, ref) => {
 		isDisabled={ isReadOnly }
 		onCancel={ onCancel }
 		onClick={ onFieldClick }
-		onCommit={ onEditableCommit }
+		onCommit={ handleEditableCommit }
 		onFocus={ onFieldFocus }
 		placeholder={ label }
 		ref={ ref }