license refactor WIP

packages/web/src/EnterLicensePage.svelte

@@ -0,0 +1,114 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import { useConfig } from './utility/metadataLoaders';
+  import ErrorInfo from './elements/ErrorInfo.svelte';
+  import Link from './elements/Link.svelte';
+  import { internalRedirectTo } from './clientAuth';
+  import TextAreaField from './forms/TextAreaField.svelte';
+  import { writable } from 'svelte/store';
+  import FormProviderCore from './forms/FormProviderCore.svelte';
+  import FormTextAreaField from './forms/FormTextAreaField.svelte';
+  import FormSubmit from './forms/FormSubmit.svelte';
+  import { apiCall } from './utility/api';
+
+  const config = useConfig();
+  const values = writable({ amoid: null, databaseServer: null });
+
+  const params = new URLSearchParams(location.search);
+  const error = params.get('error');
+
+  onMount(() => {
+    const removed = document.getElementById('starting_dbgate_zero');
+    if (removed) removed.remove();
+  });
+</script>
+
+<FormProviderCore {values}>
+  <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">License</div>
+        <FormTextAreaField label="License key" name="licenseKey" rows={5} />
+
+        <div class="submit">
+          <FormSubmit
+            value="Save license"
+            on:click={async e => {
+              const { licenseKey } = e.detail;
+              await apiCall('config/save-license-key', { licenseKey });
+              internalRedirectTo('/');
+            }}
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</FormProviderCore>
+
+<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;
+  }
+
+  .submit {
+    margin: var(--dim-large-form-margin);
+    display: flex;
+  }
+
+  .submit :global(input) {
+    flex: 1;
+    font-size: larger;
+  }
+</style>

packages/web/src/clientAuth.ts

@@ -2,6 +2,7 @@ import { ca } from 'date-fns/locale';
 import { apiCall, enableApi, getAuthCategory } from './utility/api';
 import { getConfig } from './utility/metadataLoaders';
 import { isAdminPage } from './utility/pageDefs';
+import getElectron from './utility/getElectron';
 
 export function isOauthCallback() {
   const params = new URLSearchParams(location.search);
@@ -117,11 +118,19 @@ export function handleOauthCallback() {
 }
 
 export async function handleAuthOnStartup(config, isAdminPage = false) {
-  if (!config.isLicenseValid || config.configurationError) {
+  if (config.configurationError) {
     internalRedirectTo(`/?page=error`);
     return;
   }
 
+  if (!config.isLicenseValid) {
+    if (config.storageDatabase || getElectron()) {
+      internalRedirectTo(`/?page=license`);
+    } else {
+      internalRedirectTo(`/?page=error`);
+    }
+  }
+
   if (getAuthCategory(config) == 'admin') {
     if (localStorage.getItem('adminAccessToken')) {
       return;

packages/web/src/main.ts

@@ -7,6 +7,7 @@ import { handleOauthCallback } from './clientAuth';
 import LoginPage from './LoginPage.svelte';
 import NotLoggedPage from './NotLoggedPage.svelte';
 import ErrorPage from './ErrorPage.svelte';
+import EnterLicensePage from './EnterLicensePage.svelte';
 
 const params = new URLSearchParams(location.search);
 const page = params.get('page');
@@ -15,7 +16,6 @@ const isOauthCallback = handleOauthCallback();
 
 localStorageGarbageCollector();
 
-
 function createApp() {
   if (isOauthCallback) {
     return null;
@@ -34,6 +34,11 @@ function createApp() {
         target: document.body,
         props: {},
       });
+    case 'license':
+      return new EnterLicensePage({
+        target: document.body,
+        props: {},
+      });
     case 'admin-login':
       return new LoginPage({
         target: document.body,

packages/web/src/settings/SettingsModal.svelte

@@ -31,6 +31,8 @@
   import { isMac } from '../utility/common';
   import getElectron from '../utility/getElectron';
   import ThemeSkeleton from './ThemeSkeleton.svelte';
+  import { isProApp } from '../utility/proTools';
+  import FormTextAreaField from '../forms/FormTextAreaField.svelte';
 
   const electron = getElectron();
   let restartWarning = false;
@@ -70,6 +72,7 @@ ORDER BY
         isInline
         tabs={[
           { label: 'General', slot: 1 },
+          isProApp() && { label: 'License', slot: 7 },
           { label: 'Connection', slot: 2 },
           { label: 'Themes', slot: 3 },
           { label: 'Default Actions', slot: 4 },
@@ -317,11 +320,12 @@ ORDER BY
         <svelte:fragment slot="6">
           <div class="heading">Other</div>
 
-          <FormTextField
-            name="other.gistCreateToken"
-            label="API token for creating error gists"
-            defaultValue=""
-          />
+          <FormTextField name="other.gistCreateToken" label="API token for creating error gists" defaultValue="" />
+        </svelte:fragment>
+
+        <svelte:fragment slot="7">
+          <div class="heading">License</div>
+          <FormTextAreaField name="other.licenseKey" label="License key" rows={5} />
         </svelte:fragment>
       </TabControl>
     </FormValues>

packages/web/src/utility/proTools.ts

@@ -0,0 +1,3 @@
+export function isProApp() {
+  return false;
+}