From c2640a33f9b6d9dd2a65322f91e78a9ca9371856 Mon Sep 17 00:00:00 2001
From: Steven Nguyen <stnguyen90@users.noreply.github.com>
Date: Tue, 5 Mar 2024 13:40:08 -0800
Subject: [PATCH] fix(messaging): fix messaging container header

The create message button should be in the same row as the search
input and filter and column buttons on desktop.
---
 .../console/project-[project]/messaging/+page.svelte       | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/routes/console/project-[project]/messaging/+page.svelte b/src/routes/console/project-[project]/messaging/+page.svelte
index d27f3e37c..a9272aee3 100644
--- a/src/routes/console/project-[project]/messaging/+page.svelte
+++ b/src/routes/console/project-[project]/messaging/+page.svelte
@@ -50,6 +50,7 @@
     let showFailed = false;
     let errors: string[] = [];
     let showCreateDropdownDesktop = false;
+    let showCreateDropdownMobile = false;
     let showCreateDropdownEmpty = false;
     const columns = writable<Column[]>([
         { id: '$id', title: 'Message ID', type: 'string', show: true, width: 140 },
@@ -92,7 +93,9 @@
 
 <Container>
     <ContainerHeader title="Messages">
-        <CreateMessageDropdown bind:showCreateDropdown={showCreateDropdownDesktop} />
+        <div class="is-only-mobile">
+            <CreateMessageDropdown bind:showCreateDropdown={showCreateDropdownMobile} />
+        </div>
     </ContainerHeader>
     <div class="u-flex u-flex-vertical u-gap-16 u-margin-block-start-16">
         <SearchQuery
@@ -101,7 +104,6 @@
             placeholder="Search by message ID, description, type, or status">
             <div class="is-not-mobile u-width-full-line">
                 <div class="u-flex u-gap-16 u-main-end">
-                    <!-- TODO: make this not database-specific -->
                     <Filters query={data.query} {columns} />
                     <ViewSelector
                         view={data.view}
@@ -109,6 +111,7 @@
                         hideView
                         allowNoColumns
                         showColsTextMobile />
+                    <CreateMessageDropdown bind:showCreateDropdown={showCreateDropdownDesktop} />
                 </div>
             </div>
         </SearchQuery>