-
Notifications
You must be signed in to change notification settings - Fork 420
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add support for bidirectional infinite scrolling #647
Add support for bidirectional infinite scrolling #647
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Added some notes
@@ -3,6 +3,8 @@ import { Dimension } from "../../../core/dependencies/LayoutProvider"; | |||
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
import debounce = require("lodash.debounce"); | |
import debounce from "lodash.debounce"; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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
@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 |
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:
onEndReached
would not be called unless anonEndReachedThreshold
is provided.iOS
IOSBidirectionalScroll.mov
Web
WebBidirectionalScroll.mov
Android
AndroidBidirectionalScroll.mov