fix(auth+pwa): resolve stuck-loading race condition and PWA build error

Auth: `getSession()` in a SvelteKit load function races with Supabase's async
localStorage init and can return null for a valid session, triggering a spurious
login() redirect. Moved auth redirect to (app)/+layout.svelte via $effect, which
correctly waits for onAuthStateChange to fire. Also fixed collective data never
loading on page refresh (INITIAL_SESSION event, not SIGNED_IN).

PWA: SvelteKit blocks Workbox imports in src/service-worker.ts, preventing
@vite-pwa/sveltekit from finding the compiled SW output. Switched to generateSW
strategy (plugin auto-generates the SW). Custom SW deferred to Fase 2b using
src/sw.ts (a filename SvelteKit does not intercept).

Docs: added gotchas 6–8 to CLAUDE.md covering both root causes so they are not
reintroduced. Updated plan/fase-2b with the sw.ts workaround note.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/web/src/routes/(app)/+layout.svelte

@@ -2,6 +2,7 @@
 	import type { Snippet } from 'svelte';
 	import { page } from '$app/stores';
 	import { isAuthenticated, authLoading, displayName } from '$lib/stores/auth';
+	import { login } from '$lib/auth';
 
 	let { children }: { children: Snippet } = $props();
 	import { currentCollective, userCollectives } from '$lib/stores/collective';
@@ -9,6 +10,15 @@
 	import Avatar from '$lib/components/Avatar.svelte';
 	import * as m from '$lib/paraglide/messages';
 
+	// When auth resolves as unauthenticated, redirect to Keycloak.
+	// This runs after onAuthStateChange fires (authLoading = false), so there
+	// is no race with Supabase's async localStorage initialisation.
+	$effect(() => {
+		if (!$authLoading && !$isAuthenticated) {
+			login();
+		}
+	});
+
 	const navItems = [
 		{ href: '/lists', label: () => m.nav_lists(), icon: '🛒' },
 		{ href: '/tasks', label: () => m.nav_tasks(), icon: '✓' },

apps/web/src/routes/(app)/+layout.ts

@@ -1,21 +1,9 @@
-import { browser } from '$app/environment';
-import { getSupabase } from '$lib/supabase';
-import { login } from '$lib/auth';
-
-// No SSR — this is a client-rendered PWA
+// No SSR — this is a client-rendered PWA.
+// Auth redirect is handled in +layout.svelte via the onAuthStateChange store,
+// NOT here. Using getSession() in a load function races with Supabase's async
+// localStorage initialisation and can return null for a valid session.
 export const ssr = false;
 
-export async function load() {
-	if (!browser) return {};
-
-	const {
-		data: { session }
-	} = await getSupabase().auth.getSession();
-
-	if (!session) {
-		// Not authenticated — redirect to Keycloak
-		await login();
-	}
-
+export function load() {
 	return {};
 }

apps/web/src/routes/+layout.svelte

@@ -4,19 +4,11 @@
 	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import { getSupabase } from '$lib/supabase';
-	import { login } from '$lib/auth';
 	import { currentUser, authLoading } from '$lib/stores/auth';
 	import { userCollectives, currentCollective } from '$lib/stores/collective';
 	import { ParaglideJS } from '@inlang/paraglide-sveltekit';
 	import { i18n } from '$lib/i18n';
 
-	// Routes that don't require authentication
-	const PUBLIC_ROUTES = ['/auth', '/invitation'];
-
-	function isPublicRoute(pathname: string): boolean {
-		return PUBLIC_ROUTES.some((r) => pathname.startsWith(r));
-	}
-
 	onMount(() => {
 		const supabase = getSupabase();
 
@@ -26,20 +18,23 @@
 			currentUser.set(session?.user ?? null);
 			authLoading.set(false);
 
-			if (!session && !isPublicRoute($page.url.pathname)) {
-				// No session on a protected route → redirect to Keycloak
-				await login();
-				return;
-			}
-
-			if (session && event === 'SIGNED_IN') {
+			if (session) {
+				// Load collectives on every auth event that provides a session:
+				// INITIAL_SESSION (page refresh), SIGNED_IN (post-login), TOKEN_REFRESHED.
 				await loadUserCollectives(session.user.id);
 
-				// Post-login routing: onboarding if user has no collective
-				if ($userCollectives.length === 0 && $page.url.pathname === '/') {
-					goto('/onboarding');
-				} else if ($page.url.pathname === '/') {
-					goto('/lists');
+				if (event === 'SIGNED_IN') {
+					// Post-login: send the user where they belong.
+					// Only redirect when coming from the callback or the root — not on
+					// token refreshes or when the user is already on a real route.
+					const path = $page.url.pathname;
+					if (path === '/auth/callback' || path === '/') {
+						if ($userCollectives.length === 0) {
+							goto('/onboarding');
+						} else {
+							goto('/lists');
+						}
+					}
 				}
 			}
 		});