<script lang="ts">
	import { user, isLoading } from '$lib/auth/authStore';

	const greeting = $derived.by(() => {
		if ($isLoading) return 'Welcome to FictionArchive';
		if ($user) {
			const name = $user.profile?.name || $user.profile?.preferred_username;
			return name ? `Welcome back, ${name}` : 'Welcome back';
		}
		return 'Welcome to FictionArchive';
	});
</script>

<section class="py-8 text-center sm:py-12">
	<h1 class="text-3xl font-bold tracking-tight sm:text-4xl">
		{greeting}
	</h1>
	<p class="mt-2 text-lg text-muted-foreground">
		Your personal fiction library
	</p>
</section>
