feat(querybuilder): add empty entity and relation pill dragging usecases

libs/querybuilder/usecases/src/lib/dragging/dragAttribute.ts

 import { MultiGraph } from 'graphology';
+import { GetClosestPill } from './getClosestPill';
 
 export function DragAttributePillStarted(id: string, nodes: MultiGraph) {
   // if the attribute is still connected to an entity or relation pill, disconnect
@@ -27,42 +28,3 @@ export function DragAttibutePillStopped(id: string, nodes: MultiGraph) {
       nodes.addEdge(id, node, { type: 'attribute_connection' });
   });
 }
-
-/**
- * Gets the closest node to id
- * @param id
- * @param nodes Graphology querybuilder MultiGraph object
- * @param allowedNodeTypes An array of the node types which are included in the search
- * @param maxDistance The maximum distance
- * @returns the closest node if within range
- */
-function GetClosestPill(
-  id: string,
-  nodes: MultiGraph,
-  allowedNodeTypes: string[],
-  maxDistance = 150
-): string | undefined {
-  const { x, y, w, h } = nodes.getNodeAttributes(id);
-  const center: { x: number; y: number } = { x: x + w / 2, y: y + h / 2 };
-
-  let minDist = maxDistance * maxDistance;
-  let closestNode: string | undefined = undefined;
-  nodes.forEachNode((node, { x, y, w, h, type }) => {
-    if (allowedNodeTypes.includes(type)) {
-      const nodeCenter: { x: number; y: number } = {
-        x: x + w / 2,
-        y: y + h / 2,
-      };
-
-      const dx = center.x - nodeCenter.x;
-      const dy = center.y - nodeCenter.y;
-      const dist = dx * dx + dy * dy;
-      if (dist < minDist) {
-        minDist = dist;
-        closestNode = node;
-      }
-    }
-  });
-
-  return closestNode;
-}

libs/querybuilder/usecases/src/lib/dragging/dragEntity.ts

+import { MultiGraph } from 'graphology';
+
+export function DragEntityPillStarted(id: string, nodes: MultiGraph) {
+  // Started dragging entity usecase
+}
+
+export function DragEntityPill(
+  id: string,
+  nodes: MultiGraph,
+  dx: number,
+  dy: number
+) {
+  // Code for dragging an entity pill should go here
+}
+
+export function DragEntityPillStopped(id: string, nodes: MultiGraph) {
+  // Stopped dragging entity pill
+}

libs/querybuilder/usecases/src/lib/dragging/dragPill.ts

@@ -6,6 +6,16 @@ import {
   DragAttributePillStarted,
 } from './dragAttribute';
 import { DragAttributesAlong } from './dragAttributesAlong';
+import {
+  DragEntityPill,
+  DragEntityPillStarted,
+  DragEntityPillStopped,
+} from './dragEntity';
+import {
+  DragRelationPill,
+  DragRelationPillStarted,
+  DragRelationPillStopped,
+} from './dragRelation';
 
 export function dragPillStarted(id: string, nodes: MultiGraph) {
   switch (nodes.getNodeAttribute(id, 'type')) {
@@ -13,8 +23,10 @@ export function dragPillStarted(id: string, nodes: MultiGraph) {
       DragAttributePillStarted(id, nodes);
       break;
     case 'entity':
+      DragEntityPillStarted(id, nodes);
       break;
     case 'relation':
+      DragRelationPillStarted(id, nodes);
       break;
   }
 }
@@ -49,9 +61,11 @@ export function dragPill(
       break;
     case 'entity':
       DragAttributesAlong(id, nodes, dx, dy);
+      DragEntityPill(id, nodes, dx, dy);
       break;
     case 'relation':
       DragAttributesAlong(id, nodes, dx, dy);
+      DragRelationPill(id, nodes, dx, dy);
       break;
   }
 }
@@ -62,8 +76,10 @@ export function dragPillStopped(id: string, nodes: MultiGraph) {
       DragAttibutePillStopped(id, nodes);
       break;
     case 'entity':
+      DragEntityPillStopped(id, nodes);
       break;
     case 'relation':
+      DragRelationPillStopped(id, nodes);
       break;
   }
 

libs/querybuilder/usecases/src/lib/dragging/dragRelation.ts

+import { MultiGraph } from 'graphology';
+
+export function DragRelationPillStarted(id: string, nodes: MultiGraph) {
+  // Started dragging relation usecase
+}
+
+export function DragRelationPill(
+  id: string,
+  nodes: MultiGraph,
+  dx: number,
+  dy: number
+) {
+  // Code for dragging an relation pill should go here
+}
+
+export function DragRelationPillStopped(id: string, nodes: MultiGraph) {
+  // Stopped dragging relation pill
+}

libs/querybuilder/usecases/src/lib/dragging/getClosestPill.ts

+import { MultiGraph } from 'graphology';
+
+/**
+ * Gets the closest node to id
+ * @param id
+ * @param nodes Graphology querybuilder MultiGraph object
+ * @param allowedNodeTypes An array of the node types which are included in the search
+ * @param maxDistance The maximum distance
+ * @returns the closest node if within range
+ */
+export function GetClosestPill(
+  id: string,
+  nodes: MultiGraph,
+  allowedNodeTypes: string[],
+  maxDistance = 150
+): string | undefined {
+  const { x, y, w, h } = nodes.getNodeAttributes(id);
+  const center: { x: number; y: number } = { x: x + w / 2, y: y + h / 2 };
+
+  let minDist = maxDistance * maxDistance;
+  let closestNode: string | undefined = undefined;
+  nodes.forEachNode((node, { x, y, w, h, type }) => {
+    if (allowedNodeTypes.includes(type)) {
+      const nodeCenter: { x: number; y: number } = {
+        x: x + w / 2,
+        y: y + h / 2,
+      };
+
+      const dx = center.x - nodeCenter.x;
+      const dy = center.y - nodeCenter.y;
+      const dist = dx * dx + dy * dy;
+      if (dist < minDist) {
+        minDist = dist;
+        closestNode = node;
+      }
+    }
+  });
+
+  return closestNode;
+}