chore: Drag and drop refactor
This commit is contained in:
@@ -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),
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user