stream-chat-expo 5.44.2 → 6.0.0-beta.1

package/README.md

@@ -7,11 +7,10 @@
 > The official React Native and Expo components for Stream Chat, a service for
 > building chat applications.
 
-
 [![NPM](https://img.shields.io/npm/v/stream-chat-react-native.svg)](https://www.npmjs.com/package/stream-chat-react-native)
 [![Build Status](https://github.com/GetStream/stream-chat-react-native/actions/workflows/release.yml/badge.svg)](https://github.com/GetStream/stream-chat-react-native/actions)
 [![Component Reference](https://img.shields.io/badge/docs-component%20reference-blue.svg)](https://getstream.io/chat/docs/sdk/reactnative)
-![JS Bundle Size](https://img.shields.io/badge/js_bundle_size-452%20KB-blue)
+![JS Bundle Size](https://img.shields.io/badge/js_bundle_size-453%20KB-blue)
 
 <img align="right" src="https://getstream.imgix.net/images/ios-chat-tutorial/iphone_chat_art@3x.png?auto=format,enhance" width="50%" />
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-expo",
   "description": "The official Expo SDK for Stream Chat, a service for building chat applications",
-  "version": "5.44.2",
+  "version": "6.0.0-beta.1",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
@@ -10,11 +10,10 @@
   "main": "src/index.js",
   "types": "types/index.d.ts",
   "dependencies": {
-    "stream-chat-react-native-core": "5.44.2"
+    "stream-chat-react-native-core": "6.0.0-beta.1"
   },
   "peerDependencies": {
-    "@react-native-community/netinfo": ">=6.0.0",
-    "expo": ">=44.0.0",
+    "expo": ">=51.0.0",
     "expo-av": "*",
     "expo-clipboard": "*",
     "expo-document-picker": "*",
@@ -35,6 +34,9 @@
     "expo-document-picker": {
       "optional": true
     },
+    "expo-file-system": {
+      "optional": true
+    },
     "expo-media-library": {
       "optional": true
     },
@@ -49,10 +51,8 @@
     }
   },
   "devDependencies": {
-    "@react-native-community/netinfo": "^6.0.0",
-    "expo": "^44.0.0",
-    "expo-file-system": "^11.0.2",
-    "expo-image-manipulator": "^9.1.0"
+    "expo": "^51.0.17",
+    "expo-image-manipulator": "^12.0.5"
   },
   "scripts": {
     "prepack": " cp ../../README.md .",

package/src/handlers/index.ts

@@ -1,7 +1 @@
-export * from './Audio';
 export * from './compressImage';
-export * from './deleteFile';
-export * from './NetInfo';
-export * from './saveFile';
-export * from './Sound';
-export * from './Video';

package/src/index.js

@@ -2,27 +2,24 @@ import { FlatList } from 'react-native';
 
 import { registerNativeHandlers } from 'stream-chat-react-native-core';
 
+import { compressImage } from './handlers';
+
 import {
   Audio,
-  compressImage,
   deleteFile,
-  NetInfo,
-  saveFile,
-  Sound,
-  Video,
-} from './handlers';
-
-import {
   getLocalAssetUri,
   getPhotos,
   iOS14RefreshGallerySelection,
   oniOS14GalleryLibrarySelectionChange,
   pickDocument,
   pickImage,
+  saveFile,
   setClipboardString,
   shareImage,
+  Sound,
   takePhoto,
   triggerHaptic,
+  Video,
 } from './optionalDependencies';
 
 registerNativeHandlers({
@@ -33,7 +30,6 @@ registerNativeHandlers({
   getLocalAssetUri,
   getPhotos,
   iOS14RefreshGallerySelection,
-  NetInfo,
   oniOS14GalleryLibrarySelectionChange,
   pickDocument,
   pickImage,

package/src/{handlers → optionalDependencies}/Audio.ts

@@ -1,4 +1,4 @@
-import { AudioComponent, RecordingObject } from '../optionalDependencies/Video';
+import { AudioComponent, RecordingObject } from './AudioVideo';
 
 export enum AndroidOutputFormat {
   DEFAULT = 0,

package/src/{handlers → optionalDependencies}/Sound.ts

@@ -1,4 +1,4 @@
-import { AudioComponent } from '../optionalDependencies/Video';
+import { AudioComponent } from './AudioVideo';
 
 export const Sound = {
   initializeSound: AudioComponent

package/src/{handlers → optionalDependencies}/Video.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 
-import { AudioComponent, VideoComponent } from '../optionalDependencies';
+import { AudioComponent, VideoComponent } from './AudioVideo';
 
 export const Video = VideoComponent
   ? ({ onPlaybackStatusUpdate, paused, resizeMode, style, uri, videoRef }) => {

package/src/optionalDependencies/deleteFile.ts

@@ -0,0 +1,25 @@
+let FileSystem;
+
+try {
+  FileSystem = require('expo-file-system');
+} catch (e) {
+  // do nothing
+}
+
+if (!FileSystem) {
+  console.log(
+    'expo-file-system is not installed. Installing this package will allow your users to save/delete file locally and access the cache dir for android/iOS.',
+  );
+}
+
+export const deleteFile = FileSystem
+  ? async ({ uri }: { uri: string }) => {
+      try {
+        await FileSystem.deleteAsync(uri, { idempotent: true });
+        return true;
+      } catch (error) {
+        console.log('File deletion failed...', error);
+        return false;
+      }
+    }
+  : null;

package/src/optionalDependencies/getLocalAssetUri.ts

@@ -1,3 +1,5 @@
+import { Platform } from 'react-native';
+
 let MediaLibrary;
 
 try {
@@ -12,10 +14,14 @@ if (!MediaLibrary) {
   );
 }
 
+// TODO: The API is different for Expo and RN CLI. We should unify it.
 export const getLocalAssetUri = async (assetId: string): Promise<string | undefined> => {
   try {
-    const { localUri } = await MediaLibrary.getAssetInfoAsync(assetId);
-    return localUri;
+    if (Platform.OS === 'ios') {
+      const { localUri } = await MediaLibrary.getAssetInfoAsync(assetId);
+      return localUri;
+    }
+    return null;
   } catch {
     throw new Error('getLocalAssetUri Error');
   }

package/src/optionalDependencies/getPhotos.ts

@@ -1,3 +1,5 @@
+import { Platform } from 'react-native';
+
 let MediaLibrary;
 
 try {
@@ -13,6 +15,8 @@ if (!MediaLibrary) {
 }
 import type { Asset } from 'stream-chat-react-native-core';
 
+import { getLocalAssetUri } from './getLocalAssetUri';
+
 type ReturnType = {
   assets: Array<Omit<Asset, 'source'> & { source: 'picker' }>;
   endCursor: string | undefined;
@@ -40,16 +44,22 @@ export const getPhotos = MediaLibrary
           mediaType: [MediaLibrary.MediaType.photo, MediaLibrary.MediaType.video],
           sortBy: [MediaLibrary.SortBy.modificationTime],
         });
-        const assets = results.assets.map((asset) => ({
-          duration: asset.duration * 1000,
-          height: asset.height,
-          id: asset.id,
-          name: asset.filename,
-          source: 'picker' as const,
-          type: asset.mediaType,
-          uri: asset.uri,
-          width: asset.width,
-        }));
+        const assets = await Promise.all(
+          results.assets.map(async (asset) => {
+            const localUri = await getLocalAssetUri(asset.id);
+            return {
+              duration: asset.duration * 1000,
+              height: asset.height,
+              id: asset.id,
+              name: asset.filename,
+              originalUri: asset.uri,
+              source: 'picker' as const,
+              type: asset.mediaType,
+              uri: localUri || asset.uri,
+              width: asset.width,
+            };
+          }),
+        );
 
         const hasNextPage = results.hasNextPage;
         const endCursor = results.endCursor;

package/src/optionalDependencies/index.ts

@@ -1,6 +1,16 @@
+export * from './Audio';
+export * from './deleteFile';
+export * from './getLocalAssetUri';
+export * from './getPhotos';
+export * from './iOS14RefreshGallerySelection';
+export * from './oniOS14GalleryLibrarySelectionChange';
+export * from './pickDocument';
+export * from './pickImage';
+export * from './saveFile';
 export * from './setClipboardString';
 export * from './shareImage';
-export * from './pickDocument';
+export * from './Sound';
+export * from './takePhoto';
 export * from './triggerHaptic';
 export * from './Video';
 export * from './oniOS14GalleryLibrarySelectionChange';

package/src/optionalDependencies/pickImage.ts

@@ -33,7 +33,7 @@ export const pickImage = ImagePicker
         if (permissionGranted) {
           const result = await ImagePicker.launchImageLibraryAsync({
             allowsMultipleSelection: true,
-            mediaTypes: ImagePicker.MediaTypeOptions.All,
+            mediaTypes: ['images', 'videos'],
           });
 
           const canceled = result.canceled;

package/src/optionalDependencies/saveFile.ts

@@ -0,0 +1,26 @@
+let FileSystem;
+
+try {
+  FileSystem = require('expo-file-system');
+} catch (e) {
+  // do nothing
+}
+
+if (!FileSystem) {
+  console.log(
+    'expo-file-system is not installed. Installing this package will allow your users to save/delete file locally and access the cache dir for android/iOS.',
+  );
+}
+
+export const saveFile = FileSystem
+  ? async ({ fileName, fromUrl }: { fileName: string; fromUrl: string }) => {
+      try {
+        const path = FileSystem.cacheDirectory + encodeURIComponent(fileName);
+        const downloadedImage = await FileSystem.downloadAsync(fromUrl, path);
+        return downloadedImage.uri;
+      } catch (error) {
+        console.log('Downloading image failed...', error);
+        throw new Error('Downloading image failed...');
+      }
+    }
+  : null;

package/src/optionalDependencies/takePhoto.ts

@@ -46,11 +46,6 @@ export const takePhoto = ImagePicker
           if (canceled === false && photo && photo.height && photo.width && photo.uri) {
             let size: Size = {};
             if (Platform.OS === 'android') {
-              // Height and width returned by ImagePicker are incorrect on Android.
-              // The issue is described in following github issue:
-              // https://github.com/ivpusic/react-native-image-crop-picker/issues/901
-              // This we can't rely on them as it is, and we need to use Image.getSize
-              // to get accurate size.
               const getSize = (): Promise<Size> =>
                 new Promise((resolve) => {
                   Image.getSize(photo.uri, (width, height) => {

package/src/optionalDependencies/triggerHaptic.ts

@@ -45,5 +45,4 @@ export const triggerHaptic = Haptics
           Haptics.selectionAsync();
       }
     }
-  : // eslint-disable-next-line @typescript-eslint/no-empty-function
-    () => {};
+  : () => {};

package/src/handlers/NetInfo.ts

@@ -1,43 +0,0 @@
-import { NetInfoState, default as OriginalNetInfo } from '@react-native-community/netinfo';
-
-export const NetInfo = {
-  addEventListener(listener) {
-    let unsubscribe;
-    // For NetInfo >= 3.x.x
-    if (OriginalNetInfo.fetch && typeof OriginalNetInfo.fetch === 'function') {
-      unsubscribe = OriginalNetInfo.addEventListener(({ isConnected, isInternetReachable }) => {
-        // Initialize with truthy value when internetReachable is still loading
-        // if it resolves to false, listener is triggered with false value and network
-        // status is updated
-        listener(isInternetReachable === null ? isConnected : isConnected && isInternetReachable);
-      });
-      return unsubscribe;
-    } else {
-      // For NetInfo < 3.x.x
-      unsubscribe = OriginalNetInfo.addEventListener('connectionChange', () => {
-        // @ts-ignore
-        OriginalNetInfo.isConnected.fetch().then((isConnected: NetInfoState) => {
-          listener(isConnected);
-        });
-      });
-
-      return unsubscribe.remove;
-    }
-  },
-  fetch() {
-    return new Promise((resolve, reject) => {
-      // For NetInfo >= 3.x.x
-      if (OriginalNetInfo.fetch && typeof OriginalNetInfo.fetch === 'function') {
-        OriginalNetInfo.fetch().then(({ isConnected }) => {
-          resolve(isConnected);
-        }, reject);
-      } else {
-        // For NetInfo < 3.x.x
-        // @ts-ignore
-        OriginalNetInfo.isConnected.fetch().then((isConnected: NetInfoState) => {
-          resolve(isConnected);
-        }, reject);
-      }
-    });
-  },
-};

package/src/handlers/deleteFile.ts

@@ -1,11 +0,0 @@
-import * as FileSystem from 'expo-file-system';
-
-export const deleteFile = async ({ uri }: { uri: string }) => {
-  try {
-    await FileSystem.deleteAsync(uri, { idempotent: true });
-    return true;
-  } catch (error) {
-    console.log('File deletion failed...');
-    return false;
-  }
-};

package/src/handlers/saveFile.ts

@@ -1,11 +0,0 @@
-import * as FileSystem from 'expo-file-system';
-
-export const saveFile = async ({ fileName, fromUrl }: { fileName: string; fromUrl: string }) => {
-  try {
-    const path = FileSystem.cacheDirectory + encodeURIComponent(fileName);
-    const downloadedImage = await FileSystem.downloadAsync(fromUrl, path);
-    return downloadedImage.uri;
-  } catch (error) {
-    throw new Error('Downloading image failed...');
-  }
-};