Better error norifications

This commit is contained in:
Roman Krček
2025-07-14 14:30:55 +02:00
parent a8f1b973e6
commit 06f2553b42
14 changed files with 513 additions and 68 deletions

View File

@@ -3,6 +3,7 @@
import { isTokenValid, getUserInfo, revokeToken } from '$lib/google/auth/client.js';
import type { GoogleSheet } from '$lib/google/sheets/types.ts';
import { goto } from '$app/navigation';
import { toast } from '$lib/stores/toast.js';
// Import Components
import GoogleAuthStep from './components/GoogleAuthStep.svelte';
@@ -259,23 +260,32 @@
}
function validateCurrentStep(): boolean {
// Clear previous errors
errors = {};
let isValid = true;
if (currentStep === 0) {
if (!authData.isConnected) {
toast.error('Please connect your Google account to continue');
errors.auth = 'Please connect your Google account to continue';
return false;
}
} else if (currentStep === 1) {
if (!eventData.name.trim()) {
toast.error('Event name is required');
errors.name = 'Event name is required';
isValid = false;
}
if (!eventData.date) {
toast.error('Event date is required');
errors.date = 'Event date is required';
isValid = false;
}
} else if (currentStep === 2) {
if (!sheetsData.selectedSheet) {
toast.error('Please select a Google Sheet');
errors.sheet = 'Please select a Google Sheet';
isValid = false;
}
if (sheetsData.selectedSheet) {
@@ -289,19 +299,26 @@
if (!confirmation) missingColumns.push('Confirmation');
if (missingColumns.length > 0) {
errors.sheetData = `Please map the following columns: ${missingColumns.join(', ')}`;
const errorMsg = `Please map the following columns: ${missingColumns.join(', ')}`;
toast.error(errorMsg);
errors.sheetData = errorMsg;
isValid = false;
}
}
} else if (currentStep === 3) {
if (!emailData.subject.trim()) {
toast.error('Email subject is required');
errors.subject = 'Email subject is required';
isValid = false;
}
if (!emailData.body.trim()) {
toast.error('Email body is required');
errors.body = 'Email body is required';
isValid = false;
}
}
return Object.keys(errors).length === 0;
return isValid;
}
// Google Sheets functions
@@ -431,7 +448,7 @@
}}
/>
{:else if currentStep === 1}
<EventDetailsStep bind:eventData bind:errors />
<EventDetailsStep bind:eventData />
{:else if currentStep === 2}
<GoogleSheetsStep bind:sheetsData bind:errors {loadRecentSheets} {selectSheet} {toggleSheetList} />
{:else if currentStep === 3}

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>