stream-chat-react-native-core 5.39.5 → 5.40.0-rc.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-react-native-core",
   "description": "The official React Native and Expo components for Stream Chat, a service for building chat applications",
-  "version": "5.39.5",
+  "version": "5.40.0-rc.2",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
@@ -22,7 +22,6 @@
     "README.md"
   ],
   "scripts": {
-    "analyze": "yarn build -- --stats && webpack-bundle-analyzer build/bundle-stats.json",
     "build": "rm -rf lib && yarn run --silent build-translations && bob build && yarn run --silent copy-translations",
     "build-translations": "i18next",
     "copy-translations": "echo '\u001b[34mℹ\u001b[0m Copying translation files to \u001b[34mlib/typescript/i18n\u001b[0m' && cp -R -f ./src/i18n ./lib/typescript/i18n && echo '\u001b[32m✓\u001b[0m Done Copying Translations'",
@@ -81,11 +80,15 @@
     "stream-chat": "8.40.8"
   },
   "peerDependencies": {
-    "react-native-quick-sqlite": ">=5.1.0",
-    "react-native-svg": ">=15.1.0"
+    "@op-engineering/op-sqlite": ">=6.0.4",
+    "@react-native-community/netinfo": ">=11.3.1",
+    "react-native": ">=0.67.0",
+    "react-native-svg": ">=12.3.0",
+    "react-native-gesture-handler": ">=2.14.0",
+    "react-native-reanimated": ">=3.8.0"
   },
   "peerDependenciesMeta": {
-    "react-native-quick-sqlite": {
+    "@op-engineering/op-sqlite": {
       "optional": true
     }
   },
@@ -100,9 +103,10 @@
     "@babel/preset-env": "7.13.12",
     "@babel/preset-typescript": "7.13.0",
     "@babel/runtime": "^7.20.0",
+    "@op-engineering/op-sqlite": "^6.0.4",
     "@react-native-community/eslint-config": "2.0.0",
     "@react-native-community/eslint-plugin": "1.1.0",
-    "@react-native-community/netinfo": "6.0.0",
+    "@react-native-community/netinfo": "^11.3.2",
     "@react-native/babel-preset": "0.73.21",
     "@testing-library/jest-native": "^5.4.3",
     "@testing-library/react-native": "12.4.5",
@@ -138,18 +142,14 @@
     "moment-timezone": "^0.5.45",
     "prettier": "2.8.8",
     "react": "18.2.0",
-    "react-docgen-typescript": "1.22.0",
-    "react-dom": "18.2.0",
     "react-native": "0.73.6",
     "react-native-builder-bob": "0.23.1",
     "react-native-gesture-handler": "~2.8.0",
-    "react-native-quick-sqlite": "5.1.0",
     "react-native-reanimated": "3.7.0",
     "react-native-svg": "15.1.0",
     "react-test-renderer": "18.2.0",
     "typescript": "5.0.4",
-    "uuid": "^8.3.2",
-    "webpack": "4.44.2"
+    "uuid": "^8.3.2"
   },
   "resolutions": {
     "@types/react": "18.2.6"

package/src/__tests__/offline-support/offline-feature.js

@@ -35,8 +35,8 @@ import { generateReaction } from '../../mock-builders/generator/reaction';
 import { generateUser } from '../../mock-builders/generator/user';
 import { getTestClientWithUser } from '../../mock-builders/mock';
 import { convertFilterSortToQuery } from '../../store/apis/utils/convertFilterSortToQuery';
-import { QuickSqliteClient } from '../../store/QuickSqliteClient';
 import { tables } from '../../store/schema';
+import { SqliteClient } from '../../store/SqliteClient';
 import { BetterSqlite } from '../../test-utils/BetterSqlite';
 
 /**
@@ -79,13 +79,13 @@ export const Generic = () => {
     beforeEach(async () => {
       jest.clearAllMocks();
       chatClient = await getTestClientWithUser({ id: 'dan' });
-      QuickSqliteClient.dropTables();
-      QuickSqliteClient.closeDB();
+      SqliteClient.dropTables();
+      SqliteClient.closeDB();
     });
 
     afterEach(() => {
-      QuickSqliteClient.dropTables();
-      QuickSqliteClient.closeDB();
+      SqliteClient.dropTables();
+      SqliteClient.closeDB();
       cleanup();
     });
 

package/src/__tests__/offline-support/optimistic-update.js

@@ -24,7 +24,7 @@ import { generateReaction } from '../../mock-builders/generator/reaction';
 import { generateUser } from '../../mock-builders/generator/user';
 import { getTestClientWithUser } from '../../mock-builders/mock';
 import { upsertChannels } from '../../store/apis';
-import { QuickSqliteClient } from '../../store/QuickSqliteClient';
+import { SqliteClient } from '../../store/SqliteClient';
 import { BetterSqlite } from '../../test-utils/BetterSqlite';
 
 test('Workaround to allow exporting tests', () => expect(true).toBe(true));
@@ -108,7 +108,7 @@ export const OptimisticUpdates = () => {
       channel.id = channelResponse.channel.id;
 
       // Populate the DB with channel
-      QuickSqliteClient.initializeDatabase();
+      SqliteClient.initializeDatabase();
       upsertChannels({
         channels: [channelResponse],
         isLatestMessagesSet: true,
@@ -116,8 +116,8 @@ export const OptimisticUpdates = () => {
     });
 
     afterEach(() => {
-      QuickSqliteClient.dropTables();
-      QuickSqliteClient.closeDB();
+      SqliteClient.dropTables();
+      SqliteClient.closeDB();
       cleanup();
     });
 

package/src/components/Attachment/Attachment.tsx

@@ -11,7 +11,7 @@ import {
   MessagesContextValue,
   useMessagesContext,
 } from '../../contexts/messagesContext/MessagesContext';
-import { isVideoPackageAvailable } from '../../native';
+import { isVideoPlayerAvailable } from '../../native';
 
 import { DefaultStreamChatGenerics, FileTypes } from '../../types/types';
 
@@ -75,7 +75,7 @@ const AttachmentWithContext = <
   }
 
   if (attachment.type === FileTypes.Video && !attachment.og_scrape_url) {
-    return isVideoPackageAvailable() ? (
+    return isVideoPlayerAvailable() ? (
       <>
         <Gallery videos={[attachment]} />
         {hasAttachmentActions && (

package/src/components/Attachment/Card.tsx

@@ -2,11 +2,11 @@ import React from 'react';
 import {
   Image,
   ImageStyle,
+  Pressable,
   StyleProp,
   StyleSheet,
   Text,
   TextStyle,
-  TouchableOpacity,
   View,
   ViewStyle,
 } from 'react-native';
@@ -29,7 +29,7 @@ import { useTheme } from '../../contexts/themeContext/ThemeContext';
 import { Play } from '../../icons/Play';
 import { DefaultStreamChatGenerics, FileTypes } from '../../types/types';
 import { makeImageCompatibleUrl } from '../../utils/utils';
-import { ImageBackground } from '../ImageBackground';
+import { ImageBackground } from '../UIComponents/ImageBackground';
 
 const styles = StyleSheet.create({
   authorName: { fontSize: 14.5, fontWeight: '600' },
@@ -92,7 +92,7 @@ export type CardPropsWithContext<
   > &
   Pick<
     MessagesContextValue<StreamChatGenerics>,
-    'additionalTouchableProps' | 'CardCover' | 'CardFooter' | 'CardHeader' | 'myMessageTheme'
+    'additionalPressableProps' | 'CardCover' | 'CardFooter' | 'CardHeader' | 'myMessageTheme'
   > & {
     channelId: string | undefined;
     messageId: string | undefined;
@@ -116,7 +116,7 @@ const CardWithContext = <
   props: CardPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
-    additionalTouchableProps,
+    additionalPressableProps,
     author_name,
     CardCover,
     CardFooter,
@@ -163,7 +163,7 @@ const CardWithContext = <
   const isVideoCard = type === FileTypes.Video && og_scrape_url;
 
   return (
-    <TouchableOpacity
+    <Pressable
       disabled={preventPress}
       onLongPress={(event) => {
         if (onLongPress) {
@@ -196,7 +196,7 @@ const CardWithContext = <
       }}
       style={[styles.container, container, stylesProp.container]}
       testID='card-attachment'
-      {...additionalTouchableProps}
+      {...additionalPressableProps}
     >
       {CardHeader && <CardHeader {...props} />}
       {CardCover && <CardCover {...props} />}
@@ -285,7 +285,7 @@ const CardWithContext = <
           </View>
         </View>
       )}
-    </TouchableOpacity>
+    </Pressable>
   );
 };
 
@@ -316,7 +316,7 @@ export type CardProps<
       > &
       Pick<
         MessagesContextValue<StreamChatGenerics>,
-        'additionalTouchableProps' | 'CardCover' | 'CardFooter' | 'CardHeader'
+        'additionalPressableProps' | 'CardCover' | 'CardFooter' | 'CardHeader'
       >
   >;
 
@@ -331,14 +331,14 @@ export const Card = <
   const { ImageComponent } = useChatContext<StreamChatGenerics>();
   const { message, onLongPress, onPress, onPressIn, preventPress } =
     useMessageContext<StreamChatGenerics>();
-  const { additionalTouchableProps, CardCover, CardFooter, CardHeader, myMessageTheme } =
+  const { additionalPressableProps, CardCover, CardFooter, CardHeader, myMessageTheme } =
     useMessagesContext<StreamChatGenerics>();
 
   return (
     <MemoizedCard
       key={`${message?.id}${message?.updated_at}`} // press listeners must change on message update, updating key ensures this
       {...{
-        additionalTouchableProps,
+        additionalPressableProps,
         CardCover,
         CardFooter,
         CardHeader,

package/src/components/Attachment/FileAttachment.tsx

@@ -1,13 +1,5 @@
 import React from 'react';
-import {
-  StyleProp,
-  StyleSheet,
-  Text,
-  TextStyle,
-  TouchableOpacity,
-  View,
-  ViewStyle,
-} from 'react-native';
+import { Pressable, StyleProp, StyleSheet, Text, TextStyle, View, ViewStyle } from 'react-native';
 
 import type { Attachment } from 'stream-chat';
 
@@ -54,7 +46,7 @@ export type FileAttachmentPropsWithContext<
 > &
   Pick<
     MessagesContextValue<StreamChatGenerics>,
-    'additionalTouchableProps' | 'AttachmentActions' | 'FileAttachmentIcon'
+    'additionalPressableProps' | 'AttachmentActions' | 'FileAttachmentIcon'
   > & {
     /** The attachment to render */
     attachment: Attachment<StreamChatGenerics>;
@@ -73,7 +65,7 @@ const FileAttachmentWithContext = <
   props: FileAttachmentPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
-    additionalTouchableProps,
+    additionalPressableProps,
     attachment,
     AttachmentActions,
     attachmentSize,
@@ -98,7 +90,7 @@ const FileAttachmentWithContext = <
   const defaultOnPress = () => openUrlSafely(attachment.asset_url);
 
   return (
-    <TouchableOpacity
+    <Pressable
       disabled={preventPress}
       onLongPress={(event) => {
         if (onLongPress) {
@@ -130,7 +122,7 @@ const FileAttachmentWithContext = <
         }
       }}
       testID='file-attachment'
-      {...additionalTouchableProps}
+      {...additionalPressableProps}
     >
       <View style={[styles.container, { backgroundColor: white }, container, stylesProp.container]}>
         <FileAttachmentIcon mimeType={attachment.mime_type} size={attachmentSize} />
@@ -153,7 +145,7 @@ const FileAttachmentWithContext = <
         </View>
       </View>
       {attachment.actions?.length ? <AttachmentActions {...attachment} /> : null}
-    </TouchableOpacity>
+    </Pressable>
   );
 };
 
