From a7c2370680616ee5ca1bc8ce8194829c9f09f603 Mon Sep 17 00:00:00 2001
From: Hailey <me@haileyok.com>
Date: Mon, 20 May 2024 18:03:53 -0700
Subject: [PATCH] =?UTF-8?q?[=F0=9F=90=B4]=20set=20layout=20height=20in=20`?=
 =?UTF-8?q?onLayout`=20(#4135)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* set layout height in `onLayout`

* keep setting it in `onScroll` too
---
 .../Messages/Conversation/MessagesList.tsx    | 34 ++++++++++++-------
 1 file changed, 22 insertions(+), 12 deletions(-)

diff --git a/src/screens/Messages/Conversation/MessagesList.tsx b/src/screens/Messages/Conversation/MessagesList.tsx
index 167cc72b..ce466d95 100644
--- a/src/screens/Messages/Conversation/MessagesList.tsx
+++ b/src/screens/Messages/Conversation/MessagesList.tsx
@@ -1,5 +1,5 @@
 import React, {useCallback, useRef} from 'react'
-import {FlatList, View} from 'react-native'
+import {FlatList, LayoutChangeEvent, View} from 'react-native'
 import {
   KeyboardStickyView,
   useKeyboardHandler,
@@ -292,14 +292,24 @@ export function MessagesList({
   )
 
   // -- List layout changes (opening emoji keyboard, etc.)
-  const onListLayout = React.useCallback(() => {
-    if (isWeb || !keyboardIsOpening.value) {
-      flatListRef.current?.scrollToEnd({
-        animated: !layoutScrollWithoutAnimation.value,
-      })
-      layoutScrollWithoutAnimation.value = false
-    }
-  }, [flatListRef, keyboardIsOpening.value, layoutScrollWithoutAnimation])
+  const onListLayout = React.useCallback(
+    (e: LayoutChangeEvent) => {
+      layoutHeight.value = e.nativeEvent.layout.height
+
+      if (isWeb || !keyboardIsOpening.value) {
+        flatListRef.current?.scrollToEnd({
+          animated: !layoutScrollWithoutAnimation.value,
+        })
+        layoutScrollWithoutAnimation.value = false
+      }
+    },
+    [
+      flatListRef,
+      keyboardIsOpening.value,
+      layoutScrollWithoutAnimation,
+      layoutHeight,
+    ],
+  )
 
   const scrollToEndOnPress = React.useCallback(() => {
     flatListRef.current?.scrollToOffset({
@@ -347,9 +357,9 @@ export function MessagesList({
           footer
         ) : (
           <>
-            {isConvoActive(convoState) && convoState.items.length === 0 && (
-              <ChatEmptyPill />
-            )}
+            {isConvoActive(convoState) &&
+              !convoState.isFetchingHistory &&
+              convoState.items.length === 0 && <ChatEmptyPill />}
             <MessageInput onSendMessage={onSendMessage} />
           </>
         )}