chore: Drag and drop refactor

This commit is contained in:
Tom Moor
2023-12-19 10:35:19 -05:00
parent 6616276e4b
commit c3429bdbbd

View File

@@ -15,10 +15,11 @@ import { useStarLabelAndIcon } from "./useStarLabelAndIcon";
export function useDragStar( export function useDragStar(
star: Star star: Star
): [{ isDragging: boolean }, ConnectDragSource] { ): [{ isDragging: boolean }, ConnectDragSource] {
const id = star.id;
const { label: title, icon } = useStarLabelAndIcon(star); const { label: title, icon } = useStarLabelAndIcon(star);
const [{ isDragging }, draggableRef, preview] = useDrag({ const [{ isDragging }, draggableRef, preview] = useDrag({
type: "star", type: "star",
item: () => ({ icon, title, star }), item: () => ({ id, title, icon }),
collect: (monitor) => ({ collect: (monitor) => ({
isDragging: !!monitor.isDragging(), isDragging: !!monitor.isDragging(),
}), }),
@@ -67,8 +68,9 @@ export function useDropToReorderStar(getIndex?: () => string) {
return useDrop({ return useDrop({
accept: "star", accept: "star",
drop: async (item: { star: Star }) => { drop: async (item: DragObject) => {
void item.star.save({ const star = stars.get(item.id);
void star?.save({
index: index:
getIndex?.() ?? fractionalIndex(null, stars.orderedData[0].index), getIndex?.() ?? fractionalIndex(null, stars.orderedData[0].index),
}); });