Split event view into components
This commit is contained in:
@@ -0,0 +1,47 @@
|
||||
<script lang="ts">
|
||||
interface Event {
|
||||
email_subject: string;
|
||||
email_body: string;
|
||||
}
|
||||
|
||||
let { event, loading } = $props<{
|
||||
event: Event | null;
|
||||
loading: boolean;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<div class="rounded-lg border border-gray-300 bg-white p-6 mb-4">
|
||||
<div class="mb-4">
|
||||
<h2 class="text-xl font-semibold text-gray-900">Email Template</h2>
|
||||
</div>
|
||||
|
||||
{#if loading}
|
||||
<!-- Loading placeholder for email template content -->
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<span class="block mb-1 text-sm font-medium text-gray-700">Subject:</span>
|
||||
<div class="h-10 w-full animate-pulse rounded bg-gray-200"></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span class="block mb-1 text-sm font-medium text-gray-700">Body:</span>
|
||||
<div class="h-28 w-full animate-pulse rounded bg-gray-200"></div>
|
||||
</div>
|
||||
</div>
|
||||
{:else if event}
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<span class="block mb-1 text-sm font-medium text-gray-700">Subject:</span>
|
||||
<div class="bg-gray-50 p-3 rounded-lg border border-gray-200">
|
||||
<p class="text-sm text-gray-900">{event.email_subject}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<span class="block mb-1 text-sm font-medium text-gray-700">Body:</span>
|
||||
<div class="bg-gray-50 p-3 rounded-lg border border-gray-200 max-h-48 overflow-y-auto">
|
||||
<p class="text-sm whitespace-pre-wrap text-gray-900">{event.email_body}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
Reference in New Issue
Block a user