From a1c5c68f2cb8bf8b26f07d6f7b03a733f2b3a9db Mon Sep 17 00:00:00 2001
From: lucalise <luca_lise@icloud.com>
Date: Thu, 22 Jan 2026 17:48:53 -0800
Subject: [PATCH] fix: add spinner to sign-in

---
 src/lib/Header.svelte | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/lib/Header.svelte b/src/lib/Header.svelte
index b267e45..8649eda 100644
--- a/src/lib/Header.svelte
+++ b/src/lib/Header.svelte
@@ -2,7 +2,7 @@
 	import { Avatar, Button, DropdownMenu, Separator } from 'bits-ui';
 	import { authClient } from './auth-client';
 	import Image from './Image.svelte';
-	import { CircleUser, FolderGit2, User } from '@lucide/svelte';
+	import { CircleUser, FolderGit2, Loader2, User } from '@lucide/svelte';
 	import { goto } from '$app/navigation';
 	type MockUser = {
 		image: string;
@@ -10,8 +10,10 @@
 
 	const session = authClient.useSession();
 	const user = $derived($session.data?.user);
+	let loading = $state(false);
 
 	const signIn = async () => {
+		loading = true;
 		await authClient.signIn.social({
 			provider: 'github'
 		});
@@ -25,7 +27,11 @@
 		</Button.Root>
 		{#if !user && !$session.isPending}
 			<Button.Root class="rounded-md p-2 transition-colors hover:bg-gray-800" onclick={signIn}>
-				Sign In
+				{#if loading}
+					<Loader2 class="animate-spin" />
+				{:else}
+					Sign In
+				{/if}
 			</Button.Root>
 		{:else if user}
 			<DropdownMenu.Root>