From 9338f33f158db6b9a9400924e286baa0b84480a1 Mon Sep 17 00:00:00 2001
From: Rusyaidi <al244098@gmail.com>
Date: Mon, 26 Feb 2024 01:02:59 +0800
Subject: [PATCH] fix: chatitem scrolling out of view closing keyboard

---
 components/ChatMenu/ChatWindow/ChatItem.tsx   |  8 +++++-
 components/ChatMenu/ChatWindow/ChatWindow.tsx | 25 ++++++++++---------
 2 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/components/ChatMenu/ChatWindow/ChatItem.tsx b/components/ChatMenu/ChatWindow/ChatItem.tsx
index 32312da..efe5dfe 100644
--- a/components/ChatMenu/ChatWindow/ChatItem.tsx
+++ b/components/ChatMenu/ChatWindow/ChatItem.tsx
@@ -109,7 +109,12 @@ const ChatItem: React.FC<ChatItemProps> = ({
 
                     {showEditor && (
                         <View>
-                            <View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
+                            <View
+                                style={{
+                                    flexDirection: 'row',
+                                    justifyContent: 'space-between',
+                                    marginBottom: 2,
+                                }}>
                                 {id !== 0 && (
                                     <EditorButton name="delete" onPress={handleDeleteMessage} />
                                 )}
@@ -129,6 +134,7 @@ const ChatItem: React.FC<ChatItemProps> = ({
                                     onChangeText={setPlaceholderText}
                                     textBreakStrategy="simple"
                                     multiline
+                                    autoFocus
                                 />
                             </View>
                         </View>
diff --git a/components/ChatMenu/ChatWindow/ChatWindow.tsx b/components/ChatMenu/ChatWindow/ChatWindow.tsx
index 800a03f..e6c0dca 100644
--- a/components/ChatMenu/ChatWindow/ChatWindow.tsx
+++ b/components/ChatMenu/ChatWindow/ChatWindow.tsx
@@ -1,6 +1,6 @@
-import { StyleSheet, KeyboardAvoidingView, FlatList } from 'react-native'
+import { StyleSheet, FlatList } from 'react-native'
 import { ChatItem } from './ChatItem'
-import { Chats, Color, Global } from '@globals'
+import { Chats, Global } from '@globals'
 import { useMMKVBoolean, useMMKVString } from 'react-native-mmkv'
 import { useEffect, useRef } from 'react'
 
@@ -46,16 +46,17 @@ const ChatWindow = () => {
     }
 
     return (
-        <KeyboardAvoidingView style={styles.chatHistory}>
-            <FlatList
-                ref={flatListRef}
-                inverted
-                windowSize={3}
-                data={getItems()}
-                keyExtractor={(item) => item.key.toString()}
-                renderItem={renderItems}
-            />
-        </KeyboardAvoidingView>
+        <FlatList
+            style={styles.chatHistory}
+            ref={flatListRef}
+            keyboardShouldPersistTaps={'handled'}
+            removeClippedSubviews={false}
+            inverted
+            windowSize={3}
+            data={getItems()}
+            keyExtractor={(item) => item.key.toString()}
+            renderItem={renderItems}
+        />
     )
 }