From d45c5a4ab93786d786a845bb9313f084244852d3 Mon Sep 17 00:00:00 2001
From: Dominik Pschenitschni <mail@celement.de>
Date: Sun, 18 Sep 2022 18:39:37 +0200
Subject: [PATCH] chore: don't use ref for bar

---
 src/composables/useBarDrag.ts           | 32 ++++++++++++-------------
 src/composables/useBarDragManagement.ts | 10 +++-----
 2 files changed, 19 insertions(+), 23 deletions(-)

diff --git a/src/composables/useBarDrag.ts b/src/composables/useBarDrag.ts
index 9920d2a4..81877ea2 100644
--- a/src/composables/useBarDrag.ts
+++ b/src/composables/useBarDrag.ts
@@ -1,13 +1,13 @@
 import type { GGanttChartConfig } from "../components/GGanttChart.vue"
 import provideConfig from "../provider/provideConfig"
-import { type Ref, ref } from "vue"
+import { ref } from "vue"
 
 import type { GanttBarObject } from "../types"
 import useDayjsHelper from "./useDayjsHelper"
 import useTimePositionMapping from "./useTimePositionMapping"
 
 export default function createBarDrag(
-  bar: Ref<GanttBarObject>,
+  bar: GanttBarObject,
   onDrag: (e: MouseEvent, bar: GanttBarObject) => void = () => null,
   onEndDrag: (e: MouseEvent, bar: GanttBarObject) => void = () => null,
   config: GGanttChartConfig = provideConfig()
@@ -22,7 +22,7 @@ export default function createBarDrag(
   const { toDayjs } = useDayjsHelper(config)
 
   const initDrag = (e: MouseEvent) => {
-    const barElement = document.getElementById(bar.value.ganttBarConfig.id)
+    const barElement = document.getElementById(bar.ganttBarConfig.id)
     if (!barElement) {
       return
     }
@@ -47,7 +47,7 @@ export default function createBarDrag(
   }
 
   const getBarElements = () => {
-    const barElement = document.getElementById(bar.value.ganttBarConfig.id)
+    const barElement = document.getElementById(bar.ganttBarConfig.id)
     const barContainer = barElement?.closest(".g-gantt-row-bars-container")?.getBoundingClientRect()
     return { barElement, barContainer }
   }
@@ -64,9 +64,9 @@ export default function createBarDrag(
     if (isOutOfRange(xStart, xEnd)) {
       return
     }
-    bar.value[barStart.value] = mapPositionToTime(xStart)
-    bar.value[barEnd.value] = mapPositionToTime(xEnd)
-    onDrag(e, bar.value)
+    bar[barStart.value] = mapPositionToTime(xStart)
+    bar[barEnd.value] = mapPositionToTime(xEnd)
+    onDrag(e, bar)
   }
 
   const dragByLeftHandle = (e: MouseEvent) => {
@@ -77,11 +77,11 @@ export default function createBarDrag(
 
     const xStart = e.clientX - barContainer.left
     const newBarStart = mapPositionToTime(xStart)
-    if (toDayjs(newBarStart).isSameOrAfter(toDayjs(bar.value, "end"))) {
+    if (toDayjs(newBarStart).isSameOrAfter(toDayjs(bar, "end"))) {
       return
     }
-    bar.value[barStart.value] = newBarStart
-    onDrag(e, bar.value)
+    bar[barStart.value] = newBarStart
+    onDrag(e, bar)
   }
 
   const dragByRightHandle = (e: MouseEvent) => {
@@ -92,19 +92,19 @@ export default function createBarDrag(
 
     const xEnd = e.clientX - barContainer.left
     const newBarEnd = mapPositionToTime(xEnd)
-    if (toDayjs(newBarEnd).isSameOrBefore(toDayjs(bar.value, "start"))) {
+    if (toDayjs(newBarEnd).isSameOrBefore(toDayjs(bar, "start"))) {
       return
     }
-    bar.value[barEnd.value] = newBarEnd
-    onDrag(e, bar.value)
+    bar[barEnd.value] = newBarEnd
+    onDrag(e, bar)
   }
 
   const isOutOfRange = (xStart?: number, xEnd?: number) => {
     if (!pushOnOverlap.value) {
       return false
     }
-    const dragLimitLeft = bar.value.ganttBarConfig.dragLimitLeft
-    const dragLimitRight = bar.value.ganttBarConfig.dragLimitRight
+    const dragLimitLeft = bar.ganttBarConfig.dragLimitLeft
+    const dragLimitRight = bar.ganttBarConfig.dragLimitRight
 
     return (
       (xStart && dragLimitLeft != null && xStart < dragLimitLeft) ||
@@ -117,7 +117,7 @@ export default function createBarDrag(
     document.body.style.cursor = ""
     window.removeEventListener("mousemove", dragCallBack)
     window.removeEventListener("mouseup", endDrag)
-    onEndDrag(e, bar.value)
+    onEndDrag(e, bar)
   }
 
   return {
diff --git a/src/composables/useBarDragManagement.ts b/src/composables/useBarDragManagement.ts
index 49698e76..67fdbbbe 100644
--- a/src/composables/useBarDragManagement.ts
+++ b/src/composables/useBarDragManagement.ts
@@ -18,12 +18,8 @@ export default function useBarDragManagement() {
   const { toDayjs } = useDayjsHelper()
 
   const initDragOfBar = (bar: GanttBarObject, e: MouseEvent) => {
-    const { initDrag } = createBarDrag(ref(bar), onDrag, onEndDrag, config)
-    const ev = {
-      ...e,
-      type: "dragstart"
-    }
-    emitBarEvent(ev, bar)
+    const { initDrag } = createBarDrag(bar, onDrag, onEndDrag, config)
+    emitBarEvent({ ...e, type: "dragstart" }, bar)
     initDrag(e)
     addBarToMovedBars(bar)
   }
@@ -37,7 +33,7 @@ export default function useBarDragManagement() {
       row.forEach((bar) => {
         if (bar.ganttBarConfig.bundle === bundle) {
           const dragEndHandler = bar === mainBar ? onEndDrag : () => null
-          const { initDrag } = createBarDrag(ref(bar), onDrag, dragEndHandler, config)
+          const { initDrag } = createBarDrag(bar, onDrag, dragEndHandler, config)
           initDrag(e)
           addBarToMovedBars(bar)
         }