diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/EventsDrawer.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/EventsDrawer.svelte
index f54212e49..f0fd08b9e 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/EventsDrawer.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/events/components/EventsDrawer.svelte
@@ -7,6 +7,7 @@
     import DateTime from '$comp/formatters/DateTime.svelte';
     import TimeAgo from '$comp/formatters/TimeAgo.svelte';
     import { P } from '$comp/typography';
+    import { Skeleton } from '$comp/ui/skeleton';
     import * as Table from '$comp/ui/table';
     import * as Tabs from '$comp/ui/tabs';
     import { getEventQuery } from '$features/events/api.svelte';
@@ -112,37 +113,42 @@
     });
 </script>
 
-{#if eventResponse.isLoading}
-    <P>Loading...</P>
-{:else if eventResponse.isSuccess}
-    <StackCard {changed} id={eventResponse.data.stack_id}></StackCard>
+<StackCard {changed} id={eventResponse.data?.stack_id}></StackCard>
 
-    <Table.Root class="mt-4">
-        <Table.Body>
-            <Table.Row class="group">
-                <Table.Head class="w-40 whitespace-nowrap">Occurred On</Table.Head>
-                <Table.Cell class="w-4 pr-0"></Table.Cell>
-                <Table.Cell class="flex items-center"
-                    ><DateTime value={eventResponse.data.date}></DateTime> (<TimeAgo value={eventResponse.data.date}></TimeAgo>)</Table.Cell
+<Table.Root class="mt-4">
+    <Table.Body>
+        <Table.Row class="group">
+            <Table.Head class="w-40 whitespace-nowrap">Occurred On</Table.Head>
+            <Table.Cell class="w-4 pr-0"></Table.Cell>
+            <Table.Cell class="flex items-center"
+                >{#if eventResponse.isSuccess}
+                    <DateTime value={eventResponse.data.date}></DateTime> (<TimeAgo value={eventResponse.data.date}></TimeAgo>)
+                {:else}
+                    <Skeleton class="h-[20px] w-full rounded-full" />
+                {/if}</Table.Cell
+            >
+        </Table.Row>
+        <Table.Row class="group">
+            <Table.Head class="w-40 whitespace-nowrap">Project</Table.Head>
+            {#if projectResponse.isSuccess}
+                <Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
+                    ><ClickableProjectFilter
+                        {changed}
+                        class="mr-0"
+                        organization={projectResponse.data.organization_id!}
+                        value={[projectResponse.data.id!]}
+                    /></Table.Cell
                 >
-            </Table.Row>
-            {#if projectResponse.data}
-                <Table.Row class="group">
-                    <Table.Head class="w-40 whitespace-nowrap">Project</Table.Head>
-                    <Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
-                        ><ClickableProjectFilter
-                            {changed}
-                            class="mr-0"
-                            organization={projectResponse.data.organization_id!}
-                            value={[projectResponse.data.id!]}
-                        /></Table.Cell
-                    >
-                    <Table.Cell>{projectResponse.data.name}</Table.Cell>
-                </Table.Row>
+                <Table.Cell>{projectResponse.data.name}</Table.Cell>
+            {:else if projectResponse.isLoading}
+                <Table.Cell class="w-4 pr-0"></Table.Cell>
+                <Table.Cell class="flex items-center"><Skeleton class="h-[20px] w-full rounded-full" /></Table.Cell>
             {/if}
-        </Table.Body>
-    </Table.Root>
+        </Table.Row>
+    </Table.Body>
+</Table.Root>
 
+{#if eventResponse.isSuccess}
     <Tabs.Root class="mb-4 mt-4" value={activeTab}>
         <Tabs.List class="mb-4 w-full justify-normal">
             {#each tabs as tab (tab)}
@@ -171,5 +177,16 @@
         {/each}
     </Tabs.Root>
 {:else}
-    <ErrorMessage message={eventResponse.error?.errors.general}></ErrorMessage>
+    <Skeleton class="h-[30px] w-full rounded-full" />
+    <Table.Root class="mt-4">
+        <Table.Body>
+            {#each Array.from({ length: 5 })}
+                <Table.Row class="group">
+                    <Table.Head class="w-40 whitespace-nowrap"><Skeleton class="h-[20px] w-full rounded-full" /></Table.Head>
+                    <Table.Cell class="w-4 pr-0"></Table.Cell>
+                    <Table.Cell class="flex items-center"><Skeleton class="h-[20px] w-full rounded-full" /></Table.Cell>
+                </Table.Row>
+            {/each}
+        </Table.Body>
+    </Table.Root>
 {/if}
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/StackCard.svelte b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/StackCard.svelte
index 2a981581b..8a86280ec 100644
--- a/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/StackCard.svelte
+++ b/src/Exceptionless.Web/ClientApp/src/lib/features/stacks/components/StackCard.svelte
@@ -9,6 +9,7 @@
     import Muted from '$comp/typography/Muted.svelte';
     import { Badge } from '$comp/ui/badge';
     import * as Card from '$comp/ui/card';
+    import { Skeleton } from '$comp/ui/skeleton';
     import * as Tooltip from '$comp/ui/tooltip';
     import { getProjectCountQuery, getStackCountQuery } from '$features/events/api.svelte';
     import { DEFAULT_OFFSET } from '$features/shared/api/api.svelte';
@@ -27,7 +28,7 @@
 
     interface Props {
         changed: (filter: IFilter) => void;
-        id: string;
+        id: string | undefined;
     }
 
     let { changed, id }: Props = $props();
@@ -72,7 +73,7 @@
     const lastOccurrence = $derived(max<string>(stackCountResponse?.data?.aggregations, 'max_date')?.value ?? stack?.last_occurrence);
 </script>
 
-{#if stack}
+{#if stackResponse.isSuccess}
     <Card.Root>
         <Card.Header>
             <Card.Title class="flex flex-row items-center justify-between text-lg font-semibold">
@@ -165,4 +166,32 @@
             <StackReferences {stack} />
         </Card.Content>
     </Card.Root>
+{:else}
+    <Card.Root>
+        <Card.Header>
+            <Card.Title class="flex flex-row items-center justify-between text-lg font-semibold">
+                <span class="mb-2 flex flex-col lg:mb-0">
+                    <div class="flex items-center gap-2">
+                        <Skeleton class="h-[26px] w-[32px]" />
+                        <Skeleton class="h-[26px] w-[200px]" />
+                    </div>
+                </span>
+                <div class="flex items-center space-x-2">
+                    <Skeleton class="h-[36px] w-[135px]" />
+                    <Skeleton class="h-[36px] w-[32px]" />
+                </div>
+            </Card.Title>
+        </Card.Header>
+        <Card.Content class="space-y-4 pt-2">
+            <div class="grid grid-cols-2 gap-4 lg:grid-cols-4">
+                {#each Array(4)}
+                    <div class="flex flex-col items-center rounded-lg bg-muted p-2">
+                        <Skeleton class="mb-1 h-6 w-6" />
+                        <Skeleton class="mb-1 h-[28px] w-[60px]" />
+                        <Skeleton class="h-[16px] w-[80px]" />
+                    </div>
+                {/each}
+            </div>
+        </Card.Content>
+    </Card.Root>
 {/if}