conection - extinfo

packages/web/src/appobj/ConnectionAppObject.svelte

@@ -1,13 +1,29 @@
 <script lang="ts">
   import _ from 'lodash';
   import AppObjectCore from './AppObjectCore.svelte';
-  import { currentDatabase, openedConnections } from '../stores';
+  import { currentDatabase, extensions, openedConnections } from '../stores';
 
   export let commonProps;
   export let data;
 
   let statusIcon = null;
   let statusTitle = null;
+  let extInfo = null;
+  let engineStatusIcon = null;
+  let engineStatusTitle = null;
+
+  $: {
+    if ($extensions.drivers.find(x => x.engine == data.engine)) {
+      const match = (data.engine || '').match(/^([^@]*)@/);
+      extInfo = match ? match[1] : data.engine;
+      engineStatusIcon = null;
+      engineStatusTitle = null;
+    } else {
+      extInfo = data.engine;
+      engineStatusIcon = 'img warn';
+      engineStatusTitle = `Engine driver ${data.engine} not found, review installed plugins and change engine in edit connection dialog`;
+    }
+  }
 
   $: {
     const { _id, status } = data;
@@ -21,7 +37,6 @@
       }
     }
   }
-
 </script>
 
 <AppObjectCore
@@ -29,8 +44,9 @@
   title={data.displayName || data.server}
   icon="img server"
   isBold={_.get($currentDatabase, 'connection._id') == data._id}
-  statusIcon={statusIcon}
+  statusIcon={statusIcon || engineStatusIcon}
-  statusTitle={statusTitle}
+  statusTitle={statusTitle || engineStatusTitle}
+  {extInfo}
   on:click
   on:click={() => ($openedConnections = _.uniq([...$openedConnections, data._id]))}
 />