react-native: Fix react native expo permissions (#2418)

* dash: Add support for AVIF images in thumbnails

I added support to load thumbnails when uploading AVIF images, by adding 'avif' to the regex. I also updated the unit test.

Note that support for this is dependant on browser support, and currently only Chrome 85+ and Firefox 77+ support it (Firefox requires flag to be set to allow it)

* Allowed HTML Attributes to be passed via props

This fix still needs some work, as certain attributes could be passed to Uppy or as an HTML attribute, such as target

When this is fixed, this will resolve #2403

* fix: Fixed issues caused by moved dependencies

* Revert "Allowed HTML Attributes to be passed via props"

This reverts commit d7f8076fb3dfb16dd9c3ef72fcfbe11892ec51c8.

* Fixed dependencies

packages/@uppy/react-native/file-picker/selectDocument.js

@@ -1,7 +1,7 @@
-import * as Expo from 'expo'
+import * as DocumentPicker from 'expo-document-picker'
 
 function selectDocumentWithExpo (options) {
-  return Expo.DocumentPicker.getDocumentAsync({
+  return DocumentPicker.getDocumentAsync({
     copyToCacheDirectory: false
   }).then((result) => {
     if (!result.cancelled && result.type !== 'cancel') {

packages/@uppy/react-native/file-picker/selectImage.js

@@ -1,16 +1,17 @@
-import * as Expo from 'expo'
+import * as Permissions from 'expo-permissions'
+import * as ImagePicker from 'expo-image-picker'
 
 function selectImageWithExpo (options) {
   return new Promise((resolve, reject) => {
-    return Expo.Permissions.askAsync(Expo.Permissions.CAMERA_ROLL)
+    return Permissions.askAsync(Permissions.CAMERA_ROLL)
       .then((isAllowed) => {
         if (!isAllowed) {
           return reject(new Error('Permissions denied'))
         }
 
-        return Expo.ImagePicker.launchImageLibraryAsync(options)
+        return ImagePicker.launchImageLibraryAsync(options)
           .then((result) => {
-            // console.log(result)
+            console.log(result)
             if (!result.cancelled) {
               return resolve(result)
             }

packages/@uppy/react-native/file-picker/takePicture.js

@@ -1,13 +1,14 @@
-import * as Expo from 'expo'
+import * as Permissions from 'expo-permissions'
+import * as ImagePicker from 'expo-image-picker'
 
 function takePictureWithExpo (options) {
   return new Promise((resolve, reject) => {
-    return Expo.Permissions.askAsync(Expo.Permissions.CAMERA).then((isAllowed) => {
+    return Permissions.askAsync(Permissions.CAMERA).then((isAllowed) => {
       if (!isAllowed) {
         return reject(new Error('Permissions denied'))
       }
 
-      return Expo.ImagePicker.launchCameraAsync({ allowsEditing: true })
+      return ImagePicker.launchCameraAsync({ allowsEditing: true })
         .then((result) => {
           if (!result.cancelled) {
             return resolve(result)

packages/@uppy/react-native/package.json

@@ -19,5 +19,11 @@
   "repository": {
     "type": "git",
     "url": "git+https://github.com/transloadit/uppy.git"
+  },
+  "peerDependencies": {
+    "expo-document-picker": ">=6.0.0",
+    "expo-image-picker": ">=6.0.0",
+    "expo-permissions": ">=6.0.0",
+    "expo": ">=33.0.0",
   }
 }