removed manual inverted list workaround

jabezX · Oct 11, 2023 · e00986d · e00986d
1 parent ac8000f
commit e00986d
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 166 deletions.
diff --git a/patches/react-native+0.72.4+003+VerticalScrollBarPosition.patch b/patches/react-native+0.72.4+003+VerticalScrollBarPosition.patch
diff --git a/src/components/InvertedFlatList/CellRendererComponent/index.android.js b/src/components/InvertedFlatList/CellRendererComponent/index.android.js
diff --git a/src/components/InvertedFlatList/index.android.js b/src/components/InvertedFlatList/index.android.js
diff --git a/src/components/InvertedFlatList/index.ios.js b/src/components/InvertedFlatList/index.ios.js
diff --git a/...atList/CellRendererComponent/index.ios.js → ...mponents/InvertedFlatList/index.native.js b/...atList/CellRendererComponent/index.ios.js → ...mponents/InvertedFlatList/index.native.js
@@ -1,18 +1,6 @@
-import React from 'react';
+import React, {forwardRef} from 'react';
 import {View} from 'react-native';
-import PropTypes from 'prop-types';
-
-const propTypes = {
-    /** Position index of the list item in a list view */
-    index: PropTypes.number.isRequired,
-
-    /** Styles that are passed to the component */
-    style: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]),
-};
-
-const defaultProps = {
-    style: {},
-};
+import BaseInvertedFlatList from './BaseInvertedFlatList';
 
 function CellRendererComponent(props) {
     return (
@@ -21,7 +9,6 @@ function CellRendererComponent(props) {
             {...props}
             style={[
                 props.style,
-
                 /**
                  * To achieve absolute positioning and handle overflows for list items,
                  * it is necessary to assign zIndex values. In the case of inverted lists,
@@ -35,8 +22,17 @@ function CellRendererComponent(props) {
     );
 }
 
-CellRendererComponent.propTypes = propTypes;
-CellRendererComponent.defaultProps = defaultProps;
-CellRendererComponent.displayName = 'CellRendererComponent';
-
-export default CellRendererComponent;
+export default 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}
+    />
+));
diff --git a/src/styles/styles.js b/src/styles/styles.js
@@ -2960,11 +2960,6 @@ const styles = (theme) => ({
         horizontal: windowWidth - 140,
     }),
 
-    invert: {
-        // It's important to invert the Y AND X axis to prevent a react native issue that can lead to ANRs on android 13
-        transform: [{scaleX: -1}, {scaleY: -1}],
-    },
-
     keyboardShortcutModalContainer: {
         maxHeight: '100%',
         flex: 0,