Refactoring: move some loading logic into svelte element

src/UI/SingleThemeGui.svelte

@@ -0,0 +1,64 @@
+<script lang="ts">/**
+ * Wrapper around 'ThemeViewGui', which is responsible for some boiler plate things, such as:
+ *
+ * - Checking for WebGL support
+ * - Loading the available layers
+ * - ...
+ */
+import ThemeViewGUI from "./ThemeViewGUI.svelte"
+import Constants from "../Models/Constants.js"
+import { Utils } from "../Utils.js"
+import { UIEventSource } from "../Logic/UIEventSource"
+import { WithSearchState } from "../Models/ThemeViewState/WithSearchState"
+import { ThemeConfigJson } from "../Models/ThemeConfig/Json/ThemeConfigJson"
+import ThemeConfig from "../Models/ThemeConfig/ThemeConfig"
+
+function webgl_support() {
+  try {
+    const canvas = document.createElement("canvas")
+    if (
+      !!window.WebGLRenderingContext &&
+      (canvas.getContext("webgl") || canvas.getContext("experimental-webgl"))
+    ) {
+      return true
+    }
+  } catch (e) {
+    return false
+  }
+}
+
+
+async function getAvailableLayers(): Promise<Set<string>> {
+  if (!Constants.SummaryServer) {
+    return new Set<string>()
+  }
+  try {
+    const host = new URL(Constants.SummaryServer).host
+    const status: { layers: string[] } = await Promise.any([
+      Utils.downloadJson<{ layers }>("https://" + host + "/summary/status.json"),
+      Utils.waitFor(2500, { layers: [] })
+    ])
+    return new Set<string>(status.layers)
+  } catch (e) {
+    console.error("Could not get MVT available layers due to", e)
+    return new Set<string>()
+  }
+}
+
+export let theme: ThemeConfig
+
+let webgl_supported = webgl_support()
+
+let availableLayers = UIEventSource.FromPromise(getAvailableLayers())
+const state = new WithSearchState(theme, availableLayers)
+
+</script>
+
+{#if !webgl_supported}
+  <div class="alert w-full h-full justify-center items-center m-8">WebGL is not supported or not enabled. This is
+    essential
+    for MapComplete to function, please enable this.
+  </div>
+{:else}
+  <ThemeViewGUI {state} />
+{/if}