support multiple configs

This commit is contained in:
Hailey
2024-07-25 09:06:22 -07:00
parent b0742d5ef0
commit 554b7d5dc7
+31 -22
View File
@@ -1,5 +1,10 @@
import React, {memo} from 'react'
import {FlatListProps, RefreshControl, ViewToken} from 'react-native'
import {
FlatListProps,
RefreshControl,
ViewabilityConfigCallbackPairs,
ViewToken,
} from 'react-native'
import {runOnJS, useSharedValue} from 'react-native-reanimated'
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
@@ -87,25 +92,30 @@ function ListImpl<ItemT>(
},
})
const [onViewableItemsChanged, viewabilityConfig] = React.useMemo(() => {
if (!onItemSeen) {
return [undefined, undefined]
}
return [
(info: {viewableItems: Array<ViewToken>; changed: Array<ViewToken>}) => {
console.log(info.viewableItems[0])
for (const item of info.changed) {
if (item.isViewable) {
onItemSeen(item.item)
}
}
},
{
itemVisiblePercentThreshold: 40,
minimumViewTime: 0,
},
]
}, [onItemSeen])
const viewabilityConfigCallbackPairs: ViewabilityConfigCallbackPairs =
React.useMemo(() => {
const pairs: ViewabilityConfigCallbackPairs = []
if (onItemSeen) {
pairs.push({
onViewableItemsChanged: (info: {
viewableItems: Array<ViewToken>
changed: Array<ViewToken>
}) => {
for (const item of info.changed) {
if (item.isViewable) {
onItemSeen(item.item)
}
}
},
viewabilityConfig: {
itemVisiblePercentThreshold: 40,
minimumViewTime: 1.5e3,
},
})
}
return pairs
}, [onItemSeen])
let refreshControl
if (refreshing !== undefined || onRefresh !== undefined) {
@@ -136,8 +146,7 @@ function ListImpl<ItemT>(
refreshControl={refreshControl}
onScroll={scrollHandler}
scrollEventThrottle={1}
onViewableItemsChanged={onViewableItemsChanged}
viewabilityConfig={viewabilityConfig}
viewabilityConfigCallbackPairs={viewabilityConfigCallbackPairs}
style={style}
ref={ref}
/>