From dc8d4f2b35dc9cc25eda8b049fc8fd332fb05b4b Mon Sep 17 00:00:00 2001
From: Reed <3893871+dharit-tan@users.noreply.github.com>
Date: Tue, 28 Mar 2023 22:19:38 -0400
Subject: [PATCH] Show header shadow in chat screens (#3106)

---
 packages/mobile/src/screens/chat-screen/ChatListScreen.tsx | 6 ++++++
 packages/mobile/src/screens/chat-screen/ChatScreen.tsx     | 2 ++
 2 files changed, 8 insertions(+)

diff --git a/packages/mobile/src/screens/chat-screen/ChatListScreen.tsx b/packages/mobile/src/screens/chat-screen/ChatListScreen.tsx
index 1d837c0eb96..6b030ab8f91 100644
--- a/packages/mobile/src/screens/chat-screen/ChatListScreen.tsx
+++ b/packages/mobile/src/screens/chat-screen/ChatListScreen.tsx
@@ -65,6 +65,11 @@ const useStyles = makeStyles(({ spacing, palette, typography }) => ({
   },
   writeMessageButton: {
     marginTop: spacing(6)
+  },
+  shadow: {
+    borderBottomColor: palette.neutralLight6,
+    borderBottomWidth: 3,
+    borderBottomLeftRadius: 1
   }
 }))
 
@@ -118,6 +123,7 @@ export const ChatListScreen = () => {
       topbarRight={iconCompose}
     >
       <ScreenContent>
+        <View style={styles.shadow} />
         <View style={styles.rootContainer}>
           {chatsStatus === Status.SUCCESS ? (
             <FlatList
diff --git a/packages/mobile/src/screens/chat-screen/ChatScreen.tsx b/packages/mobile/src/screens/chat-screen/ChatScreen.tsx
index 12d416b40c5..7d7ce9a15be 100644
--- a/packages/mobile/src/screens/chat-screen/ChatScreen.tsx
+++ b/packages/mobile/src/screens/chat-screen/ChatScreen.tsx
@@ -18,6 +18,7 @@ import { Platform, View, Text, KeyboardAvoidingView } from 'react-native'
 import { useDispatch, useSelector } from 'react-redux'
 
 import IconKebabHorizontal from 'app/assets/images/iconKebabHorizontal.svg'
+import IconMessage from 'app/assets/images/iconMessage.svg'
 import IconSend from 'app/assets/images/iconSend.svg'
 import type { FlatListT } from 'app/components/core'
 import { TextInput, Screen, ScreenContent, FlatList } from 'app/components/core'
@@ -316,6 +317,7 @@ export const ChatScreen = () => {
             )
           : messages.title
       }
+      icon={otherUser ? undefined : IconMessage}
       topbarRight={topBarRight}
     >
       <ScreenContent>