implemented middle click in connection tree

packages/web/src/appobj/AppObjectCore.svelte

@@ -38,6 +38,14 @@
     }
   }
 
+  function handleMouseUp(e) {
+    if (e.button == 1) {
+      dispatch('middleclick');
+      e.preventDefault();
+      e.stopPropagation();
+    }
+  }
+
   function setChecked(value) {
     if (!value && isChecked) {
       checkedObjectsStore.update(x => x.filter(y => module.extractKey(data) != module.extractKey(y)));
@@ -53,6 +61,7 @@
   class:isBold
   draggable={true}
   on:click={handleClick}
+  on:mouseup={handleMouseUp}
   use:contextMenu={disableContextMenu ? null : menu}
   on:dragstart={e => {
     e.dataTransfer.setData('app_object_drag_data', JSON.stringify(data));

packages/web/src/appobj/ConnectionAppObject.svelte

@@ -190,4 +190,11 @@
   on:click={handleConnect}
   on:click
   on:expand
+  on:middleclick={() => {
+    if (data.singleDatabase) {
+      getDatabaseMenuItems(data, data.defaultDatabase, $extensions, $currentDatabase)
+        .find(x => x.isNewQuery)
+        .onClick();
+    }
+  }}
 />

packages/web/src/appobj/DatabaseAppObject.svelte

@@ -54,7 +54,7 @@
     };
 
     return [
-      { onClick: handleNewQuery, text: 'New query' },
+      { onClick: handleNewQuery, text: 'New query', isNewQuery: true },
       { onClick: handleImport, text: 'Import' },
       { onClick: handleExport, text: 'Export' },
       { onClick: handleSqlGenerator, text: 'SQL Generator' },
@@ -68,7 +68,7 @@
 <script lang="ts">
   import getConnectionLabel from '../utility/getConnectionLabel';
 
-  import _ from 'lodash';
+  import _, { find } from 'lodash';
   import ImportExportModal from '../modals/ImportExportModal.svelte';
   import { showModal } from '../modals/modalTools';
   import SqlGeneratorModal from '../modals/SqlGeneratorModal.svelte';
@@ -93,5 +93,10 @@
   isBold={_.get($currentDatabase, 'connection._id') == _.get(data.connection, '_id') &&
     _.get($currentDatabase, 'name') == data.name}
   on:click={() => ($currentDatabase = data)}
+  on:middleclick={() => {
+    createMenu()
+      .find(x => x.isNewQuery)
+      .onClick();
+  }}
   menu={createMenu}
 />

packages/web/src/appobj/DatabaseObjectAppObject.svelte

@@ -328,7 +328,6 @@
       { forceNewTab }
     );
   }
-
 </script>
 
 <script lang="ts">
@@ -351,7 +350,7 @@
 
   export let data;
 
-  function handleClick() {
+  function handleClick(forceNewTab = false) {
     const { schemaName, pureName, conid, database, objectTypeField } = data;
 
     openDatabaseObjectDetail(
@@ -364,7 +363,7 @@
         database,
         objectTypeField,
       },
-      false,
+      forceNewTab,
       null
     );
 
@@ -508,7 +507,6 @@
         };
       });
   }
-
 </script>
 
 <AppObjectCore
@@ -518,6 +516,7 @@
   title={data.schemaName ? `${data.schemaName}.${data.pureName}` : data.pureName}
   icon={icons[data.objectTypeField]}
   menu={createMenu}
-  on:click={handleClick}
+  on:click={() => handleClick()}
+  on:middleclick={() => handleClick(true)}
   on:expand
 />