From fdd5feac9249e2fc7aa54b68ba4879f225eae545 Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Wed, 18 Sep 2024 00:24:54 +0600
Subject: [PATCH] web: use turnstile & session only when the processing
 instance has them

now also always fetching server info in the save tab
---
 web/src/components/misc/Turnstile.svelte |  6 +++---
 web/src/components/save/Omnibox.svelte   |  6 ++++--
 web/src/lib/api/api.ts                   | 12 +++++++-----
 web/src/lib/env.ts                       |  1 -
 web/src/lib/types/api.ts                 |  1 +
 web/src/routes/+layout.svelte            | 11 +++++++++--
 6 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/web/src/components/misc/Turnstile.svelte b/web/src/components/misc/Turnstile.svelte
index 29914995..f1c9b625 100644
--- a/web/src/components/misc/Turnstile.svelte
+++ b/web/src/components/misc/Turnstile.svelte
@@ -1,14 +1,14 @@
 <script lang="ts">
-    import env from "$lib/env";
     import { onMount } from "svelte";
 
+    import { cachedInfo } from "$lib/api/server-info";
     import { turnstileLoaded, turnstileCreated } from "$lib/state/turnstile";
 
     let turnstileElement: HTMLElement;
     let turnstileScript: HTMLElement;
 
     onMount(() => {
-        const sitekey = env.TURNSTILE_KEY;
+        const sitekey = $cachedInfo?.info?.cobalt?.turnstileSitekey;
         if (!sitekey) return;
 
         $turnstileCreated = true;
@@ -17,7 +17,7 @@
             window.turnstile?.render(turnstileElement, {
                 sitekey,
                 "error-callback": (error) => {
-                    console.log("turnstile error code:", error);
+                    console.log("error code from turnstile:", error);
                     return true;
                 },
                 callback: () => {
diff --git a/web/src/components/save/Omnibox.svelte b/web/src/components/save/Omnibox.svelte
index d73b9474..c641fc71 100644
--- a/web/src/components/save/Omnibox.svelte
+++ b/web/src/components/save/Omnibox.svelte
@@ -4,12 +4,12 @@
     import { browser } from "$app/environment";
     import { SvelteComponent, tick } from "svelte";
 
-    import env from "$lib/env";
     import { t } from "$lib/i18n/translations";
 
     import dialogs from "$lib/dialogs";
 
     import { link } from "$lib/state/omnibox";
+    import { cachedInfo } from "$lib/api/server-info";
     import { updateSetting } from "$lib/state/settings";
     import { turnstileLoaded } from "$lib/state/turnstile";
 
@@ -57,7 +57,9 @@
         goto("/", { replaceState: true });
     }
 
-    $: if (env.TURNSTILE_KEY) {
+    // FIXME: figure out why regular processing spinner
+    // doesn't show up after turnstile loads
+    $: if ($cachedInfo?.info?.cobalt?.turnstileSitekey) {
         if ($turnstileLoaded) {
             isDisabled = false;
         } else {
diff --git a/web/src/lib/api/api.ts b/web/src/lib/api/api.ts
index 74993a90..69ed0691 100644
--- a/web/src/lib/api/api.ts
+++ b/web/src/lib/api/api.ts
@@ -1,12 +1,15 @@
 import { get } from "svelte/store";
 
 import settings from "$lib/state/settings";
+import lazySettingGetter from "$lib/settings/lazy-get";
+
 import { getSession } from "$lib/api/session";
 import { currentApiURL } from "$lib/api/api-url";
+import { cachedInfo } from "$lib/api/server-info";
 import { apiOverrideWarning } from "$lib/api/safety-warning";
+
 import type { Optional } from "$lib/types/generic";
 import type { CobaltAPIResponse, CobaltErrorResponse } from "$lib/types/api";
-import lazySettingGetter from "$lib/settings/lazy-get";
 
 const request = async (url: string) => {
     const getSetting = lazySettingGetter(get(settings));
@@ -34,11 +37,10 @@ const request = async (url: string) => {
 
     await apiOverrideWarning();
 
-    const usingCustomInstance = getSetting("processing", "enableCustomInstances")
-                                && getSetting("processing", "customInstanceURL");
     const api = currentApiURL();
-    // FIXME: rewrite this to allow custom instances to specify their own turnstile tokens
-    const session = usingCustomInstance ? undefined : await getSession();
+
+    const session = get(cachedInfo)?.info?.cobalt?.turnstileSitekey
+                    ? await getSession() : undefined;
 
     let extraHeaders = {}
 
diff --git a/web/src/lib/env.ts b/web/src/lib/env.ts
index 734f482d..53b93a34 100644
--- a/web/src/lib/env.ts
+++ b/web/src/lib/env.ts
@@ -14,7 +14,6 @@ const variables = {
     PLAUSIBLE_HOST: getEnv('PLAUSIBLE_HOST'),
     PLAUSIBLE_ENABLED: getEnv('HOST') && getEnv('PLAUSIBLE_HOST'),
     DEFAULT_API: getEnv('DEFAULT_API'),
-    TURNSTILE_KEY: getEnv('TURNSTILE_KEY'),
 }
 
 const contacts = {
diff --git a/web/src/lib/types/api.ts b/web/src/lib/types/api.ts
index 4df054aa..e7e4307d 100644
--- a/web/src/lib/types/api.ts
+++ b/web/src/lib/types/api.ts
@@ -51,6 +51,7 @@ export type CobaltServerInfo = {
         url: string,
         startTime: string,
         durationLimit: number,
+        turnstileSitekey?: string,
         services: string[]
     },
     git: {
diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index 5263ffa2..340f456c 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -7,6 +7,7 @@
     import { updated } from "$app/stores";
     import { browser } from "$app/environment";
     import { afterNavigate } from "$app/navigation";
+    import { getServerInfo, cachedInfo } from "$lib/api/server-info";
 
     import "$lib/polyfills";
     import env from "$lib/env";
@@ -31,10 +32,16 @@
         $settings.appearance.reduceTransparency ||
         device.prefers.reducedTransparency;
 
-    afterNavigate(() => {
+    $: spawnTurnstile = !!$cachedInfo?.info?.cobalt?.turnstileSitekey;
+
+    afterNavigate(async() => {
         const to_focus: HTMLElement | null =
             document.querySelector("[data-first-focus]");
         to_focus?.focus();
+
+        if ($page.url.pathname === "/") {
+            await getServerInfo();
+        }
     });
 </script>
 
@@ -77,7 +84,7 @@
         <DialogHolder />
         <Sidebar />
         <div id="content">
-            {#if (env.TURNSTILE_KEY && $page.url.pathname === "/") || $turnstileCreated}
+            {#if (spawnTurnstile && $page.url.pathname === "/") || $turnstileCreated}
                 <Turnstile />
             {/if}
             <slot></slot>