WIP: auth: improve handling of invite tokens

src/lib/components/app/auth-form/auth-form.svelte

@@ -4,21 +4,21 @@
 	import { cn } from '$lib/utils.js';
 	import googleIcon from '$lib/assets/google.svg';
 
-	let { inviteToken, class: className, ...rest }: { inviteToken?: string; class?: string; rest?: { [p: string]: unknown } } = $props();
+	let { inviteToken, class: className, ...rest }: {
+		inviteToken?: string;
+		class?: string;
+		rest?: { [p: string]: unknown }
+	} = $props();
 
-	let isLoading = $state(false);
+	let submitted = $state(false);
 </script>
 
 <div class={cn('flex gap-6', className)} {...rest}>
-	<form method="get" action="/auth/authentik{inviteToken ? `?invite=${inviteToken}` : ''}">
+	<form method="get" onsubmit={() => submitted = true}
+				action="/auth/authentik{inviteToken ? `?invite=${inviteToken}` : ''}">
 		<input type="hidden" value={inviteToken} name="invite" />
-		<Button
-			type="submit"
-			onclick={() => {
-				isLoading = true;
-			}}
-		>
-			{#if isLoading}
+		<Button type="submit" disabled={submitted}>
+			{#if submitted}
 				<LucideLoaderCircle class="mr-2 h-4 w-4 animate-spin" />
 			{:else}
 				<img
@@ -30,15 +30,11 @@
 			Sign in with Authentik
 		</Button>
 	</form>
-	<form method="get" action="/auth/google">
+	<form method="get" onsubmit={() => submitted = true}
+				action="/auth/google{inviteToken ? `?invite=${inviteToken}` : ''}">
 		<input type="hidden" value={inviteToken} name="invite" />
-		<Button
-			type="submit"
-			onclick={() => {
-				isLoading = true;
-			}}
-		>
-			{#if isLoading}
+		<Button type="submit" disabled={submitted}>
+			{#if submitted}
 				<LucideLoaderCircle class="mr-2 h-4 w-4 animate-spin" />
 			{:else}
 				<img