fix(rack): memoize dnd-kit sensors and prevent pointermove state thrashing
This commit is contained in:
@@ -79,6 +79,10 @@ function resolveSlotFromPoint(clientX: number, clientY: number): HoverSlot | nul
|
||||
return { rackId, uPosition: uPos };
|
||||
}
|
||||
|
||||
const POINTER_SENSOR_OPTIONS = {
|
||||
activationConstraint: { distance: 6 },
|
||||
};
|
||||
|
||||
export function RackPlanner() {
|
||||
const { racks, loading, fetchRacks, moveModule } = useRackStore();
|
||||
const canvasRef = useRef<HTMLDivElement>(null);
|
||||
@@ -105,7 +109,7 @@ export function RackPlanner() {
|
||||
}
|
||||
|
||||
const sensors = useSensors(
|
||||
useSensor(PointerSensor, { activationConstraint: { distance: 6 } })
|
||||
useSensor(PointerSensor, POINTER_SENSOR_OPTIONS)
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -122,9 +126,13 @@ export function RackPlanner() {
|
||||
function onPointerMove(e: PointerEvent) {
|
||||
if (!isDraggingAnyRef.current) return;
|
||||
const slot = resolveSlotFromPoint(e.clientX, e.clientY);
|
||||
|
||||
const prev = hoverSlotRef.current;
|
||||
if (prev?.rackId !== slot?.rackId || prev?.uPosition !== slot?.uPosition) {
|
||||
hoverSlotRef.current = slot;
|
||||
setHoverSlot(slot);
|
||||
}
|
||||
}
|
||||
|
||||
// Capture phase so we get the event before any element can stop propagation.
|
||||
window.addEventListener('pointermove', onPointerMove, { capture: true });
|
||||
|
||||
Reference in New Issue
Block a user