[Fixed in 0.10.1] Exception in native call from JS (flat-list-mvcp on Android)

[BrianLi101]

Flagging this breaking issue so that hopefully the setup docs can be amended or changes can be made to flat-list-mvcp.

My team has been dealing with a bug for the last few days associated with using this package and the wrong version of flat-list-mvcp that results in the following exception when you attempt to open a <MessageList /> on Android:

Exception in native call from JS

This particular issue arises with version 0.0.9 of flat-list-mvcp but does not occur if we switch back to version 0.0.5.

To replicate this issue, open the stream-chat-react-native/examples/TypeScriptMessaging example. Before building the project on Android, run the following command yarn add @stream-io/flat-list-mvcp --save which will bump the flat-list-mvcp version from 0.0.5 in the package.json to 0.0.9. Click around into a few of the chats and you will be able to consistently reproduce the above error (it may take a few seconds before appearing).

This issue has been previously flagged for flat-list-mvcp noted in this issue and was supposed to be fixed by this PR for version 0.0.9. I will be flagging it again as an issue on flat-list-mvcp but wanted to make sure that something was recorded here to ensure other developers have to spend days going over issues that we've been able to identify.

For developers, you can downgrade your version of flat-list-mvcp to 0.0.5 to resolve this issue by running yarn add @stream-io/[email protected].

For the GetStream team, this particular issue is not noted in the Setup Docs likely because all of these libraries have been updated very very recently. The docs currently only specify a required version for react-native-reanimated for installation and don't have any restrictions on the version for flat-list-mvcp. I would recommend specifying a version for the time being to be 0.0.5 until these libraries are more stable.

P.S. Our team really appreciates all of the work the GetStream team takes out of building incredible chat experiences into our apps! Thank you!

gz#10043

[vishalnarkhede]

@BrianLi101 thanks for reporting this. I will take a look - 0.0.9 actually should have fixed it.

[vishalnarkhede]

@BrianLi101 could you please share some code around chat components? I want to reproduce this issue on our end!!

[BrianLi101]

Hi Vishal! We were actually able to make this happen without adding any custom code around chat components. Just using the demo typescript app was enough to replicate this error. If it helps, I can make some screen recordings and send them over.

[vishalnarkhede]

@BrianLi101 that will be quite helpful, thanks :)

[lc3t35]

I have the same error with "@stream-io/flat-list-mvcp": "^0.0.9", "react-native-bidirectional-infinite-scroll": "^0.3.2",

[vishalnarkhede]

@lc3t35 Could you please upgrade to @stream-io/[email protected], and let me know if you see this issue fixed? I have updated the native implementation to resolve this.

[lc3t35]

no more error with @stream-io/[email protected] ! congrats !

[vishalnarkhede]

Also @BrianLi101 ^^

[lc3t35]

Unfortunately I didn't wait long enough ... I still have the error with @stream-io/[email protected]

[vishalnarkhede]

Could you share some code? Want to see how I can reproduce it on my end

[lc3t35]

Here you are :

<FlatList
          data={momentsFiltered}
          keyExtractor={keyExtractor}
          renderItem={renderMomentItem}
          horizontal={false}
          numColumns={1}
          viewabilityConfig={viewConfigRef.current}
          onViewableItemsChanged={onViewRef.current}
          ref={setRef}
          onScrollToIndexFailed={onScrollToIndexFailedMoments}
          onEndReached={fetchMoments}
          onEndReachedThreshold={0.4}
          scrollEventThrottle={20}
          initialNumToRender={6} // https://reactnative.dev/docs/optimizing-flatlist-configuration
          bounces={false}
          windowSize={21}
          removeClippedSubviews
          maxToRenderPerBatch={10}
          updateCellsBatchingPeriod={100}
          showsVerticalScrollIndicator={false}
          ListFooterComponent={
            momentLoading ? <ActivityIndicator size='large' /> : renderFooter
          }
          maintainVisibleContentPosition={{
            autoscrollToTopThreshold: undefined,
            minIndexForVisible: 0,
          }}
/>

[EndlezzCoding]

Thanks dev for the hard work, it's a great library.

I see the same crash on Android, sometimes when updating the data prop of the flat list.
Is there a way to simply catch the exception on native side as a hot fix / exception handling while you are working on the solution?

[vishalnarkhede]

@lc3t35 @EndlezzCoding Just published a patch 0.10.1. There was leftover source for this issue (ConcurrentModificationException), which is fixed now. Please upgrade and let me know if you still see the issue :)

[lc3t35]

ok for me 0.10.1, no more crash, thank you @vishalnarkhede

[leoncitojuan]

ok para mí 0.10.1, no más accidentes, gracias @vishalnarkhede

hi, i get that error out of nowhere when i browse the app

[pr4deep94]

I am facing one issue in react native web

./node_modules/react-native-bidirectional-infinite-scroll/lib/module/BidirectionalFlatList.js:10
Module not found: Can't resolve '@stream-io/flat-list-mvcp'