Better error norifications

src/routes/private/events/event/new/components/EmailSettingsStep.svelte

@@ -1,10 +1,9 @@
 <script lang="ts">
-	let { emailData = $bindable(), errors = $bindable() } = $props<{
+	let { emailData = $bindable() } = $props<{
 		emailData: {
 			subject: string;
 			body: string;
 		};
-		errors: Record<string, string>;
 	}>();
 
 	const templateVariables = [
@@ -37,9 +36,6 @@
 				Detected templates: {subjectTemplatesDetected.map((v) => v.name).join(', ')}
 			</p>
 		{/if}
-		{#if errors.subject}
-			<p class="text-sm text-red-600">{errors.subject}</p>
-		{/if}
 	</div>
 
 	<div>
@@ -58,9 +54,7 @@
 				Detected templates: {bodyTemplatesDetected.map((v) => v.name).join(', ')}
 			</p>
 		{/if}
-		{#if errors.body}
-			<p class="mt-1 text-sm text-red-600">{errors.body}</p>
-		{/if}
+		<!-- Errors now shown as toast notifications -->
 	</div>
 
 	<div>

src/routes/private/events/event/new/components/EventDetailsStep.svelte

@@ -1,10 +1,9 @@
 <script lang="ts">
-	let { eventData = $bindable(), errors = $bindable() } = $props<{
+	let { eventData = $bindable() } = $props<{
 		eventData: {
 			name: string;
 			date: string;
 		};
-		errors: Record<string, string>;
 	}>();
 </script>
 
@@ -22,9 +21,6 @@
 			class="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
 			placeholder="Enter event name"
 		/>
-		{#if errors.name}
-			<p class="mt-1 text-sm text-red-600">{errors.name}</p>
-		{/if}
 	</div>
 
 	<div>
@@ -37,8 +33,5 @@
 			bind:value={eventData.date}
 			class="w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
 		/>
-		{#if errors.date}
-			<p class="mt-1 text-sm text-red-600">{errors.date}</p>
-		{/if}
 	</div>
 </div>

src/routes/private/events/event/new/components/GoogleAuthStep.svelte

@@ -2,8 +2,7 @@
 	import GoogleAuthButton from '$lib/components/GoogleAuthButton.svelte';
 
 	// Props
-	let { errors, onSuccess, onError } = $props<{
-		errors: Record<string, string>;
+	let { onSuccess, onError } = $props<{
 		onSuccess?: (token: string) => void;
 		onError?: (error: string) => void;
 	}>();
@@ -23,10 +22,6 @@
 				onError={onError}
 			/>
 
-		{#if errors.google}
-			<div class="mt-4 text-sm text-red-600">
-				{errors.google}
-			</div>
-		{/if}
+		<!-- Error messages are now shown as toast notifications -->
 	</div>
 </div>

src/routes/private/events/event/new/components/GoogleSheetsStep.svelte

@@ -2,7 +2,7 @@
 	import type { GoogleSheet } from '$lib/google/sheets/types.ts';
 	
 	// Props
-	let { sheetsData = $bindable(), errors = $bindable(), loadRecentSheets, selectSheet, toggleSheetList } = $props<{
+	let { sheetsData = $bindable(), loadRecentSheets, selectSheet, toggleSheetList } = $props<{
 		sheetsData: {
 			availableSheets: GoogleSheet[];
 			selectedSheet: GoogleSheet | null;
@@ -16,7 +16,6 @@
 			loading: boolean;
 			expandedSheetList: boolean;
 		};
-		errors: Record<string, string>;
 		loadRecentSheets: () => Promise<void>;
 		selectSheet: (sheet: GoogleSheet) => Promise<void>;
 		toggleSheetList: () => void;
@@ -257,9 +256,7 @@
 			</div>
 		{/if}
 
-		{#if errors.sheet}
-			<p class="mt-2 text-sm text-red-600">{errors.sheet}</p>
-		{/if}
+		<!-- Error messages are now shown as toast notifications -->
 	</div>
 
 	{#if sheetsData.selectedSheet && sheetsData.sheetData.length > 0}
@@ -374,9 +371,7 @@
 		</div>
 	{/if}
 
-	{#if errors.sheetData}
-		<p class="text-sm text-red-600">{errors.sheetData}</p>
-	{/if}
+	<!-- Error messages are now shown as toast notifications -->
 </div>