[DF] feat(#547): final cleanups

Shopify · Mar 30, 2023 · 8d7143c · 8d7143c
1 parent 530abe0
commit 8d7143c
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 43 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,8 +6,11 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
+
 - Fix definition conflicts with previous value
   - https://github.com/Shopify/flash-list/pull/795
+- Add support for `experimentalMaintainTopContentPosition`
+  - https://github.com/Shopify/flash-list/issues/547
 
 ## [1.4.2] - 2023-03-20
 

diff --git a/fixture/src/List.tsx b/fixture/src/List.tsx
@@ -9,65 +9,40 @@ import {
   Pressable,
   LayoutAnimation,
   StyleSheet,
-  Button,
 } from "react-native";
 import { FlashList } from "@shopify/flash-list";
-import { useFocusEffect } from "@react-navigation/native";
-import { TouchableOpacity } from "react-native-gesture-handler";
 
-interface ListItem {
-  value: number;
-  type?: string;
-}
-
-let newItemIndexes = 1001;
-
-const generateArray = (size: number): ListItem[] => {
-  const arr = new Array<ListItem>(size);
+const generateArray = (size: number) => {
+  const arr = new Array(size);
   for (let i = 0; i < size; i++) {
-    arr[i] = { value: i };
+    arr[i] = i;
   }
-
   return arr;
 };
 
 const List = () => {
   const [refreshing, setRefreshing] = useState(false);
   const [data, setData] = useState(generateArray(100));
-  const [isLoading, setIsLoading] = useState(false);
 
-  const list = useRef<FlashList<ListItem> | null>(null);
-
-  useFocusEffect(
-    React.useCallback(() => {
-      newItemIndexes = 1001;
-    }, [])
-  );
+  const list = useRef<FlashList<number> | null>(null);
 
   const removeItem = (item: number) => {
     setData(
       data.filter((dataItem) => {
-        return dataItem.value !== item;
+        return dataItem !== item;
       })
     );
     list.current?.prepareForLayoutAnimationRender();
     // after removing the item, we start animation
     LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
   };
 
-  const renderItem = ({ item }: { item: ListItem }) => {
-    const backgroundColor = item.value % 2 === 0 ? "#00a1f1" : "#ffbb00";
-
-    // if (Number(item.value) >= 90 && Number(item.value) <= 99) {
-    //   return <View />;
-    // }
-    // item.value % 2 === 0
-    // ? 100 + (item.value > 1000 ? item.value / 10 : item.value) + 1
-    // : 200 + (item.value > 1000 ? item.value / 10 : item.value),
+  const renderItem = ({ item }: { item: number }) => {
+    const backgroundColor = item % 2 === 0 ? "#00a1f1" : "#ffbb00";
     return (
       <Pressable
         onPress={() => {
-          removeItem(item.value);
+          removeItem(item);
         }}
       >
         <View
@@ -77,7 +52,7 @@ const List = () => {
             height: item % 2 === 0 ? 100 : 200,
           }}
         >
-          <Text>Cell Id: {item.value}</Text>
+          <Text>Cell Id: {item}</Text>
         </View>
       </Pressable>
     );

diff --git a/ios/Sources/AutoLayoutView.swift b/ios/Sources/AutoLayoutView.swift
@@ -51,12 +51,6 @@ import UIKit
     /// Tracks where first pixel is drawn in the visible window
     private var lastMinBound: CGFloat = 0
 
-    /// Marks the first Item in the Scroll View
-    private var firstItemMarker: CellContainer? = nil
-
-    /// The position of the item in the Scroll View after insertion / deletion
-    private var previousMarkerOffset: CGFloat = -1
-
     /// State that informs us whether this is the first render
     private var isInitialRender: Bool = true
 

diff --git a/src/FlashList.tsx b/src/FlashList.tsx
@@ -160,7 +160,6 @@ class FlashList<T> extends React.PureComponent<
     prevState: FlashListState<T>
   ): FlashListState<T> {
     const newState = { ...prevState };
-
     if (prevState.numColumns !== nextProps.numColumns) {
       newState.numColumns = nextProps.numColumns || 1;
       newState.layoutProvider = FlashList.getLayoutProvider<T>(
@@ -172,8 +171,6 @@ class FlashList<T> extends React.PureComponent<
         newState.numColumns,
         nextProps
       );
-      // RLV retries to reposition the first visible item on layout provider change.
-      // It's not required in our case so we're disabling it
     }
     if (nextProps.data !== prevState.data) {
       newState.data = nextProps.data;
@@ -188,6 +185,9 @@ class FlashList<T> extends React.PureComponent<
       newState.extraData = { value: nextProps.extraData };
     }
     newState.renderItem = nextProps.renderItem;
+
+    // RLV retries to reposition the first visible item on layout provider change.
+    // It's not required in our case so we're disabling it
     newState.layoutProvider.shouldRefreshWithAnchoring = false;
     return newState;
   }