diff --git a/src/routes/console/project-[project]/messaging/+page.svelte b/src/routes/console/project-[project]/messaging/+page.svelte
index 54802667eb..3f7d149640 100644
--- a/src/routes/console/project-[project]/messaging/+page.svelte
+++ b/src/routes/console/project-[project]/messaging/+page.svelte
@@ -169,13 +169,18 @@
                                     </TableCellText>
                                 {:else if column.id === 'status'}
                                     <TableCellText onlyDesktop title="Status">
-                                        <MessageStatusPill
-                                            status={message.status}
-                                            on:click={(e) => {
-                                                e.preventDefault();
-                                                errors = message.deliveryErrors;
-                                                showFailed = true;
-                                            }} />
+                                        <span class="u-inline-flex u-gap-12 u-cross-center">
+                                            <MessageStatusPill status={message.status} />
+                                            {#if message.status === 'failed'}
+                                                <Button
+                                                    link
+                                                    on:click={(e) => {
+                                                        e.preventDefault();
+                                                        errors = message.deliveryErrors;
+                                                        showFailed = true;
+                                                    }}>Details</Button>
+                                            {/if}
+                                        </span>
                                     </TableCellText>
                                 {:else if column.type === 'datetime'}
                                     <TableCellText title={column.title} width={column.width}>
diff --git a/src/routes/console/project-[project]/messaging/failedModal.svelte b/src/routes/console/project-[project]/messaging/failedModal.svelte
index 6ee183ffd1..208350b71c 100644
--- a/src/routes/console/project-[project]/messaging/failedModal.svelte
+++ b/src/routes/console/project-[project]/messaging/failedModal.svelte
@@ -9,7 +9,16 @@
 
 <Modal title="Message error" headerDivider={false} bind:show size="big">
     <div class="box u-flex-vertical u-gap-24">
-        <p>Some messages failed to send.</p>
+        <p class="u-inline-flex u-cross-center u-gap-8">
+            <span
+                class="icon-exclamation-circle u-font-size-20"
+                aria-hidden="true"
+                style="color:hsl(var(--color-danger-100));" />Message failed
+        </p>
+        <p>
+            The message has been sent with errors. Please refer to the logs below for more
+            information.
+        </p>
         <div style="max-inline-size: 524px">
             <Code language="html" code={errors.join('\n')} noMargin noBoxPadding allowScroll />
         </div>
diff --git a/src/routes/console/project-[project]/messaging/message-[message]/overview.svelte b/src/routes/console/project-[project]/messaging/message-[message]/overview.svelte
index 7413cfd794..1654500dc4 100644
--- a/src/routes/console/project-[project]/messaging/message-[message]/overview.svelte
+++ b/src/routes/console/project-[project]/messaging/message-[message]/overview.svelte
@@ -5,8 +5,13 @@
     import ProviderType from '../providerType.svelte';
     import MessageStatusPill from '../messageStatusPill.svelte';
     import { MessagingProviderType } from '@appwrite.io/console';
+    import { Button } from '$lib/elements/forms';
+    import FailedModal from '../failedModal.svelte';
 
     let scheduledAt: string = '';
+    let showFailed = false;
+    let errors: string[] = [];
+
     if ($message.status === 'sent') {
         scheduledAt = $message.deliveredAt;
     } else if ($message.status === 'scheduled') {
@@ -46,8 +51,16 @@
     </svelte:fragment>
 
     <svelte:fragment slot="actions">
-        <!-- TODO: Add support for editing draft messages -->
-        <!-- <Button disabled={$message.status !== 'draft'} on:click={() => console.log('click')}
-            >Edit message</Button> -->
+        {#if $message.status === 'failed'}
+            <Button
+                text
+                on:click={(e) => {
+                    e.preventDefault();
+                    errors = $message.deliveryErrors;
+                    showFailed = true;
+                }}>View logs</Button>
+        {/if}
     </svelte:fragment>
 </CardGrid>
+
+<FailedModal bind:show={showFailed} {errors} />
diff --git a/src/routes/console/project-[project]/messaging/messageStatusPill.svelte b/src/routes/console/project-[project]/messaging/messageStatusPill.svelte
index 46b309abc7..1bca4d2de6 100644
--- a/src/routes/console/project-[project]/messaging/messageStatusPill.svelte
+++ b/src/routes/console/project-[project]/messaging/messageStatusPill.svelte
@@ -5,15 +5,11 @@
 </script>
 
 <Pill
-    success={status === 'sent'}
     info={status === 'scheduled'}
-    button={status == 'failed'}
+    warning={status === 'processing'}
+    success={status === 'sent'}
+    danger={status == 'failed'}
     on:click>
-    {#if status === 'sent'}
-        <span class="icon-check-circle" aria-hidden="true"></span>
-    {:else if status === 'scheduled'}
-        <span class="icon-clock" aria-hidden="true"></span>
-    {/if}
     <span class="text u-trim">
         {status}
     </span>