From 5aa79cba1720c23b84ffe4b9933502439c9dcea7 Mon Sep 17 00:00:00 2001 From: Aryan Goharzad Date: Tue, 31 Jan 2023 17:20:12 -0500 Subject: [PATCH 1/3] Fixes image failing on reupload issue --- package.json | 1 + src/view/com/composer/PhotoCarouselPicker.tsx | 25 +++++++++++++++++-- 2 files changed, 24 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 7272156c70..a180286316 100644 --- a/package.json +++ b/package.json @@ -65,6 +65,7 @@ "react-native-svg": "^12.4.0", "react-native-tab-view": "^3.3.0", "react-native-url-polyfill": "^1.3.0", + "react-native-uuid": "^2.0.1", "react-native-version-number": "^0.3.6", "react-native-web": "^0.17.7", "rn-fetch-blob": "^0.12.0", diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx index ec9419f7c9..7f3bc74192 100644 --- a/src/view/com/composer/PhotoCarouselPicker.tsx +++ b/src/view/com/composer/PhotoCarouselPicker.tsx @@ -1,11 +1,13 @@ import React, {useCallback} from 'react' import {Image, StyleSheet, TouchableOpacity, ScrollView} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import uuid from 'react-native-uuid' import { openPicker, openCamera, openCropper, } from 'react-native-image-crop-picker' +import RNFS from 'react-native-fs' import { UserLocalPhotosModel, PhotoIdentifier, @@ -26,6 +28,18 @@ const IMAGE_PARAMS = { compressImageQuality: 1.0, } +const moveToPremanantPath = async (path: string) => { + /* + Since this package stores images in a temp directory, we need to move the file to a permanent location. + Relevant: IOS bug when trying to open a second time: + https://github.com/ivpusic/react-native-image-crop-picker/issues/1199 + */ + const filename = uuid.v4() + const destinationPath = `${RNFS.DocumentDirectoryPath}/${filename}` + RNFS.moveFile(path, destinationPath) + return destinationPath +} + export async function cropPhoto( path: string, imgWidth = MAX_WIDTH, @@ -44,8 +58,12 @@ export async function cropPhoto( width, height, }) + const img = await compressIfNeeded(cropperRes, MAX_SIZE) - return img.path + + const permanentPath = await moveToPremanantPath(img.path) + + return permanentPath } export const PhotoCarouselPicker = ({ @@ -114,7 +132,10 @@ export const PhotoCarouselPicker = ({ height, }) const finalImg = await compressIfNeeded(cropperRes, MAX_SIZE) - result.push(finalImg.path) + + const permanentPath = await moveToPremanantPath(finalImg.path) + + result.push(permanentPath) } onSelectPhotos([...selectedPhotos, ...result]) }) From 90a79c61af0e9e420b43f787d894baa45e74b207 Mon Sep 17 00:00:00 2001 From: Aryan Goharzad Date: Tue, 31 Jan 2023 17:33:01 -0500 Subject: [PATCH 2/3] Use tmp folder instead of documents --- src/view/com/composer/PhotoCarouselPicker.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx index 7f3bc74192..9aa95ed8cb 100644 --- a/src/view/com/composer/PhotoCarouselPicker.tsx +++ b/src/view/com/composer/PhotoCarouselPicker.tsx @@ -35,7 +35,7 @@ const moveToPremanantPath = async (path: string) => { https://github.com/ivpusic/react-native-image-crop-picker/issues/1199 */ const filename = uuid.v4() - const destinationPath = `${RNFS.DocumentDirectoryPath}/${filename}` + const destinationPath = `${RNFS.TemporaryDirectoryPath}/${filename}` RNFS.moveFile(path, destinationPath) return destinationPath } From fe7c632a327b8bc5c1c763de057da5af3bd44a32 Mon Sep 17 00:00:00 2001 From: Aryan Goharzad Date: Tue, 31 Jan 2023 17:40:30 -0500 Subject: [PATCH 3/3] lint --- src/view/com/composer/PhotoCarouselPicker.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/view/com/composer/PhotoCarouselPicker.tsx b/src/view/com/composer/PhotoCarouselPicker.tsx index 9aa95ed8cb..506daeb1bc 100644 --- a/src/view/com/composer/PhotoCarouselPicker.tsx +++ b/src/view/com/composer/PhotoCarouselPicker.tsx @@ -60,9 +60,7 @@ export async function cropPhoto( }) const img = await compressIfNeeded(cropperRes, MAX_SIZE) - const permanentPath = await moveToPremanantPath(img.path) - return permanentPath } @@ -132,9 +130,7 @@ export const PhotoCarouselPicker = ({ height, }) const finalImg = await compressIfNeeded(cropperRes, MAX_SIZE) - const permanentPath = await moveToPremanantPath(finalImg.path) - result.push(permanentPath) } onSelectPhotos([...selectedPhotos, ...result])