From 9b80864c6eb0df45f47d6d4c32fe08c100531ebe Mon Sep 17 00:00:00 2001 From: ehconitin Date: Fri, 13 Dec 2024 16:45:02 +0530 Subject: [PATCH] temporary last position fix --- .../components/CurrentWorkspaceMemberFavorites.tsx | 5 +++++ .../CurrentWorkspaceMemberFavoritesFolders.tsx | 2 +- .../modules/favorites/hooks/useReorderFavorite.ts | 12 +++++++----- 3 files changed, 13 insertions(+), 6 deletions(-) diff --git a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx index 847d96bdbf5b..2009febe7975 100644 --- a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx +++ b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx @@ -157,6 +157,11 @@ export const CurrentWorkspaceMemberFavorites = ({ ref={provided.innerRef} // eslint-disable-next-line react/jsx-props-no-spreading {...provided.droppableProps} + style={{ + marginBottom: 15, + }} + // TODO: (Drag Drop Bug) Adding bottom margin to ensure drag-to-last-position works. Need to find better solution that doesn't affect spacing. + // Issue: Without margin, dragging to last position triggers next folder drop area > {folder.favorites.map((favorite, index) => ( theme.spacing(2.5)}; width: 100%; `; diff --git a/packages/twenty-front/src/modules/favorites/hooks/useReorderFavorite.ts b/packages/twenty-front/src/modules/favorites/hooks/useReorderFavorite.ts index 54f3e2a15500..91130e5ef1f0 100644 --- a/packages/twenty-front/src/modules/favorites/hooks/useReorderFavorite.ts +++ b/packages/twenty-front/src/modules/favorites/hooks/useReorderFavorite.ts @@ -1,8 +1,10 @@ import { useSortedFavorites } from '@/favorites/hooks/useSortedFavorites'; +import { activeFavoriteFolderIdState } from '@/favorites/states/activeFavoriteFolderIdState'; import { calculateNewPosition } from '@/favorites/utils/calculateNewPosition'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord'; import { OnDragEndResponder } from '@hello-pangea/dnd'; +import { useSetRecoilState } from 'recoil'; import { usePrefetchedFavoritesData } from './usePrefetchedFavoritesData'; export const useReorderFavorite = () => { @@ -11,13 +13,15 @@ export const useReorderFavorite = () => { const { updateOneRecord: updateOneFavorite } = useUpdateOneRecord({ objectNameSingular: CoreObjectNameSingular.Favorite, }); + const setActiveFavoriteFolderId = useSetRecoilState( + activeFavoriteFolderIdState, + ); const handleReorderFavorite: OnDragEndResponder = (result) => { const { destination, source, draggableId } = result; if (!destination) return; - // If dropped in the same location, do nothing if ( destination.droppableId === source.droppableId && destination.index === source.index @@ -28,7 +32,6 @@ export const useReorderFavorite = () => { const draggedFavorite = favorites.find((f) => f.id === draggableId); if (!draggedFavorite) return; - // When dropping on a folder header (folder is closed) if (destination.droppableId.startsWith('folder-header-')) { const targetFolderId = destination.droppableId.replace( 'folder-header-', @@ -52,10 +55,11 @@ export const useReorderFavorite = () => { position: newPosition, }, }); + + setActiveFavoriteFolderId(targetFolderId); return; } - // When moving between different lists (different folders or orphan section) if (destination.droppableId !== source.droppableId) { const newFolderId = destination.droppableId === 'orphan-favorites' @@ -66,7 +70,6 @@ export const useReorderFavorite = () => { (favorite) => favorite.favoriteFolderId === newFolderId, ); - // Calculate position in new list let newPosition; if (destinationFavorites.length === 0) { newPosition = 0; @@ -93,7 +96,6 @@ export const useReorderFavorite = () => { return; } - // When reordering within the same list const currentFolderId = source.droppableId === 'orphan-favorites' ? null