Comments styling. Explain why the removeClippedSubviews is switched off

Expensify · Jul 10, 2023 · 143567b · 143567b
1 parent 45914bb
commit 143567b
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 11 deletions.
diff --git a/src/components/InvertedFlatList/CellRendererComponent/index.android.js b/src/components/InvertedFlatList/CellRendererComponent/index.android.js
@@ -15,11 +15,14 @@ function CellRendererComponent(props) {
             {...props}
             style={[
                 styles.invert,
-                // To achieve absolute positioning and handle overflows for list items,
-                // it is necessary to assign zIndex values. In the case of inverted lists,
-                // the lower list items will have higher zIndex values compared to the upper
-                // list items. Consequently, lower list items can overflow the upper list items.
-                // See: https://github.com/Expensify/App/issues/20451
+
+                /**
+                 * To achieve absolute positioning and handle overflows for list items,
+                 * it is necessary to assign zIndex values. In the case of inverted lists,
+                 * the lower list items will have higher zIndex values compared to the upper
+                 * list items. Consequently, lower list items can overflow the upper list items.
+                 * See: https://github.com/Expensify/App/issues/20451
+                 */
                 { zIndex: -props.index }
             ]}
         />

diff --git a/src/components/InvertedFlatList/CellRendererComponent/index.ios.js b/src/components/InvertedFlatList/CellRendererComponent/index.ios.js
@@ -21,11 +21,14 @@ 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,
-                // the lower list items will have higher zIndex values compared to the upper
-                // list items. Consequently, lower list items can overflow the upper list items.
-                // See: https://github.com/Expensify/App/issues/20451
+
+                /**
+                 * To achieve absolute positioning and handle overflows for list items,
+                 * it is necessary to assign zIndex values. In the case of inverted lists,
+                 * the lower list items will have higher zIndex values compared to the upper
+                 * list items. Consequently, lower list items can overflow the upper list items.
+                 * See: https://github.com/Expensify/App/issues/20451
+                 */
                 { zIndex: -props.index }
             ]}
         />

diff --git a/src/components/InvertedFlatList/index.android.js b/src/components/InvertedFlatList/index.android.js
@@ -48,7 +48,12 @@ class InvertedFlatList extends React.Component {
                 ListFooterComponentStyle={[styles.invert, this.props.ListFooterComponentStyle]}
                 verticalScrollbarPosition="left" // We are mirroring the X and Y axis, so we need to swap the scrollbar position
                 CellRendererComponent={CellRendererComponent}
-                // Enables absolute positioning with zIndex in the list. Source: https://reactnative.dev/docs/0.71/optimizing-flatlist-configuration#removeclippedsubviews
+
+                /**
+                 * 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}
             />
         );