fix: add a log that complains for removal for mvcp package on RN version <0.72 (#2724)

* fix: add a log that complains for removal for mvcp package on RN version <0.72

* fix: add a log that complains for removal for mvcp package on RN version <0.72

* fix: build issues

* fix: add variable under the if block

Co-authored-by: Oliver Lazoroski <[email protected]>

* fix: log

---------

Co-authored-by: Oliver Lazoroski <[email protected]>

Author: khushal87

package/native-package/src/optionalDependencies/FlatList.ts

@@ -1,7 +1,21 @@
+import { FlatList as DefaultFlatList, Platform } from 'react-native';
 let FlatList;
 
-try {
-  FlatList = require('@stream-io/flat-list-mvcp').FlatList;
-} catch (e) {
-  console.log("@stream-io/flat-list-mvcp not found, using react-native's FlatList");
+
+if (Platform.constants.reactNativeVersion.minor < 72) {
+  const upgradeLog =
+  "'@stream-io/flat-list-mvcp' is deprecated, please upgrade your react-native version to >0.71 to get same the benefits on the default FlatList and uninstall the package.";
+  try {
+    FlatList = require('@stream-io/flat-list-mvcp').FlatList;
+    console.log(upgradeLog);
+  } catch (error) {
+    console.log(
+      `@stream-io/flat-list-mvcp not found, using react-native's FlatList. This library is used to achieve bi-directional infinite scrolling on lower react native versions. ${upgradeLog}`,
+    );
+    FlatList = require('react-native').FlatList;
+  }
+} else {
+  FlatList = DefaultFlatList;
 }
+
+export { FlatList };

package/src/contexts/messagesContext/MessagesContext.tsx

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren, useContext } from 'react';
 
-import { FlatList, PressableProps } from 'react-native';
+import { PressableProps } from 'react-native';
 
 import type { Attachment, ChannelState, MessageResponse } from 'stream-chat';
 
@@ -64,6 +64,7 @@ import type { SuggestionCommand } from '../suggestionsContext/SuggestionsContext
 import type { DeepPartial } from '../themeContext/ThemeContext';
 import type { Theme } from '../themeContext/utils/theme';
 import { DEFAULT_BASE_CONTEXT_VALUE } from '../utils/defaultBaseContextValue';
+import { FlatList } from '../../native';
 
 import { isTestEnvironment } from '../utils/isTestEnvironment';
 
@@ -118,7 +119,7 @@ export type MessagesContextValue<
    * Defaults to: https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Attachment/FileIcon.tsx
    */
   FileAttachmentIcon: React.ComponentType<FileIconProps>;
-  FlatList: typeof FlatList;
+  FlatList: typeof FlatList | undefined;
   /**
    * UI component to display image attachments
    * Defaults to: [Gallery](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Attachment/Gallery.tsx)

package/src/native.ts

@@ -25,7 +25,7 @@ export let compressImage: CompressImage = fail;
 type DeleteFile = ({ uri }: { uri: string }) => Promise<boolean> | never;
 export let deleteFile: DeleteFile = fail;
 
-export let FlatList = DefaultFlatList;
+export let FlatList: typeof DefaultFlatList | undefined = undefined;
 
 type GetLocalAssetUri = (uriOrAssetId: string) => Promise<string | undefined> | never;
 export let getLocalAssetUri: GetLocalAssetUri = fail;
@@ -309,7 +309,7 @@ export const registerNativeHandlers = (handlers: Handlers) => {
     deleteFile = handlers.deleteFile;
   }
 
-  if (handlers.FlatList) {
+  if (handlers.FlatList !== undefined) {
     FlatList = handlers.FlatList;
   }