license checking

packages/web/src/ErrorPage.svelte

@@ -0,0 +1,85 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import { useConfig } from './utility/metadataLoaders';
+  import ErrorInfo from './elements/ErrorInfo.svelte';
+  import Link from './elements/Link.svelte';
+
+  const config = useConfig();
+
+  onMount(() => {
+    const removed = document.getElementById('starting_dbgate_zero');
+    if (removed) removed.remove();
+  });
+</script>
+
+<div class="root theme-light theme-type-light">
+  <div class="text">DbGate</div>
+  <div class="wrap">
+    <div class="logo">
+      <img class="img" src="logo192.png" />
+    </div>
+    <div class="box">
+      <div class="heading">Configuration error</div>
+      {#if !$config?.isLicenseValid}
+        <ErrorInfo message="Invalid license, please set DBGATE_LICENSE environment variable" />
+      {:else}
+        <ErrorInfo message="No error found, try to open app again" />
+        <Link href="?">Back to app</Link>
+      {/if}
+    </div>
+  </div>
+</div>
+
+<style>
+  .logo {
+    display: flex;
+    margin-bottom: 1rem;
+    align-items: center;
+    justify-content: center;
+  }
+  .img {
+    width: 80px;
+  }
+  .text {
+    position: fixed;
+    top: 1rem;
+    left: 1rem;
+    font-size: 30pt;
+    font-family: monospace;
+    color: var(--theme-bg-2);
+    text-transform: uppercase;
+  }
+
+  .root {
+    color: var(--theme-font-1);
+    display: flex;
+    justify-content: center;
+    background-color: var(--theme-bg-1);
+    align-items: baseline;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+
+  .box {
+    width: 600px;
+    max-width: 80vw;
+    /* max-width: 600px;
+      width: 40vw; */
+    border: 1px solid var(--theme-border);
+    border-radius: 4px;
+    background-color: var(--theme-bg-0);
+  }
+
+  .wrap {
+    margin-top: 20vh;
+  }
+
+  .heading {
+    text-align: center;
+    margin: 1em;
+    font-size: xx-large;
+  }
+</style>

packages/web/src/clientAuth.ts

@@ -41,6 +41,10 @@ export function handleOauthCallback() {
 }
 
 export async function handleAuthOnStartup(config, isAdminPage = false) {
+  if (!config.isLicenseValid) {
+    internalRedirectTo(`?page=error`);
+  }
+
   if (config.isAdminLoginForm && isAdminPage) {
     if (localStorage.getItem('adminAccessToken')) {
       return;

packages/web/src/main.ts

@@ -6,6 +6,7 @@ import localStorageGarbageCollector from './utility/localStorageGarbageCollector
 import { handleOauthCallback } from './clientAuth';
 import LoginPage from './LoginPage.svelte';
 import NotLoggedPage from './NotLoggedPage.svelte';
+import ErrorPage from './ErrorPage.svelte';
 
 const isOauthCallback = handleOauthCallback();
 
@@ -22,6 +23,13 @@ function createApp() {
   switch (page) {
     case 'login':
       return new LoginPage({
+        target: document.body,
+        props: {
+          isAdminPage: false,
+        },
+      });
+    case 'error':
+      return new ErrorPage({
         target: document.body,
         props: {},
       });