Keep track of drag targets, avoids flickering and performance issues

client/src/components/History/CurrentHistory/HistoryPanel.vue

@@ -30,7 +30,8 @@
                 <section
                     class="history-layout d-flex flex-column w-100"
                     @drop.prevent="onDrop"
-                    @dragover.prevent="onDragOver"
+                    @dragenter.prevent="onDragEnter"
+                    @dragover.prevent
                     @dragleave.prevent="onDragLeave">
                     <slot name="navigation" :history="history" />
                     <HistoryFilters
@@ -323,12 +324,15 @@ export default {
             this.highlights = {};
             this.highlightsKey = null;
         },
-        onDragLeave() {
-            this.showDropZone = false;
-        },
-        onDragOver() {
+        onDragEnter(e) {
+            this.dragTarget = e.target;
             this.showDropZone = true;
         },
+        onDragLeave(e) {
+            if (this.dragTarget == e.target) {
+                this.showDropZone = false;
+            }
+        },
         onDrop(evt) {
             this.showDropZone = false;
             const data = JSON.parse(evt.dataTransfer.getData("text"))[0];