diff --git a/packages/web/package.json b/packages/web/package.json
index 68cc3355..db5bf250 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -28,6 +28,7 @@
     "uuid": "^3.4.0",
     "json-stable-stringify": "^1.0.1",
     "localforage": "^1.9.0",
+    "dbgate-types": "^3.9.5",
     "lodash": "^4.17.15"
   },
   "dependencies": {
diff --git a/packages/web/src/appobj/AppObjectCore.svelte b/packages/web/src/appobj/AppObjectCore.svelte
index 7a0a23a5..d89cc1f8 100644
--- a/packages/web/src/appobj/AppObjectCore.svelte
+++ b/packages/web/src/appobj/AppObjectCore.svelte
@@ -11,7 +11,7 @@
   export let extInfo;
 </script>
 
-<div class="main" class:isBold draggable>
+<div class="main" class:isBold draggable on:click>
   {prefix || ''}
   {#if isBusy}
     <FontIcon icon="icon loading" />
diff --git a/packages/web/src/appobj/ConnectionAppObject.svelte b/packages/web/src/appobj/ConnectionAppObject.svelte
index 121e01c1..7085106d 100644
--- a/packages/web/src/appobj/ConnectionAppObject.svelte
+++ b/packages/web/src/appobj/ConnectionAppObject.svelte
@@ -1,9 +1,28 @@
 <script lang="ts">
+  import _ from 'lodash';
   import AppObjectCore from './AppObjectCore.svelte';
+  import { currentDatabase, openedConnections } from '../stores';
 
   export let commonProps;
   export let data;
 
+  function getStatusIcon(opened) {
+    const { _id, status } = data;
+    if (opened.includes(_id)) {
+      if (!status) return 'icon loading';
+      if (status.name == 'pending') return 'icon loading';
+      if (status.name == 'ok') return 'img ok';
+      return 'img error';
+    }
+  }
 </script>
 
-<AppObjectCore {...commonProps} title={data.displayName || data.server} icon="img server" />
+<AppObjectCore
+  {...commonProps}
+  title={data.displayName || data.server}
+  icon="img server"
+  isBold={_.get($currentDatabase, 'connection._id') == data._id}
+  statusIcon={getStatusIcon($openedConnections)}
+  statusTitle={data.status && data.status.name == 'error' ? data.status.message : null}
+  on:click={() => ($openedConnections = _.uniq([...$openedConnections, data._id]))}
+/>
diff --git a/packages/web/src/main.ts b/packages/web/src/main.ts
index cfdcfde6..4d5a7685 100644
--- a/packages/web/src/main.ts
+++ b/packages/web/src/main.ts
@@ -1,4 +1,5 @@
 import App from './App.svelte';
+import './utility/connectionsPinger';
 
 const app = new App({
   target: document.body,
diff --git a/packages/web/src/utility/connectionsPinger.js b/packages/web/src/utility/connectionsPinger.js
new file mode 100644
index 00000000..903c4b8f
--- /dev/null
+++ b/packages/web/src/utility/connectionsPinger.js
@@ -0,0 +1,29 @@
+import _ from 'lodash';
+import { openedConnections, currentDatabase } from '../stores';
+import axios from './axios';
+
+const doServerPing = value => {
+  axios.post('server-connections/ping', { connections: value });
+};
+
+const doDatabasePing = value => {
+  const database = _.get(value, 'name');
+  const conid = _.get(value, 'connection._id');
+  if (conid && database) {
+    axios.post('database-connections/ping', { conid, database });
+  }
+};
+
+let openedConnectionsHandle = null;
+openedConnections.subscribe(value => {
+  doServerPing(value);
+  if (openedConnectionsHandle) window.clearInterval(openedConnectionsHandle);
+  openedConnectionsHandle = window.setInterval(() => doServerPing(value), 30 * 1000);
+});
+
+let currentDatabaseHandle = null;
+currentDatabase.subscribe(value => {
+  doDatabasePing(value);
+  if (currentDatabaseHandle) window.clearInterval(currentDatabaseHandle);
+  currentDatabaseHandle = window.setInterval(() => doDatabasePing(value), 30 * 1000);
+});
diff --git a/packages/web/src/utility/metadataLoaders.ts b/packages/web/src/utility/metadataLoaders.ts
index c5339c15..195a71c3 100644
--- a/packages/web/src/utility/metadataLoaders.ts
+++ b/packages/web/src/utility/metadataLoaders.ts
@@ -5,19 +5,20 @@ import stableStringify from 'json-stable-stringify';
 import { cacheClean } from './cache';
 import socket from './socket';
 import getAsArray from './getAsArray';
+import { DatabaseInfo } from 'dbgate-types';
 
 const databaseInfoLoader = ({ conid, database }) => ({
   url: 'database-connections/structure',
   params: { conid, database },
   reloadTrigger: `database-structure-changed-${conid}-${database}`,
-  transform: db => {
+  transform: (db: DatabaseInfo) => {
     const allForeignKeys = _.flatten(db.tables.map(x => x.foreignKeys));
     return {
       ...db,
       tables: db.tables.map(table => ({
         ...table,
         dependencies: allForeignKeys.filter(
-          (x: any) => x.refSchemaName == table.schemaName && x.refTableName == table.pureName
+          x => x.refSchemaName == table.schemaName && x.refTableName == table.pureName
         ),
       })),
     };
diff --git a/packages/web/tsconfig.json b/packages/web/tsconfig.json
index 784d828f..c5692954 100644
--- a/packages/web/tsconfig.json
+++ b/packages/web/tsconfig.json
@@ -2,5 +2,14 @@
   // "extends": "@tsconfig/svelte/tsconfig.json",
 
   "include": ["src/**/*"],
-  "exclude": ["node_modules/*", "public/*"]
-}
\ No newline at end of file
+  "exclude": ["node_modules/*", "public/*"],
+
+  "compilerOptions": {
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "noImplicitAny": false,
+    "strictNullChecks": false,
+    "strict": false
+  }
+}