diff --git a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useCommandMenuUpdateNavigationMorphItemsByPage.test.tsx b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useCommandMenuUpdateNavigationMorphItemsByPage.test.tsx new file mode 100644 index 0000000000..c75feaaddd --- /dev/null +++ b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useCommandMenuUpdateNavigationMorphItemsByPage.test.tsx @@ -0,0 +1,113 @@ +import { useCommandMenuUpdateNavigationMorphItemsByPage } from '@/command-menu/hooks/useCommandMenuUpdateNavigationMorphItemsByPage'; +import { commandMenuNavigationMorphItemsByPageState } from '@/command-menu/states/commandMenuNavigationMorphItemsByPageState'; +import { renderHook } from '@testing-library/react'; +import { act } from 'react'; +import { RecoilRoot, useRecoilValue } from 'recoil'; + +const pageId = 'merge-page-id'; +const objectMetadataId = 'company-metadata-id'; + +const Wrapper = ({ + children, + initialRecordIds, +}: { + children: React.ReactNode; + initialRecordIds: string[]; +}) => ( + { + set( + commandMenuNavigationMorphItemsByPageState, + new Map([ + [ + pageId, + initialRecordIds.map((recordId) => ({ + objectMetadataId, + recordId, + })), + ], + ]), + ); + }} + > + {children} + +); + +const renderHooks = (initialRecordIds: string[]) => + renderHook( + () => { + const { updateCommandMenuNavigationMorphItemsByPage } = + useCommandMenuUpdateNavigationMorphItemsByPage(); + const commandMenuNavigationMorphItemsByPage = useRecoilValue( + commandMenuNavigationMorphItemsByPageState, + ); + + return { + updateCommandMenuNavigationMorphItemsByPage, + commandMenuNavigationMorphItemsByPage, + }; + }, + { + wrapper: ({ children }) => ( + {children} + ), + }, + ); + +describe('useCommandMenuUpdateNavigationMorphItemsByPage', () => { + it('should replace existing items for a page instead of appending', async () => { + const { result } = renderHooks(['record-1', 'record-2']); + + await act(async () => { + await result.current.updateCommandMenuNavigationMorphItemsByPage({ + pageId, + objectMetadataId, + objectRecordIds: ['record-2', 'record-1'], + }); + }); + + expect( + result.current.commandMenuNavigationMorphItemsByPage.get(pageId), + ).toEqual([ + { + objectMetadataId, + recordId: 'record-2', + }, + { + objectMetadataId, + recordId: 'record-1', + }, + ]); + }); + + it('should keep only the latest payload when called twice for the same page', async () => { + const { result } = renderHooks([]); + + await act(async () => { + await result.current.updateCommandMenuNavigationMorphItemsByPage({ + pageId, + objectMetadataId, + objectRecordIds: ['record-1', 'record-2'], + }); + await result.current.updateCommandMenuNavigationMorphItemsByPage({ + pageId, + objectMetadataId, + objectRecordIds: ['record-2', 'record-1'], + }); + }); + + expect( + result.current.commandMenuNavigationMorphItemsByPage.get(pageId), + ).toEqual([ + { + objectMetadataId, + recordId: 'record-2', + }, + { + objectMetadataId, + recordId: 'record-1', + }, + ]); + }); +}); diff --git a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuUpdateNavigationMorphItemsByPage.tsx b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuUpdateNavigationMorphItemsByPage.tsx index bc1b248ea7..faf0b0f226 100644 --- a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuUpdateNavigationMorphItemsByPage.tsx +++ b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuUpdateNavigationMorphItemsByPage.tsx @@ -1,5 +1,4 @@ import { commandMenuNavigationMorphItemsByPageState } from '@/command-menu/states/commandMenuNavigationMorphItemsByPageState'; -import { isNonEmptyArray } from '@sniptt/guards'; import { useRecoilCallback } from 'recoil'; type UpdateNavigationMorphItemsByPageParams = { @@ -20,17 +19,10 @@ export const useCommandMenuUpdateNavigationMorphItemsByPage = () => { .getLoadable(commandMenuNavigationMorphItemsByPageState) .getValue(); - const currentMorphItemsForPage = currentMorphItems.get(pageId); - - const newMorphItems = [ - ...(isNonEmptyArray(currentMorphItemsForPage) - ? currentMorphItemsForPage - : []), - ...objectRecordIds.map((recordId) => ({ - objectMetadataId, - recordId, - })), - ]; + const newMorphItems = objectRecordIds.map((recordId) => ({ + objectMetadataId, + recordId, + })); const newMorphItemsMap = new Map(currentMorphItems); newMorphItemsMap.set(pageId, newMorphItems);