diff --git a/.github/copilot-instructions.md b/.github/copilot-instructions.md index a009208..be05df8 100644 --- a/.github/copilot-instructions.md +++ b/.github/copilot-instructions.md @@ -1,12 +1,11 @@ GitHub Copilot Instructions for This Repository -If you have any questions, always ask me first. - -Use Svelte 5 runes exclusively - -Declare reactive state with $state(); derive values with $derived(); run side-effect logic with $effect() etc. -svelte.dev -svelte.dev +Basics: +- If you have any questions, always ask me first! +- Use Svelte 5 runes exclusively +- Declare reactive state with $state(); derive values with $derived(); run side-effect logic with $effect() etc. +- When doing client-side loading, always implement placeholders and loaders, so the UI remains responsive and layout shifts are minimized. + - Don't use placeholders and loaders for static data like heading etc. Do not fall back to the legacy $: label syntax or Svelte 3/4 stores! This is important! diff --git a/src/routes/private/events/event/view/+page.svelte b/src/routes/private/events/event/view/+page.svelte index b671f38..7cf5c17 100644 --- a/src/routes/private/events/event/view/+page.svelte +++ b/src/routes/private/events/event/view/+page.svelte @@ -252,64 +252,60 @@
{#if loading} - -
-
-
-
-
-
- {:else if event} -
-
-

{event.name}

-
-
- Date: - {formatDate(event.date)} -
-
- Created: - {formatDate(event.created_at)} -
-
- Sheet ID: - - - - - Open in Google Sheets - -
+ +
+

Event Information

+
+
+ Date: +
+
+
+ Created: +
+
+
+ Sheet ID: +
-
-

Email Details

-
-
- Subject: -

{event.email_subject}

-
-
- Body: -

{event.email_body}

-
+
+ {:else if event} +
+

{event.name}

+
+
+ Date: + {formatDate(event.date)} +
+
+ Created: + {formatDate(event.created_at)} +
+
+ Sheet ID: + + + + + Open in Google Sheets +
@@ -320,23 +316,65 @@ {/if}
+ +
+
+

Email Template

+
+ + {#if loading} + +
+
+ Subject: +
+
+ +
+ Body: +
+
+
+ {:else if event} + +
+
+ Subject: +
+

{event.email_subject}

+
+
+
+ Body: +
+

{event.email_body}

+
+
+
+ {/if} +
+

Google Account

Required for syncing participants and sending emails

- { - // Refresh the page or update UI state as needed - error = ''; - }} - onError={(errorMsg) => { - error = errorMsg; - }} - /> + {#if loading} +
+ {:else} + { + // Refresh the page or update UI state as needed + error = ''; + }} + onError={(errorMsg) => { + error = errorMsg; + }} + /> + {/if}
@@ -345,7 +383,7 @@

Participants

- {#if participantsLoading} + {#if participantsLoading || loading}
{#each Array(5) as _} @@ -475,12 +513,20 @@

Send Emails

-
- {participants.filter(p => !p.email_sent).length} uncontacted participants -
+ {#if !loading} +
+ {participants.filter(p => !p.email_sent).length} uncontacted participants +
+ {:else} +
+ Loading participants... +
+ {/if}
- {#if sendingEmails} + {#if loading} +
+ {:else if sendingEmails}