From 49460bd16d18a40855fc88cca7bf2359009dffb7 Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Thu, 5 Sep 2024 00:04:41 +0600
Subject: [PATCH] web: load turnstile only in save tab and only once

turnstile will stay in background after being loaded once (just like before), but now it will not load on pages other than save if they are opened first
---
 web/src/components/misc/Turnstile.svelte |  5 ++++-
 web/src/lib/state/turnstile.ts           |  1 +
 web/src/routes/+layout.svelte            | 25 +++++++++++++-----------
 3 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/web/src/components/misc/Turnstile.svelte b/web/src/components/misc/Turnstile.svelte
index d4d872e8..29914995 100644
--- a/web/src/components/misc/Turnstile.svelte
+++ b/web/src/components/misc/Turnstile.svelte
@@ -2,7 +2,7 @@
     import env from "$lib/env";
     import { onMount } from "svelte";
 
-    import { turnstileLoaded } from "$lib/state/turnstile";
+    import { turnstileLoaded, turnstileCreated } from "$lib/state/turnstile";
 
     let turnstileElement: HTMLElement;
     let turnstileScript: HTMLElement;
@@ -10,6 +10,9 @@
     onMount(() => {
         const sitekey = env.TURNSTILE_KEY;
         if (!sitekey) return;
+
+        $turnstileCreated = true;
+
         const setup = () => {
             window.turnstile?.render(turnstileElement, {
                 sitekey,
diff --git a/web/src/lib/state/turnstile.ts b/web/src/lib/state/turnstile.ts
index 02d32b15..5a165bc7 100644
--- a/web/src/lib/state/turnstile.ts
+++ b/web/src/lib/state/turnstile.ts
@@ -1,3 +1,4 @@
 import { writable } from "svelte/store";
 
 export const turnstileLoaded = writable(false);
+export const turnstileCreated = writable(false);
diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index 645ee57c..908a5e15 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -1,18 +1,21 @@
 <script lang="ts">
-    import { afterNavigate } from "$app/navigation";
-    import { updated } from "$app/stores";
-    import { browser } from "$app/environment";
-
-    import env from "$lib/env";
-    import settings from "$lib/state/settings";
-    import { device, app } from "$lib/device";
-    import locale from "$lib/i18n/locale";
-    import currentTheme, { statusBarColors } from "$lib/state/theme";
-
     import "@fontsource/ibm-plex-mono/400.css";
     import "@fontsource/ibm-plex-mono/400-italic.css";
     import "@fontsource/ibm-plex-mono/500.css";
 
+    import { page } from "$app/stores";
+    import { updated } from "$app/stores";
+    import { browser } from "$app/environment";
+    import { afterNavigate } from "$app/navigation";
+
+    import env from "$lib/env";
+    import settings from "$lib/state/settings";
+    import locale from "$lib/i18n/locale";
+
+    import { device, app } from "$lib/device";
+    import { turnstileCreated } from "$lib/state/turnstile";
+    import currentTheme, { statusBarColors } from "$lib/state/theme";
+
     import Sidebar from "$components/sidebar/Sidebar.svelte";
     import Turnstile from "$components/misc/Turnstile.svelte";
     import NotchSticker from "$components/misc/NotchSticker.svelte";
@@ -64,7 +67,7 @@
         <DialogHolder />
         <Sidebar />
         <div id="content">
-            {#if env.TURNSTILE_KEY}
+            {#if (env.TURNSTILE_KEY && $page.url.pathname === "/") || $turnstileCreated}
                 <Turnstile />
             {/if}
             <slot></slot>