Add support for bidirectional infinite scrolling #647
Conversation
| import BaseScrollComponent, { ScrollComponentProps } from "../../../core/scrollcomponent/BaseScrollComponent"; | ||
| import BaseScrollView, { ScrollEvent } from "../../../core/scrollcomponent/BaseScrollView"; | ||
| import ScrollViewer from "./ScrollViewer"; | ||
| import debounce = require("lodash.debounce"); |
There was a problem hiding this comment.
| import debounce = require("lodash.debounce"); | |
| import debounce from "lodash.debounce"; |
There was a problem hiding this comment.
Yeah, something funky is going on here and I think that the dynamic require might be necessary. It was like this elsewhere in the library too, but IDK why 🤷
| const onStartReachedCalled = this._onStartReachedCalled; | ||
| if (newProps.dataProvider.getSize() > this.props.dataProvider.getSize()) { | ||
| this._onEndReachedCalled = false; | ||
| this._setOnEdgeReachedCalled(false); |
There was a problem hiding this comment.
We're caching the current value of onStartReached but it could change (to false) if we enter the next if block
Then the following expression can still pass
if (viewabilityTracker && onStartReachedCalled) {Can't we use this._onStartReachedCalled there?
Having to cache the value and not use the latest seems a bit fishy
roryabraham
changed the title
|
@naqvitalha I've taken this out of draft and would love a review when you have some time 🙏 I'm happy to adjust the PR or answer any questions you might have. Thanks 😄 Example implementation (modified from the example created in this Youtube video series): https://github.com/roryabraham/RecyclerListViewExample |
|
Disclaimer: I tested in react-native-web but not pure React.JS |
|
What about merge this PR? |
|
Why this pr was not continue? |
|
I also need this feature. Hope to merge soon. |
|
I don't have plans of continuing this implementation anytime soon because we ended up implementing bidirectional pagination directly in React Native's VirtualizedList. For anyone who wants to continue with this PR, I got stuck with a bug where content would sometimes infinitely load until you reached the start of the list because The problem is explained here |
5 participants
Hi @naqvitalha 👋
Thanks for all your hard work on this repo so far! I'm exploring the possibility of integrating this repo into Expensify, and one of our requirements is an infinite bidirectional scrolling list, and I hope that we can work together to bring this desperately-needed functionality to the React Native community.
So this pull request fixes the following issues:
onEndReachedwould not be called unless anonEndReachedThresholdis provided.iOS
IOSBidirectionalScroll.mov
Web
WebBidirectionalScroll.mov
Android
AndroidBidirectionalScroll.mov