fix: properly resolve videos too

Author: isekovanic

package/expo-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/expo-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,9 +44,10 @@ export const getPhotos = MediaLibrary
           mediaType: [MediaLibrary.MediaType.photo, MediaLibrary.MediaType.video],
           sortBy: [MediaLibrary.SortBy.modificationTime],
         });
+        console.log(results.assets.length);
         const assets = await Promise.all(
           results.assets.map(async (asset) => {
-            const assetInfo = await MediaLibrary.getAssetInfoAsync(asset.id);
+            const localUri = await getLocalAssetUri(asset.id);
             return {
               duration: asset.duration * 1000,
               height: asset.height,
@@ -51,11 +56,12 @@ export const getPhotos = MediaLibrary
               originalUri: asset.uri,
               source: 'picker' as const,
               type: asset.mediaType,
-              uri: assetInfo.localUri,
+              uri: localUri || asset.uri,
               width: asset.width,
             };
           }),
         );
+        console.log('ISE: ', assets);
 
         const hasNextPage = results.hasNextPage;
         const endCursor = results.endCursor;

package/src/components/AttachmentPicker/components/AttachmentPickerItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { Alert, ImageBackground, Platform, StyleSheet, Text, View } from 'react-native';
+import { Alert, ImageBackground, StyleSheet, Text, View } from 'react-native';
 
 import { TouchableOpacity } from '@gorhom/bottom-sheet';
 import { lookup } from 'mime-types';
@@ -10,7 +10,6 @@ import { useTheme } from '../../../contexts/themeContext/ThemeContext';
 import { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';
 import { useViewport } from '../../../hooks/useViewport';
 import { Recorder } from '../../../icons';
-import { getLocalAssetUri } from '../../../native';
 import type { Asset, File } from '../../../types/types';
 import { getDurationLabelFromDuration } from '../../../utils/utils';
 
@@ -56,15 +55,7 @@ const AttachmentVideo = (props: AttachmentVideoProps) => {
   const size = vw(100) / (numberOfAttachmentPickerImageColumns || 3) - 2;
 
   /* Patches video files with uri and mimetype */
-  const patchVideoFile = async (files: File[]) => {
-    // For the case of Expo CLI where you need to fetch the file uri from file id. Here it is only done for iOS since for android the file.uri is fine.
-    const identifier = asset.id || asset.uri;
-    const localAssetURI =
-      Platform.OS === 'ios' &&
-      identifier &&
-      getLocalAssetUri &&
-      (await getLocalAssetUri(identifier));
-    const uri = localAssetURI || asset.uri || '';
+  const patchVideoFile = (files: File[]) => {
     // We need a mime-type to upload a video file.
     const mimeType = lookup(asset.name) || 'multipart/form-data';
     return [
@@ -74,19 +65,19 @@ const AttachmentVideo = (props: AttachmentVideoProps) => {
         id: asset.id,
         mimeType,
         name: asset.name,
-        originalUri: asset.uri,
+        originalUri: asset.originalUri,
         size: asset.size,
-        uri,
+        uri: asset.uri,
       },
     ];
   };
 
-  const updateSelectedFiles = async () => {
+  const updateSelectedFiles = () => {
     if (numberOfUploads >= maxNumberOfFiles) {
       Alert.alert(t('Maximum number of files reached'));
       return;
     }
-    const files = await patchVideoFile(selectedFiles);
+    const files = patchVideoFile(selectedFiles);
     setSelectedFiles(files);
   };