Open mnofrizal opened 4 months ago
See if you can fix it and share the solution, this is just a starter repo
TLDR; @mnofrizal The issue is in this line: https://github.com/Georgegriff/react-dnd-kit-tailwind-shadcn-ui/blob/3e1dbb0b872125191d5f9c3686060f64d304b99e/src/components/KanbanBoard.tsx#L349
If the overIndex
is 0, so the to
will be negative (-1) and arrayMove
function will move the task in array.length + to
position which is the last position.
You can find the arrayMove
definition here : https://github.com/clauderic/dnd-kit/blob/master/packages/sortable/src/utilities/arrayMove.ts
The fix is to use the max of 0 and overIndex - 1
return arrayMove(tasks, activeIndex, Math.max(0, overIndex - 1));
I am putting the task on the very top of the list, so the overlay shows that it is going to be the very first task in this column, once I dropped the tasks, it goes at the very bottom of the column.![ezgif-6-fe182854cd](https://github.com/Georgegriff/react-dnd-kit-tailwind-shadcn-ui/assets/104338408/5c9f17d2-ee1e-401e-921e-d330ef79ee7b)