@@ -169,7 +161,7 @@ export const FileAttachment = <
 ) => {
   const { onLongPress, onPress, onPressIn, preventPress } = useMessageContext<StreamChatGenerics>();
   const {
-    additionalTouchableProps,
+    additionalPressableProps,
     AttachmentActions = AttachmentActionsDefault,
     FileAttachmentIcon = FileIconDefault,
   } = useMessagesContext<StreamChatGenerics>();
@@ -177,7 +169,7 @@ export const FileAttachment = <
   return (
     <FileAttachmentWithContext
       {...{
-        additionalTouchableProps,
+        additionalPressableProps,
         AttachmentActions,
         FileAttachmentIcon,
         onLongPress,

package/src/components/Attachment/FileAttachmentGroup.tsx

@@ -15,7 +15,7 @@ import {
   useMessagesContext,
 } from '../../contexts/messagesContext/MessagesContext';
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
-import { isAudioPackageAvailable } from '../../native';
+import { isSoundPackageAvailable } from '../../native';
 
 import { DefaultStreamChatGenerics, FileTypes } from '../../types/types';
 
@@ -123,7 +123,7 @@ const FileAttachmentGroupWithContext = <
           ]}
         >
           {(file.type === FileTypes.Audio || file.type === FileTypes.VoiceRecording) &&
-          isAudioPackageAvailable() ? (
+          isSoundPackageAvailable() ? (
             <AudioAttachment
               item={{
                 duration: file.duration,

package/src/components/Attachment/Gallery.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
 
 import type { Attachment } from 'stream-chat';
 
@@ -13,6 +13,7 @@ import { getGalleryImageBorderRadius } from './utils/getGalleryImageBorderRadius
 import { openUrlSafely } from './utils/openUrlSafely';
 
 import type { MessageType } from '../../components/MessageList/hooks/useMessageList';
+import { useChatConfigContext } from '../../contexts/chatConfigContext/ChatConfigContext';
 import {
   ImageGalleryContextValue,
   useImageGalleryContext,
@@ -31,7 +32,7 @@ import {
 } from '../../contexts/overlayContext/OverlayContext';
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
 import { useLoadingImage } from '../../hooks/useLoadingImage';
-import { isVideoPackageAvailable } from '../../native';
+import { isVideoPlayerAvailable } from '../../native';
 import { DefaultStreamChatGenerics, FileTypes } from '../../types/types';
 import { getUrlWithoutParams } from '../../utils/utils';
 
@@ -52,7 +53,7 @@ export type GalleryPropsWithContext<
   > &
   Pick<
     MessagesContextValue<StreamChatGenerics>,
-    | 'additionalTouchableProps'
+    | 'additionalPressableProps'
     | 'legacyImageViewerSwipeBehaviour'
     | 'VideoThumbnail'
     | 'ImageLoadingIndicator'
@@ -83,7 +84,7 @@ const GalleryWithContext = <
   props: GalleryPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
-    additionalTouchableProps,
+    additionalPressableProps,
     alignment,
     groupStyles,
     hasThreadReplies,
@@ -104,6 +105,7 @@ const GalleryWithContext = <
     VideoThumbnail,
   } = props;
 
+  const { resizableCDNHosts } = useChatConfigContext();
   const {
     theme: {
       messageSimple: {
@@ -139,6 +141,7 @@ const GalleryWithContext = <
     () =>
       buildGallery({
         images: imagesAndVideos,
+        resizableCDNHosts,
         sizeConfig,
       }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -197,7 +200,7 @@ const GalleryWithContext = <
 
               return (
                 <GalleryThumbnail
-                  additionalTouchableProps={additionalTouchableProps}
+                  additionalPressableProps={additionalPressableProps}
                   borderRadius={borderRadius}
                   colIndex={colIndex}
                   ImageLoadingFailedIndicator={ImageLoadingFailedIndicator}
@@ -248,7 +251,7 @@ type GalleryThumbnailProps<
   thumbnail: Thumbnail;
 } & Pick<
   MessagesContextValue<StreamChatGenerics>,
-  | 'additionalTouchableProps'
+  | 'additionalPressableProps'
   | 'legacyImageViewerSwipeBehaviour'
   | 'VideoThumbnail'
   | 'ImageLoadingIndicator'
@@ -264,7 +267,7 @@ type GalleryThumbnailProps<
 const GalleryThumbnail = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >({
-  additionalTouchableProps,
+  additionalPressableProps,
   borderRadius,
   colIndex,
   ImageLoadingFailedIndicator,
@@ -312,7 +315,7 @@ const GalleryThumbnail = <
   const defaultOnPress = () => {
     // If the url is defined then only try to open the file.
     if (thumbnail.url) {
-      if (thumbnail.type === FileTypes.Video && !isVideoPackageAvailable()) {
+      if (thumbnail.type === FileTypes.Video && !isVideoPlayerAvailable()) {
         // This condition is kinda unreachable, since we render videos as file attachment if the video
         // library is not installed. But doesn't hurt to have extra safeguard, in case of some customizations.
         openUrlSafely(thumbnail.url);
@@ -323,8 +326,7 @@ const GalleryThumbnail = <
   };
 
   return (
-    <TouchableOpacity
-      activeOpacity={0.8}
+    <Pressable
       disabled={preventPress}
       key={`gallery-item-${message.id}/${colIndex}/${rowIndex}/${imagesAndVideos.length}`}
       onLongPress={(event) => {
@@ -353,16 +355,17 @@ const GalleryThumbnail = <
           });
         }
       }}
-      style={[
+      style={({ pressed }) => [
         styles.imageContainer,
         {
           height: thumbnail.height,
+          opacity: pressed ? 0.8 : 1,
           width: thumbnail.width,
         },
         imageContainer,
       ]}
       testID={`gallery-${invertedDirections ? 'row' : 'column'}-${colIndex}-item-${rowIndex}`}
-      {...additionalTouchableProps}
+      {...additionalPressableProps}
     >
       {thumbnail.type === FileTypes.Video ? (
         <VideoThumbnail
@@ -400,7 +403,7 @@ const GalleryThumbnail = <
           </Text>
         </View>
       ) : null}
-    </TouchableOpacity>
+    </Pressable>
   );
 };
 
@@ -552,7 +555,7 @@ export const Gallery = <
   props: GalleryProps<StreamChatGenerics>,
 ) => {
   const {
-    additionalTouchableProps: propAdditionalTouchableProps,
+    additionalPressableProps: propAdditionalPressableProps,
     alignment: propAlignment,
     groupStyles: propGroupStyles,
     hasThreadReplies,
@@ -587,7 +590,7 @@ export const Gallery = <
     videos: contextVideos,
   } = useMessageContext<StreamChatGenerics>();
   const {
-    additionalTouchableProps: contextAdditionalTouchableProps,
+    additionalPressableProps: contextAdditionalPressableProps,
     ImageLoadingFailedIndicator: ContextImageLoadingFailedIndicator,
     ImageLoadingIndicator: ContextImageLoadingIndicator,
     legacyImageViewerSwipeBehaviour,
@@ -602,7 +605,7 @@ export const Gallery = <
 
   if (!images.length && !videos.length) return null;
 
-  const additionalTouchableProps = propAdditionalTouchableProps || contextAdditionalTouchableProps;
+  const additionalPressableProps = propAdditionalPressableProps || contextAdditionalPressableProps;
   const alignment = propAlignment || contextAlignment;
   const groupStyles = propGroupStyles || contextGroupStyles;
   const onLongPress = propOnLongPress || contextOnLongPress;
@@ -622,7 +625,7 @@ export const Gallery = <
   return (
     <MemoizedGallery
       {...{
-        additionalTouchableProps,
+        additionalPressableProps,
         alignment,
         channelId: message?.cid,
         groupStyles,

package/src/components/Attachment/Giphy.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Image, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { Image, Pressable, StyleSheet, Text, View } from 'react-native';
 
 import type { Attachment } from 'stream-chat';
 
@@ -151,7 +151,7 @@ export type GiphyPropsWithContext<
   Pick<
     MessagesContextValue<StreamChatGenerics>,
     | 'giphyVersion'
-    | 'additionalTouchableProps'
+    | 'additionalPressableProps'
     | 'ImageLoadingIndicator'
     | 'ImageLoadingFailedIndicator'
   > & {
@@ -164,7 +164,7 @@ const GiphyWithContext = <
   props: GiphyPropsWithContext<StreamChatGenerics>,
 ) => {
   const {
-    additionalTouchableProps,
+    additionalPressableProps,
     attachment,
     giphyVersion,
     handleAction,
@@ -260,7 +260,7 @@ const GiphyWithContext = <
       </View>
       <View>
         <View style={styles.actionsRow}>
-          <TouchableOpacity
+          <Pressable
             onPress={() => {
               if (actions?.[2].name && actions?.[2].value && handleAction) {
                 handleAction(actions[2].name, actions[2].value);
@@ -274,8 +274,8 @@ const GiphyWithContext = <
             testID={`${actions?.[2].value}-action-button`}
           >
             <Text style={[styles.cancel, { color: grey }, cancel]}>{actions?.[2].text}</Text>
-          </TouchableOpacity>
-          <TouchableOpacity
+          </Pressable>
+          <Pressable
             onPress={() => {
               if (actions?.[1].name && actions?.[1].value && handleAction) {
                 handleAction(actions[1].name, actions[1].value);
@@ -289,8 +289,8 @@ const GiphyWithContext = <
             testID={`${actions?.[1].value}-action-button`}
           >
             <Text style={[styles.shuffle, { color: grey }, shuffle]}>{actions?.[1].text}</Text>
-          </TouchableOpacity>
-          <TouchableOpacity
+          </Pressable>
+          <Pressable
             onPress={() => {
               if (actions?.[0].name && actions?.[0].value && handleAction) {
                 handleAction(actions[0].name, actions[0].value);
@@ -300,12 +300,12 @@ const GiphyWithContext = <
             testID={`${actions?.[0].value}-action-button`}
           >
             <Text style={[styles.send, { color: accent_blue }, send]}>{actions?.[0].text}</Text>
-          </TouchableOpacity>
+          </Pressable>
         </View>
       </View>
     </View>
   ) : (
-    <TouchableOpacity
+    <Pressable
       disabled={preventPress}
       onLongPress={(event) => {
         if (onLongPress) {
@@ -333,7 +333,7 @@ const GiphyWithContext = <
         }
       }}
       testID='giphy-attachment'
-      {...additionalTouchableProps}
+      {...additionalPressableProps}
     >
       <View
         style={[
@@ -383,7 +383,7 @@ const GiphyWithContext = <
           </View>
         </View>
       </View>
-    </TouchableOpacity>
+    </Pressable>
   );
 };
 
@@ -451,7 +451,7 @@ export const Giphy = <
   const { handleAction, isMyMessage, message, onLongPress, onPress, onPressIn, preventPress } =
     useMessageContext<StreamChatGenerics>();
   const { ImageComponent } = useChatContext<StreamChatGenerics>();
-  const { additionalTouchableProps, giphyVersion } = useMessagesContext<StreamChatGenerics>();
+  const { additionalPressableProps, giphyVersion } = useMessagesContext<StreamChatGenerics>();
   const { setMessages, setSelectedMessage } = useImageGalleryContext<StreamChatGenerics>();
   const { setOverlay } = useOverlayContext();
 
@@ -466,7 +466,7 @@ export const Giphy = <
   return (
     <MemoizedGiphy
       {...{
-        additionalTouchableProps,
+        additionalPressableProps,
         giphyVersion,
         handleAction,
         ImageComponent,

package/src/components/Attachment/__tests__/Attachment.test.js

@@ -14,13 +14,16 @@ import {
   generateVideoAttachment,
 } from '../../../mock-builders/generator/attachment';
 import { generateMessage } from '../../../mock-builders/generator/message';
-import * as NativeUtils from '../../../native';
 
 import { ImageLoadingFailedIndicator } from '../../Attachment/ImageLoadingFailedIndicator';
 import { ImageLoadingIndicator } from '../../Attachment/ImageLoadingIndicator';
 import { Attachment } from '../Attachment';
 import { AttachmentActions } from '../AttachmentActions';
 
+jest.mock('../../../native.ts', () => ({
+  isVideoPlayerAvailable: jest.fn(() => false),
+}));
+
 const getAttachmentComponent = (props) => {
   const message = generateMessage();
   return (
@@ -50,7 +53,6 @@ describe('Attachment', () => {
   });
 
   it('should render File component for "video" type attachment', async () => {
-    jest.spyOn(NativeUtils, 'isVideoPackageAvailable').mockImplementation(jest.fn(() => false));
     const attachment = generateVideoAttachment();
     const { getByTestId } = render(getAttachmentComponent({ attachment }));
 

package/src/components/Attachment/__tests__/Gallery.test.js

@@ -21,7 +21,6 @@ import { generateMember } from '../../../mock-builders/generator/member';
 import { generateMessage } from '../../../mock-builders/generator/message';
 import { generateUser } from '../../../mock-builders/generator/user';
 import { getTestClientWithUser } from '../../../mock-builders/mock';
-import * as NativeUtils from '../../../native';
 import { Channel } from '../../Channel/Channel';
 import { Chat } from '../../Chat/Chat';
 import { MessageList } from '../../MessageList/MessageList';
@@ -81,7 +80,6 @@ describe('Gallery', () => {
   });
 
   it('should render one image and one video attachment', async () => {
-    jest.spyOn(NativeUtils, 'isVideoPackageAvailable').mockImplementation(jest.fn(() => true));
     const attachment1 = generateImageAttachment({
       original_height: 600,
       original_width: 400,