Fix: New chat messages not displayed when the chat was empty upon ope…

…ning (#9) * feat: add ref prop to listview props type and handle keyboard from GiftedChat component and pass inputToolbarPosition prop to InputToolbar component * feat: add reanimated to the container of the messageContainer component * chore: install react-native-reanimated version 2.14.4 * Fix: reanimated versioning issue * feat: Add estimated height to list * add: yarn.lock * fix: Correctly get width from screen dimensions * remove: prop onInitialLayoutView * fix: New chat messages not displayed when the chat was empty upon opening * chore: update snapshot --------- Co-authored-by: Jose Manuel Tuberquia <[email protected]>
2060-io · Aug 29, 2023 · 56bf3e6 · 56bf3e6
1 parent 1f26a94
commit 56bf3e6
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 12 deletions.
diff --git a/package.json b/package.json
@@ -111,4 +111,4 @@
       "pre-commit": "yarn lint:fix && yarn prettier && yarn tsc"
     }
   }
-}
+}
diff --git a/src/MessageContainer.tsx b/src/MessageContainer.tsx
@@ -12,7 +12,6 @@ import {
   StyleProp,
   ViewStyle,
   Platform,
-  Dimensions,
 } from 'react-native'
 
 import { LoadEarlier, LoadEarlierProps } from './LoadEarlier'
@@ -65,7 +64,6 @@ const styles = StyleSheet.create({
   },
 })
 
-const screenWidth = Dimensions.get('screen').width
 export interface MessageContainerProps<TMessage extends IMessage> {
   messages?: TMessage[]
   isTyping?: boolean
@@ -363,7 +361,7 @@ export default class MessageContainer<
           onEndReachedThreshold={0.1}
           estimatedListSize={{
             height: Math.floor(this.props.listContainerHeight),
-            width: screenWidth,
+            width: 400,
           }}
           {...this.props.listViewProps}
         />

diff --git a/src/__tests__/__snapshots__/MessageContainer.test.tsx.snap b/src/__tests__/__snapshots__/MessageContainer.test.tsx.snap
@@ -38,7 +38,7 @@ exports[`should render <MessageContainer /> and compare with snapshot 1`] = `
         }
       }
       contentHeight={0}
-      contentWidth={750}
+      contentWidth={400}
       data={Array []}
       dataProvider={
         DataProvider {
@@ -93,19 +93,19 @@ exports[`should render <MessageContainer /> and compare with snapshot 1`] = `
             "_maxSpan": 1,
             "_renderWindowSize": Object {
               "height": 0,
-              "width": 750,
+              "width": 400,
             },
             "_totalHeight": 0,
-            "_totalWidth": 750,
+            "_totalWidth": 400,
             "_window": Object {
               "height": 0,
-              "width": 750,
+              "width": 400,
             },
           },
           "_maxSpan": 1,
           "_renderWindowSize": Object {
             "height": 0,
-            "width": 750,
+            "width": 400,
           },
           "_setLayoutForType": [Function],
           "_tempDim": Object {
@@ -138,7 +138,7 @@ exports[`should render <MessageContainer /> and compare with snapshot 1`] = `
             "data": Array [],
             "estimatedListSize": Object {
               "height": 0,
-              "width": 750,
+              "width": 400,
             },
             "extraData": Array [
               null,
@@ -165,7 +165,7 @@ exports[`should render <MessageContainer /> and compare with snapshot 1`] = `
       layoutSize={
         Object {
           "height": 0,
-          "width": 750,
+          "width": 400,
         }
       }
       maxRenderAhead={750}
@@ -283,7 +283,7 @@ exports[`should render <MessageContainer /> and compare with snapshot 1`] = `
             style={
               Object {
                 "height": 0,
-                "width": 750,
+                "width": 400,
               }
             }
             windowSize={0}
-Original file line number
+Diff line change
@@ Expand Up / @@ -111,4 +111,4 @@ @@
           "pre-commit": "yarn lint:fix && yarn prettier && yarn tsc"
         }
       }
-    }
+    }