From d483869aa6e96b73e36dc5ac069ef6917102c9dc Mon Sep 17 00:00:00 2001
From: Jan Prochazka <jan.prochazka@gmail.com>
Date: Thu, 2 Jun 2022 17:32:07 +0200
Subject: [PATCH] reorder pinned tables #227

---
 .../src/appobj/DatabaseObjectAppObject.svelte |  4 ++
 .../web/src/appobj/PinnedAppObject.svelte     | 50 +++++++++++++------
 2 files changed, 39 insertions(+), 15 deletions(-)

diff --git a/packages/web/src/appobj/DatabaseObjectAppObject.svelte b/packages/web/src/appobj/DatabaseObjectAppObject.svelte
index d6a4bafc..1398cb8e 100644
--- a/packages/web/src/appobj/DatabaseObjectAppObject.svelte
+++ b/packages/web/src/appobj/DatabaseObjectAppObject.svelte
@@ -722,4 +722,8 @@
   on:click={() => handleClick()}
   on:middleclick={() => handleClick(true)}
   on:expand
+  on:dragstart
+  on:dragenter
+  on:dragend
+  on:drop
 />
diff --git a/packages/web/src/appobj/PinnedAppObject.svelte b/packages/web/src/appobj/PinnedAppObject.svelte
index 8fd7683a..ebca63ce 100644
--- a/packages/web/src/appobj/PinnedAppObject.svelte
+++ b/packages/web/src/appobj/PinnedAppObject.svelte
@@ -10,19 +10,43 @@
   };
 
   function dragExchange(dragged, data, pinned, setPinned, compare) {
-
+    if (!compare(dragged, data)) {
+      const i1 = _.findIndex(pinned, x => compare(x, dragged));
+      const i2 = _.findIndex(pinned, x => compare(x, data));
+      const newPinned = [...pinned];
+      const tmp = newPinned[i1];
+      newPinned[i1] = newPinned[i2];
+      newPinned[i2] = tmp;
+      setPinned(newPinned);
+    }
   }
 </script>
 
 <script lang="ts">
-  import _ from 'lodash';
-  import { draggedPinnedObject, pinnedDatabases } from '../stores';
+  import _, { values } from 'lodash';
+  import { draggedPinnedObject, pinnedDatabases, pinnedTables } from '../stores';
 
   export let data;
 </script>
 
 {#if data.objectTypeField}
-  <DatabaseObjectAppObject {...$$props} 
+  <DatabaseObjectAppObject
+    {...$$props}
+    on:dragstart={() => {
+      $draggedPinnedObject = data;
+    }}
+    on:dragenter={e => {
+      dragExchange(
+        $draggedPinnedObject,
+        data,
+        $pinnedTables,
+        value => ($pinnedTables = value),
+        (a, b) => a?.pureName == b?.pureName && a?.schemaName == b?.schemaName
+      );
+    }}
+    on:dragend={() => {
+      $draggedPinnedObject = null;
+    }}
   />
 {:else}
   <DatabaseAppObject
@@ -31,17 +55,13 @@
       $draggedPinnedObject = data;
     }}
     on:dragenter={e => {
-      const dragged = $draggedPinnedObject;
-      if (dragged?.connection?._id != data?.connection?._id || dragged?.name != data?.name) {
-        const dbs = $pinnedDatabases;
-        const i1 = _.findIndex(dbs, x => x?.name == dragged?.name && x?.connection?._id == dragged?.connection?._id);
-        const i2 = _.findIndex(dbs, x => x?.name == data?.name && x?.connection?._id == data?.connection?._id);
-        const newDbs = [...dbs];
-        const tmp = newDbs[i1];
-        newDbs[i1] = newDbs[i2];
-        newDbs[i2] = tmp;
-        $pinnedDatabases = newDbs;
-      }
+      dragExchange(
+        $draggedPinnedObject,
+        data,
+        $pinnedDatabases,
+        value => ($pinnedDatabases = value),
+        (a, b) => a?.name == b?.name && a?.connection?._id == b?.connection?._id
+      );
     }}
     on:dragend={() => {
       $draggedPinnedObject = null;