From 58cb788f22aaefda3eba0d060915bc4636a2f05a Mon Sep 17 00:00:00 2001
From: Chris Bisset <chris@gurucomputing.com.au>
Date: Thu, 20 Mar 2025 00:35:15 +0000
Subject: [PATCH] added ability to pass settings in URL

---
 .../server-settings-functions.svelte.ts       | 32 +++++++++++++++++++
 .../settings/server-settings.svelte           | 10 ++++--
 .../settings/server-settings.svelte.ts        | 24 --------------
 src/routes/+layout.svelte                     | 17 ++++++++--
 4 files changed, 53 insertions(+), 30 deletions(-)
 create mode 100644 src/lib/components/settings/server-settings-functions.svelte.ts
 delete mode 100644 src/lib/components/settings/server-settings.svelte.ts

diff --git a/src/lib/components/settings/server-settings-functions.svelte.ts b/src/lib/components/settings/server-settings-functions.svelte.ts
new file mode 100644
index 0000000..7e46b1f
--- /dev/null
+++ b/src/lib/components/settings/server-settings-functions.svelte.ts
@@ -0,0 +1,32 @@
+import { newToastAlert } from "../layout/toast.svelte.ts";
+import { appSettings, persistentAppSettings } from "../common/state.svelte";
+
+export async function testAPIConnectivity() {
+    try {
+        const response = await fetch(`${persistentAppSettings.headscaleURL}/api/v1/apikey`, {
+            method: 'GET',
+            headers: {
+                'Authorization': `Bearer ${persistentAppSettings.headscaleAPIKey}`,
+                'Content-Type': 'application/json'
+            }
+        });
+
+        if (!response.ok) {
+            newToastAlert(`API test failed (check your server settings): ${response.status}`);
+            appSettings.apiTested = false;
+        }
+
+        const data = await response.json();
+        appSettings.apiTested = true;
+
+        if (persistentAppSettings.debugLogging) {
+            newToastAlert(`API Response: ${JSON.stringify(data)}`);
+        }
+    } catch (error) {
+        let message
+        if (error instanceof Error) { message = error.message }
+        else { message = String(error) }
+        newToastAlert(`API test failed (check your server settings): ${message}`)
+        appSettings.apiTested = false;
+    }
+}
\ No newline at end of file
diff --git a/src/lib/components/settings/server-settings.svelte b/src/lib/components/settings/server-settings.svelte
index 18b21dd..1c43a6f 100644
--- a/src/lib/components/settings/server-settings.svelte
+++ b/src/lib/components/settings/server-settings.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { persistentAppSettings } from '$lib/components/common/state.svelte';
-	import { testAPIConnectivity } from './server-settings.svelte.ts';
+	import { testAPIConnectivity } from './server-settings-functions.svelte.ts';
 	import { appSettings } from '$lib/components/common/state.svelte';
 	import { fly } from 'svelte/transition';
 
@@ -18,8 +18,12 @@
 		</label>
 		<label class="mb-2 block font-bold text-secondary" for="headscaleKey"> Headscale API Key </label>
 		<div class="relative flex">
-			<input id="headscaleKey" bind:value={persistentAppSettings.headscaleAPIKey} class="input input-sm input-bordered w-full" minlength="40" maxlength="40" type={apiSecretHidden ? "password" : "text"} required placeholder="******************" />
-			<button class="ml-2" onclick={() => {apiSecretHidden = !apiSecretHidden }}
+			<input id="headscaleKey" bind:value={persistentAppSettings.headscaleAPIKey} class="input input-sm input-bordered w-full" minlength="40" maxlength="40" type={apiSecretHidden ? 'password' : 'text'} required placeholder="******************" />
+			<button type="button"
+				class="ml-2"
+				onclick={() => {
+					apiSecretHidden = !apiSecretHidden;
+				}}
 				>{#if apiSecretHidden}
 					<!-- eye off -->
 					<svg xmlns="http://www.w3.org/2000/svg" class="my-1.5 h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21" /></svg>
diff --git a/src/lib/components/settings/server-settings.svelte.ts b/src/lib/components/settings/server-settings.svelte.ts
deleted file mode 100644
index 523a9e8..0000000
--- a/src/lib/components/settings/server-settings.svelte.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { newToastAlert } from "../layout/toast.svelte.ts";
-import { appSettings, persistentAppSettings } from "../common/state.svelte";
-
-export async function testAPIConnectivity() {
-    const response = await fetch(`${persistentAppSettings.headscaleURL}/api/v1/apikey`, {
-        method: 'GET',
-        headers: {
-            'Authorization': `Bearer ${persistentAppSettings.headscaleAPIKey}`,
-            'Content-Type': 'application/json'
-        }
-    });
-
-    if (!response.ok) {
-        newToastAlert(`API error! Status: ${response.status}. Check your API settings`);
-        appSettings.apiTested = false;
-    }
-
-    const data = await response.json();
-    appSettings.apiTested = true;
-
-    if (persistentAppSettings.debugLogging) {
-        newToastAlert(`API Response: ${JSON.stringify(data)}`);
-    }
-}
\ No newline at end of file
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 7928a7c..7651283 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -7,7 +7,7 @@
 	import { onMount } from 'svelte';
 	import { fade } from 'svelte/transition';
 	import '../app.css';
-	import { testAPIConnectivity } from '$lib/components/settings/server-settings.svelte.ts';
+	import { testAPIConnectivity } from '$lib/components/settings/server-settings-functions.svelte';
 	let { children } = $props();
 
 	onMount(async () => {
@@ -21,13 +21,24 @@
 			localStorage.setItem('persistentAppSettings', JSON.stringify(persistentAppSettings));
 		});
 
+		// populate any settings being passed through by url params
+		const urlParams = new URLSearchParams(window.location.search);
+		let headscaleApiKeyParam = urlParams.get('apikey');
+		let headscaleUrlParam = urlParams.get('url');
+
+		if (headscaleApiKeyParam) {
+			persistentAppSettings.headscaleAPIKey = headscaleApiKeyParam;
+		}
+		if (headscaleUrlParam) {
+			persistentAppSettings.headscaleURL = headscaleUrlParam;
+		}
+
 		// perform an initial API test
 		testAPIConnectivity();
 
 		// delay load until page is hydrated
 		appSettings.appLoaded = true;
-		
-});
+	});
 </script>
 
 {#if appSettings.appLoaded}