fixed race conditions when starting app

packages/web/src/App.svelte

@@ -1,25 +1,47 @@
 <script lang="ts">
+  import { onMount } from 'svelte';
+
   import CommandListener from './commands/CommandListener.svelte';
   import DataGridRowHeightMeter from './datagrid/DataGridRowHeightMeter.svelte';
   import LoadingInfo from './elements/LoadingInfo.svelte';
 
   import PluginsProvider from './plugins/PluginsProvider.svelte';
   import Screen from './Screen.svelte';
+  import { setAppLoaded } from './utility/appLoadManager';
+  import axiosInstance from './utility/axiosInstance';
   import ErrorHandler from './utility/ErrorHandler.svelte';
-  import { useSettings } from './utility/metadataLoaders';
   import OpenTabsOnStartup from './utility/OpenTabsOnStartup.svelte';
 
-  const settings = useSettings();
+  let loaded = false;
+
+  async function loadSettings() {
+    try {
+      const settings = await axiosInstance.get('config/get-settings');
+      const connections = await axiosInstance.get('connections/list');
+      const config = await axiosInstance.get('config/get');
+      loaded = settings?.data && connections?.data && config?.data;
+      if (loaded) {
+        setAppLoaded();
+      }
+    } catch (err) {
+      console.log('Error loading settings, trying again in 1s');
+      setTimeout(loadSettings, 1000);
+    }
+  }
+
+  onMount(loadSettings);
+
 </script>
 
 <DataGridRowHeightMeter />
 <ErrorHandler />
-<PluginsProvider />
 <CommandListener />
-<OpenTabsOnStartup />
 
-{#if $settings}
+{#if loaded}
+  <PluginsProvider />
+  <OpenTabsOnStartup />
+
   <Screen />
 {:else}
-  <LoadingInfo message="Loading settings..." wrapper />
+  <LoadingInfo message="Starting DbGate API..." wrapper />
 {/if}

packages/web/src/utility/appLoadManager.ts

@@ -0,0 +1,22 @@
+let appIsLoaded = false;
+let onLoad = [];
+
+export function setAppLoaded() {
+  appIsLoaded = true;
+  for (const func of onLoad) {
+    func();
+  }
+  onLoad = [];
+}
+
+export function getAppLoaded() {
+  return appIsLoaded;
+}
+
+export function callWhenAppLoaded(callback) {
+  if (appIsLoaded) {
+    callback();
+  } else {
+    onLoad.push(callback);
+  }
+}

packages/web/src/utility/changeCurrentDbByTab.ts

@@ -1,10 +1,11 @@
 import _ from 'lodash';
 import { currentDatabase, openedTabs } from '../stores';
+import { callWhenAppLoaded } from './appLoadManager';
 import { getConnectionInfo } from './metadataLoaders';
 
 let lastCurrentTab = null;
 
-openedTabs.subscribe(async value => {
+openedTabs.subscribe(value => {
   const newCurrentTab = (value || []).find(x => x.selected);
   if (newCurrentTab == lastCurrentTab) return;
 
@@ -15,11 +16,14 @@ openedTabs.subscribe(async value => {
       database &&
       (conid != _.get(lastCurrentTab, 'props.conid') || database != _.get(lastCurrentTab, 'props.database'))
     ) {
-      const connection = await getConnectionInfo({ conid });
-      currentDatabase.set({
-        connection,
-        name: database,
-      });
+      const doWork = async () => {
+        const connection = await getConnectionInfo({ conid });
+        currentDatabase.set({
+          connection,
+          name: database,
+        });
+      };
+      callWhenAppLoaded(doWork);
     }
   }