Moved the simulationDashBoard from src to components

app/src/components/SimulationDashboard/functions/eventHandlers/index.ts

@@ -0,0 +1,141 @@
+import type { UIElement } from "../../../../types/exportedTypes";
+
+export const handleElementDragStart = (
+    elementId: string,
+    event: React.MouseEvent,
+    currentElement: UIElement | undefined,
+    setDraggingElement: (elementId: string | null) => void,
+    setElementDragOffset: (offset: Position) => void
+): void => {
+    if (currentElement?.positionType === "absolute") {
+        setDraggingElement(elementId);
+
+        // Calculate offset relative to the element's current position
+        const element = event.currentTarget as HTMLElement;
+        const elementRect = element.getBoundingClientRect();
+
+        setElementDragOffset({
+            x: event.clientX - elementRect.left,
+            y: event.clientY - elementRect.top,
+        });
+
+        event.preventDefault();
+        event.stopPropagation(); // Prevent event from bubbling to block
+    }
+};
+
+export const handleBlockDragStart = (
+    blockId: string,
+    event: React.MouseEvent,
+    setDraggingBlock: (blockId: string | null) => void,
+    setBlockDragOffset: (offset: Position) => void // Change to specific offset
+): void => {
+    console.log("Block drag start:", blockId);
+    setDraggingBlock(blockId);
+    const element = event.currentTarget as HTMLElement;
+    const rect = element.getBoundingClientRect();
+    setBlockDragOffset({
+        x: event.clientX - rect.left,
+        y: event.clientY - rect.top,
+    });
+    event.preventDefault();
+    event.stopPropagation();
+};
+
+export const handleElementResizeStart = (
+    elementId: string,
+    event: React.MouseEvent,
+    setResizingElement: (elementId: string | null) => void,
+    setResizeStart: (start: { x: number; y: number; width: number; height: number } | null) => void
+): void => {
+    event.stopPropagation();
+    setResizingElement(elementId);
+    const element = event.currentTarget.closest("[data-element-id]") as HTMLElement;
+    if (element) {
+        const rect = element.getBoundingClientRect();
+        setResizeStart({
+            x: event.clientX,
+            y: event.clientY,
+            width: rect.width,
+            height: rect.height,
+        });
+    }
+};
+
+export const handleBlockResizeStart = (
+    blockId: string,
+    event: React.MouseEvent,
+    setResizingBlock: (blockId: string | null) => void,
+    setResizeStart: (start: { x: number; y: number; width: number; height: number } | null) => void
+): void => {
+    event.stopPropagation();
+    setResizingBlock(blockId);
+    const block = event.currentTarget.closest("[data-block-id]") as HTMLElement;
+    if (block) {
+        const rect = block.getBoundingClientRect();
+        setResizeStart({
+            x: event.clientX,
+            y: event.clientY,
+            width: rect.width,
+            height: rect.height,
+        });
+    }
+};
+
+export const handleSwapStart = (elementId: string, event: React.MouseEvent, setSwapSource: (source: string | null) => void, setShowSwapUI: (show: boolean) => void): void => {
+    event.stopPropagation();
+    setSwapSource(elementId);
+    setShowSwapUI(true);
+};
+
+export const handleSwapTarget = (
+    elementId: string,
+    event: React.MouseEvent,
+    swapSource: string | null,
+    selectedBlock: string | null,
+    swapElements: (
+        blockId: string,
+        elementId1: string,
+        elementId2: string,
+    ) => void,
+): void => {
+    event.stopPropagation();
+    if (swapSource && swapSource !== elementId && selectedBlock) {
+        swapElements(selectedBlock, swapSource, elementId);
+    }
+};
+
+export const handleBlockClick = (
+    blockId: string,
+    event: React.MouseEvent,
+    editMode: boolean,
+    setSelectedBlock: (blockId: string | null) => void,
+    setSelectedElement: (elementId: string | null) => void,
+    setShowSwapUI: (show: boolean) => void
+): void => {
+    event.stopPropagation();
+    if (editMode) {
+        setSelectedBlock(blockId);
+        setSelectedElement(null);
+        setShowSwapUI(false);
+    }
+};
+
+export const handleElementClick = (
+    blockId: string,
+    elementId: string,
+    event: React.MouseEvent,
+    editMode: boolean,
+    setSelectedElement: (elementId: string | null) => void,
+    setSelectedBlock: (blockId: string | null) => void,
+    setShowSwapUI: (show: boolean) => void,
+    setShowElementDropdown: (blockId: string | null) => void
+): void => {
+    event.stopPropagation();
+    if (editMode) {
+        setSelectedElement(elementId);
+        setSelectedBlock(blockId);
+        setShowSwapUI(false);
+        setShowElementDropdown(null);
+    }
+};