bullet-proof login ux

src/App.svelte

@@ -12,12 +12,10 @@
   import Login from "./Login.svelte";
   import Settings from "./Settings.svelte";
   export let settings_open = false;
-  $: is_configured =
-    $apikey &&
-    $apikey !== "null" &&
-    $apikey !== "" &&
-    $laptime_track != 0 &&
-    $laptime_track != null;
+  $: is_configured = $apikey?.length === 44 && $api_endpoint?.includes("://");
+  // &&
+  // $laptime_track != 0 &&
+  // $laptime_track != null;
   init({
     fallbackLocale: "en-US",
     initialLocale: $lang,

src/Login.svelte

@@ -62,7 +62,7 @@
           </div>
         {/if}
       {/if}
-      {#if $api_endpoint && !$apikey}
+      {#if $api_endpoint?.includes("://") && (!$apikey || $apikey == null)}
         <form
           class="flex flex-col pt-3 md:pt-8"
           onsubmit="event.preventDefault();"
@@ -117,6 +117,9 @@
           class="flex flex-col pt-3 md:pt-8"
           onsubmit="event.preventDefault();"
           on:submit={() => {
+            if (api_endpoint_input.includes("api/")) {
+              api_endpoint_input = api_endpoint_input.replace("api/", "");
+            }
             if (api_endpoint_input.substr(-1) !== "/") {
               api_endpoint_input = api_endpoint_input + "/";
             }

src/store.js

@@ -1,29 +1,39 @@
 import { writable } from 'svelte/store';
 
-const stored_api_endpoint = localStorage.getItem('api_endpoint')||"";
+const stored_api_endpoint = localStorage.getItem('api_endpoint');
 export const api_endpoint = writable(stored_api_endpoint);
 api_endpoint.subscribe((value) => {
-	localStorage.setItem('api_endpoint', value);
+	if (value != null) {
+		localStorage.setItem('api_endpoint', value);
+	}
 });
 const stored_apikey = localStorage.getItem('apikey');
 export const apikey = writable(stored_apikey);
 apikey.subscribe((value) => {
-	localStorage.setItem('apikey', value);
+	if (value != null) {
+		localStorage.setItem('apikey', value);
+	}
 });
 const stored_laptime_track = localStorage.getItem('laptime_track');
 export const laptime_track = writable(stored_laptime_track);
 laptime_track.subscribe((value) => {
-	localStorage.setItem('laptime_track', value);
+	if (value != null) {
+		localStorage.setItem('laptime_track', value);
+	}
 });
 const stored_lang = localStorage.getItem('lang') === 'null' ? navigator.language : localStorage.getItem('lang');
 export const lang = writable(stored_lang);
 lang.subscribe((value) => {
-	localStorage.setItem('lang', value);
+	if (value != null) {
+		localStorage.setItem('lang', value);
+	}
 });
 
-export function clear(){
+export function clear() {
 	api_endpoint.set(null)
+	api_endpoint.set("")
 	apikey.set(null);
+	apikey.set("");
 	laptime_track.set(null)
 	localStorage.clear();
 }