fix merge records network race condition (#14466)

/closes #13643

<img width="1496" height="278" alt="image"
src="https://github.com/user-attachments/assets/b10d0e8a-ff66-4046-af6a-4ff594f7ed69"
/>

packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergePreview.ts

@@ -6,6 +6,7 @@ import { useMergeManyRecords } from '@/object-record/hooks/useMergeManyRecords';
 import { useMergeRecordRelationships } from '@/object-record/record-merge/hooks/useMergeRecordRelationships';
 import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore';
 import { type ObjectRecord } from '@/object-record/types/ObjectRecord';
+import { isMergeInProgressState } from '../states/mergeInProgressState';
 import { mergeSettingsState } from '../states/mergeSettingsState';
 
 type UseMergePreviewProps = {
@@ -20,6 +21,7 @@ export const useMergePreview = ({
   const [isGeneratingPreview, setIsGeneratingPreview] = useState(false);
 
   const mergeSettings = useRecoilValue(mergeSettingsState);
+  const isMergeInProgress = useRecoilValue(isMergeInProgressState);
   const { records: selectedRecords } = useFindManyRecordsSelectedInContextStore(
     {
       limit: 10,
@@ -39,7 +41,7 @@ export const useMergePreview = ({
 
   useEffect(() => {
     const fetchPreview = async () => {
-      if (selectedRecords.length < 2) return;
+      if (selectedRecords.length < 2 || isMergeInProgress) return;
       setIsGeneratingPreview(true);
       try {
         const previewRecord = await mergeManyRecords({
@@ -62,7 +64,7 @@ export const useMergePreview = ({
       }
     };
 
-    if (selectedRecords.length > 0) {
+    if (selectedRecords.length > 0 && !isMergeInProgress) {
       fetchPreview();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps

packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergeRecordsActions.ts

@@ -1,5 +1,5 @@
 import { useLingui } from '@lingui/react/macro';
-import { useRecoilValue } from 'recoil';
+import { useRecoilValue, useSetRecoilState } from 'recoil';
 
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { useFindManyRecordsSelectedInContextStore } from '@/context-store/hooks/useFindManyRecordsSelectedInContextStore';
@@ -7,6 +7,7 @@ import { useMergeManyRecords } from '@/object-record/hooks/useMergeManyRecords';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { AppPath } from 'twenty-shared/types';
 import { useNavigateApp } from '~/hooks/useNavigateApp';
+import { isMergeInProgressState } from '../states/mergeInProgressState';
 import { mergeSettingsState } from '../states/mergeSettingsState';
 
 type UseMergeRecordsActionsProps = {
@@ -27,12 +28,15 @@ export const useMergeRecordsActions = ({
     objectNameSingular,
   });
 
+  const setMergeInProgress = useSetRecoilState(isMergeInProgressState);
+
   const { t } = useLingui();
   const { enqueueSuccessSnackBar, enqueueErrorSnackBar } = useSnackBar();
   const { closeCommandMenu } = useCommandMenu();
 
   const navigate = useNavigateApp();
   const handleMergeRecords = async () => {
+    setMergeInProgress(true);
     try {
       const mergedRecord = await mergeManyRecords({
         recordIds: selectedRecords.map((record) => record.id),
@@ -62,6 +66,8 @@ export const useMergeRecordsActions = ({
             ? error.message
             : 'Failed to merge records. Please try again.',
       });
+    } finally {
+      setMergeInProgress(false);
     }
   };
 

packages/twenty-front/src/modules/object-record/record-merge/states/mergeInProgressState.ts

@@ -0,0 +1,6 @@
+import { createState } from 'twenty-ui/utilities';
+
+export const isMergeInProgressState = createState<boolean>({
+  key: 'isMergeInProgress',
+  defaultValue: false,
+});