fix: duplicate merge button bug (#15284)

Fixes - https://github.com/twentyhq/twenty/issues/15263

- Replaced `useLoadSelectedRecordsInContextStore` with
`useLoadMergeRecords` in `useOpenMergeRecordsPageInCommandMenu` for
improved functionality.
- Updated `useMergePreview`, `useMergeRecordsActions`, and
`useMergeRecordsSettings` to utilize `mergeRecordsState` instead of the
deprecated context store hook.
- Cleaned up imports and ensured consistency across merge-related hooks.


https://github.com/user-attachments/assets/453539c9-7f2b-4e8c-bfa1-3ceebca07081

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Ranjeet Baraik
2025-10-24 22:33:11 +05:30
committed by GitHub
parent 9b2a73d50a
commit e613b15c5a
34 changed files with 366 additions and 350 deletions
@@ -1,78 +0,0 @@
import { commandMenuNavigationMorphItemByPageState } from '@/command-menu/states/commandMenuNavigationMorphItemsState';
import { commandMenuNavigationRecordsState } from '@/command-menu/states/commandMenuNavigationRecordsState';
import { commandMenuNavigationStackState } from '@/command-menu/states/commandMenuNavigationStackState';
import { useApolloCoreClient } from '@/object-metadata/hooks/useApolloCoreClient';
import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
import { getRecordFromCache } from '@/object-record/cache/utils/getRecordFromCache';
import { useObjectPermissions } from '@/object-record/hooks/useObjectPermissions';
import { useEffect } from 'react';
import { useRecoilValue, useSetRecoilState } from 'recoil';
import { isDefined } from 'twenty-shared/utils';
export const CommandMenuContextChipRecordSetterEffect = () => {
const commandMenuNavigationMorphItemByPage = useRecoilValue(
commandMenuNavigationMorphItemByPageState,
);
const setCommandMenuNavigationRecords = useSetRecoilState(
commandMenuNavigationRecordsState,
);
const objectMetadataItems = useRecoilValue(objectMetadataItemsState);
const { objectPermissionsByObjectMetadataId } = useObjectPermissions();
const commandMenuNavigationStack = useRecoilValue(
commandMenuNavigationStackState,
);
const apolloCoreClient = useApolloCoreClient();
useEffect(() => {
if (commandMenuNavigationStack.length > 1) {
const morphItems = Array.from(
commandMenuNavigationMorphItemByPage.values(),
);
const records = morphItems
.map((morphItem) => {
const objectMetadataItem = objectMetadataItems.find(
({ id }) => id === morphItem.objectMetadataId,
);
if (!objectMetadataItem) {
return null;
}
const record = getRecordFromCache({
recordId: morphItem.recordId,
cache: apolloCoreClient.cache,
objectMetadataItems,
objectMetadataItem,
objectPermissionsByObjectMetadataId,
});
if (!record) {
return null;
}
return {
objectMetadataItem,
record,
};
})
.filter(isDefined);
setCommandMenuNavigationRecords(records);
}
}, [
apolloCoreClient.cache,
commandMenuNavigationMorphItemByPage,
commandMenuNavigationStack,
commandMenuNavigationStack.length,
objectMetadataItems,
setCommandMenuNavigationRecords,
objectPermissionsByObjectMetadataId,
]);
return null;
};
@@ -1,6 +1,5 @@
import { ActionMenuContextProvider } from '@/action-menu/contexts/ActionMenuContextProvider';
import { CommandMenuContainer } from '@/command-menu/components/CommandMenuContainer';
import { CommandMenuContextChipRecordSetterEffect } from '@/command-menu/components/CommandMenuContextChipRecordSetterEffect';
import { CommandMenuTopBar } from '@/command-menu/components/CommandMenuTopBar';
import { COMMAND_MENU_PAGES_CONFIG } from '@/command-menu/constants/CommandMenuPagesConfig';
import { commandMenuPageInfoState } from '@/command-menu/states/commandMenuPageInfoState';
@@ -31,7 +30,6 @@ export const CommandMenuRouter = () => {
return (
<CommandMenuContainer>
<CommandMenuContextChipRecordSetterEffect />
<CommandMenuPageComponentInstanceContext.Provider
value={{ instanceId: commandMenuPageInfo.instanceId }}
>