Move equality check from observer to notifier

clauderic · Sep 12, 2024 · a5933d8 · a5933d8
1 parent 94920c8
commit a5933d8
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 8 deletions.
diff --git a/.changeset/notifier-observer.md b/.changeset/notifier-observer.md
@@ -0,0 +1,5 @@
+---
+'@dnd-kit/abstract': patch
+---
+
+Move responsibility from `CollisionObserver` to `CollisionNotifier` to check if the previous collisions are equal to the next collisions.
diff --git a/packages/abstract/src/core/collision/notifier.ts b/packages/abstract/src/core/collision/notifier.ts
@@ -4,10 +4,17 @@ import {DragDropManager} from '../manager/index.ts';
 import {CorePlugin} from '../plugins/index.ts';
 import {defaultPreventable} from '../manager/events.ts';
 
+import type {Collision} from './types.ts';
+
 export class CollisionNotifier extends CorePlugin {
   constructor(manager: DragDropManager<any, any>) {
     super(manager);
 
+    const isEqual = (a: Collision[], b: Collision[]) =>
+      a.map(({id}) => id).join('') === b.map(({id}) => id).join('');
+
+    let previousCollisions: Collision[] = [];
+
     this.destroy = effect(() => {
       const {collisionObserver, monitor} = manager;
       const {collisions} = collisionObserver;
@@ -26,6 +33,12 @@ export class CollisionNotifier extends CorePlugin {
         return;
       }
 
+      if (isEqual(collisions, previousCollisions)) {
+        return;
+      } else {
+        previousCollisions = collisions;
+      }
+
       const [firstCollision] = collisions;
 
       untracked(() => {

diff --git a/packages/abstract/src/core/collision/observer.ts b/packages/abstract/src/core/collision/observer.ts
@@ -20,19 +20,11 @@ export class CollisionObserver<
     this.computeCollisions = this.computeCollisions.bind(this);
     this.#collisions = signal(DEFAULT_VALUE);
 
-    const isEqual = (a: Collision[], b: Collision[]) =>
-      a.map(({id}) => id).join('') === b.map(({id}) => id).join('');
-
     let previousCoordinates: Coordinates = {x: 0, y: 0};
 
     this.destroy = effects(
       () => {
         const collisions = this.computeCollisions();
-        const previousCollisions = this.#collisions.peek();
-
-        if (isEqual(collisions, previousCollisions)) {
-          return;
-        }
 
         const coordinates = untracked(
           () => this.manager.dragOperation.position.current