stream-chat-react-native VS flat-list-mvcp

​ There have been many discussions on Stack Overflow and GitHub around implementing infinite scroll using React Native, on top of FlatList or SectionList. I've found that there aren't any easy solution out there for bidirectional infinite scroll, which works on both Android and iOS. Recently, while working on v3.0.0 of React Native Chat SDK at Stream, we added bidirectional infinite scroll to our chat components. We had to jump through plenty of hurdles to make it happen while maintaining a good user experience around scrolling (especially for Android). Thus we decided to publish an excellent and small open-source package, on top of FlatList, to make this task easier for other React Native developers.​

How did you solve the issue of seeing the chat history? In the normal FlatList if you prepend items to the top of the list the scroll position flies all the way to the top, terrible UX. I had to dig around and try to fix this for an entire week. Tried inverting the FlatList which made it drop to 10 fps on my Android device, and inverting with styling caused weird empty spaces to form. Finally ended up with this small library which is mostly acceptable.

FlatList from React Native accepts a prop - maintainVisibleContentPosition, which makes sure your scroll doesn't jump to the end of the list when more items are added to the list. But this prop is only supported on iOS for now. So taking some inspiration from this PR, we published our separate package to add support for this prop on Android - flat-list-mvcp. And thus @stream-io/flat-list-mvcp is a dependency of the react-native-bidirectional-scroll package. ​