From ee05545a7a39ca11d290df05aff9c05f904d7fbc Mon Sep 17 00:00:00 2001
From: Patrick O'Sullivan <patrick@osullivan.io>
Date: Wed, 5 Jun 2024 15:16:34 -0500
Subject: [PATCH] Add border around message input

---
 packages/ui/src/components/Channel/index.tsx         |  1 -
 .../ui/src/components/MessageInput/index.native.tsx  | 12 ++++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/packages/ui/src/components/Channel/index.tsx b/packages/ui/src/components/Channel/index.tsx
index 5061366abb..e94f57a4ee 100644
--- a/packages/ui/src/components/Channel/index.tsx
+++ b/packages/ui/src/components/Channel/index.tsx
@@ -315,7 +315,6 @@ export function Channel({
                               editPost={editPost}
                               floatingActionButton={channel.type === 'gallery'}
                               showAttachmentButton={channel.type !== 'gallery'}
-                              backgroundColor="$secondaryBackground"
                             />
                           )}
                         {!isChatChannel && canWrite && !showBigInput && (
diff --git a/packages/ui/src/components/MessageInput/index.native.tsx b/packages/ui/src/components/MessageInput/index.native.tsx
index d93122131b..a7550ccc4c 100644
--- a/packages/ui/src/components/MessageInput/index.native.tsx
+++ b/packages/ui/src/components/MessageInput/index.native.tsx
@@ -39,7 +39,12 @@ import {
 import { Keyboard } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import type { WebViewMessageEvent } from 'react-native-webview';
-import { getToken, useWindowDimensions } from 'tamagui';
+import {
+  getToken,
+  getTokenValue,
+  useTheme,
+  useWindowDimensions,
+} from 'tamagui';
 
 import { useReferences } from '../../contexts/references';
 import { XStack } from '../../core';
@@ -110,7 +115,7 @@ export const MessageInput = forwardRef<MessageInputHandle, MessageInputProps>(
       setShowBigInput,
       showAttachmentButton = true,
       floatingActionButton = false,
-      backgroundColor = '$secondaryBackground',
+      backgroundColor = '$background',
       paddingHorizontal,
       initialHeight = DEFAULT_MESSAGE_INPUT_HEIGHT,
       placeholder = 'Message',
@@ -633,6 +638,9 @@ export const MessageInput = forwardRef<MessageInputHandle, MessageInputProps>(
           <RichText
             style={{
               backgroundColor: 'transparent',
+              borderRadius: getTokenValue('$xl', 'radius'),
+              borderColor: useTheme().shadow.val,
+              borderWidth: 1,
             }}
             editor={editor}
             onMessage={handleMessage}