From eb11948fd89aed04683e682b7aedc177524e4ce0 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 20 Dec 2023 13:00:33 +0100
Subject: [PATCH 1/4] clean contentContainerStyle from web component

---
 src/components/InvertedFlatList/index.js | 8 +-------
 1 file changed, 1 insertion(+), 7 deletions(-)

diff --git a/src/components/InvertedFlatList/index.js b/src/components/InvertedFlatList/index.js
index 815b58ad8308..a5470e03b5f7 100644
--- a/src/components/InvertedFlatList/index.js
+++ b/src/components/InvertedFlatList/index.js
@@ -10,10 +10,6 @@ const propTypes = {
         current: PropTypes.instanceOf(FlatList),
     }).isRequired,
 
-    /** Any additional styles to apply */
-    // eslint-disable-next-line react/forbid-prop-types
-    contentContainerStyle: PropTypes.any,
-
     /** Same as for FlatList */
     onScroll: PropTypes.func,
 };
@@ -21,7 +17,7 @@ const propTypes = {
 // This is adapted from https://codesandbox.io/s/react-native-dsyse
 // It's a HACK alert since FlatList has inverted scrolling on web
 function InvertedFlatList(props) {
-    const {innerRef, contentContainerStyle} = props;
+    const {innerRef} = props;
 
     const lastScrollEvent = useRef(null);
     const scrollEndTimeout = useRef(null);
@@ -106,7 +102,6 @@ function InvertedFlatList(props) {
             // eslint-disable-next-line react/jsx-props-no-spreading
             {...props}
             ref={innerRef}
-            contentContainerStyle={contentContainerStyle}
             onScroll={handleScroll}
         />
     );
@@ -114,7 +109,6 @@ function InvertedFlatList(props) {
 
 InvertedFlatList.propTypes = propTypes;
 InvertedFlatList.defaultProps = {
-    contentContainerStyle: {},
     onScroll: () => {},
 };
 InvertedFlatList.displayName = 'InvertedFlatList';

From 2571f83d26485d728833db94985d784a8d676429 Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 20 Dec 2023 13:00:58 +0100
Subject: [PATCH 2/4] clean contentContainerStyle from mobile component

---
 .../InvertedFlatList/index.native.js          | 33 ++++++++-----------
 1 file changed, 14 insertions(+), 19 deletions(-)

diff --git a/src/components/InvertedFlatList/index.native.js b/src/components/InvertedFlatList/index.native.js
index 59810cba62c4..8473b602d45f 100644
--- a/src/components/InvertedFlatList/index.native.js
+++ b/src/components/InvertedFlatList/index.native.js
@@ -1,26 +1,21 @@
 import React, {forwardRef} from 'react';
-import useThemeStyles from '@hooks/useThemeStyles';
 import BaseInvertedFlatList from './BaseInvertedFlatList';
 import CellRendererComponent from './CellRendererComponent';
 
-const BaseInvertedFlatListWithRef = forwardRef((props, ref) => {
-    const styles = useThemeStyles();
-    return (
-        <BaseInvertedFlatList
-            // eslint-disable-next-line react/jsx-props-no-spreading
-            {...props}
-            ref={ref}
-            contentContainerStyle={styles.justifyContentEnd}
-            CellRendererComponent={CellRendererComponent}
-            /**
-             * To achieve absolute positioning and handle overflows for list items, the property must be disabled
-             * for Android native builds.
-             * Source: https://reactnative.dev/docs/0.71/optimizing-flatlist-configuration#removeclippedsubviews
-             */
-            removeClippedSubviews={false}
-        />
-    );
-});
+const BaseInvertedFlatListWithRef = forwardRef((props, ref) => (
+    <BaseInvertedFlatList
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        {...props}
+        ref={ref}
+        CellRendererComponent={CellRendererComponent}
+        /**
+         * To achieve absolute positioning and handle overflows for list items, the property must be disabled
+         * for Android native builds.
+         * Source: https://reactnative.dev/docs/0.71/optimizing-flatlist-configuration#removeclippedsubviews
+         */
+        removeClippedSubviews={false}
+    />
+));
 
 BaseInvertedFlatListWithRef.displayName = 'BaseInvertedFlatListWithRef';
 

From d9e31111c5c5da97a5085452b59540cc3fa347be Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Wed, 20 Dec 2023 14:11:01 +0100
Subject: [PATCH 3/4] remove flexGrow

---
 src/styles/index.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/styles/index.ts b/src/styles/index.ts
index aececf93beb9..5788b1dbd12a 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -1688,7 +1688,6 @@ const styles = (theme: ThemeColors) =>
         },
 
         chatContentScrollView: {
-            flexGrow: 1,
             justifyContent: 'flex-end',
             paddingBottom: 16,
         },

From e0a591ed1876c203d5abda7329f464332aa90c8a Mon Sep 17 00:00:00 2001
From: Taras Perun <terry.perun@gmail.com>
Date: Sat, 30 Dec 2023 16:44:31 +0100
Subject: [PATCH 4/4] fix after merge

---
 src/components/InvertedFlatList/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/InvertedFlatList/index.tsx b/src/components/InvertedFlatList/index.tsx
index bfc0f7086228..c8d58299ddff 100644
--- a/src/components/InvertedFlatList/index.tsx
+++ b/src/components/InvertedFlatList/index.tsx
@@ -5,7 +5,7 @@ import BaseInvertedFlatList from './BaseInvertedFlatList';
 
 // This is adapted from https://codesandbox.io/s/react-native-dsyse
 // It's a HACK alert since FlatList has inverted scrolling on web
-function InvertedFlatList<T>({onScroll: onScrollProp = () => {}, contentContainerStyle, ...props}: FlatListProps<T>, ref: ForwardedRef<FlatList>) {
+function InvertedFlatList<T>({onScroll: onScrollProp = () => {}, ...props}: FlatListProps<T>, ref: ForwardedRef<FlatList>) {
     const lastScrollEvent = useRef<number | null>(null);
     const scrollEndTimeout = useRef<NodeJS.Timeout | null>(null);
     const updateInProgress = useRef<boolean>(false);