Chat onStartReached loader fix

src/components/InvertedFlatList/index.native.tsx

@@ -1,18 +1,15 @@
 import type {ForwardedRef} from 'react';
 import React, {forwardRef} from 'react';
 import type {FlatList, FlatListProps} from 'react-native';
-import useThemeStyles from '@hooks/useThemeStyles';
 import BaseInvertedFlatList from './BaseInvertedFlatList';
 import CellRendererComponent from './CellRendererComponent';
 
 function BaseInvertedFlatListWithRef<T>(props: FlatListProps<T>, ref: ForwardedRef<FlatList>) {
- 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

src/components/InvertedFlatList/index.tsx

@@ -7,7 +7,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);
@@ -86,7 +86,6 @@ function InvertedFlatList<T>({onScroll: onScrollProp = () => {}, contentContaine
  // eslint-disable-next-line react/jsx-props-no-spreading
  {...props}
  ref={ref}
- contentContainerStyle={contentContainerStyle}
  onScroll={handleScroll}
  />
  );

src/styles/index.ts

@@ -1699,7 +1699,6 @@ const styles = (theme: ThemeColors) =>
  },
 
  chatContentScrollView: {
- flexGrow: 1,
  justifyContent: 'flex-end',
  paddingBottom: 16,
  },