From 3a8c516b647c13c19066719e439992c88170288a Mon Sep 17 00:00:00 2001 From: Pedro Guerreiro Date: Mon, 26 May 2025 21:24:16 +0100 Subject: [PATCH 1/5] chore: attempt at fixing infinite loading on android --- .../Modal/EmployeeTestDriveModal.tsx | 21 ++++--- .../setTestReceipt/getFileURL/index.ios.ts | 8 +++ .../setTestReceipt/getFileURL/index.ts | 12 ++++ .../actions/setTestReceipt/index.native.ts | 60 +++++++++---------- src/libs/actions/setTestReceipt/index.ts | 34 +++++------ src/libs/actions/setTestReceipt/types.ts | 10 +++- 6 files changed, 84 insertions(+), 61 deletions(-) create mode 100644 src/libs/actions/setTestReceipt/getFileURL/index.ios.ts create mode 100644 src/libs/actions/setTestReceipt/getFileURL/index.ts diff --git a/src/components/TestDrive/Modal/EmployeeTestDriveModal.tsx b/src/components/TestDrive/Modal/EmployeeTestDriveModal.tsx index 719282e9da7cf..2792e5928917b 100644 --- a/src/components/TestDrive/Modal/EmployeeTestDriveModal.tsx +++ b/src/components/TestDrive/Modal/EmployeeTestDriveModal.tsx @@ -48,9 +48,11 @@ function EmployeeTestDriveModal() { setIsLoading(true); - verifyTestDriveRecipient(bossEmail) - .then(() => { - setTestReceipt(TestReceipt, 'jpg', (source, _, filename) => { + verifyTestDriveRecipient(bossEmail).then(() => { + setTestReceipt( + TestReceipt, + 'jpg', + (source, _, filename) => { const transactionID = CONST.IOU.OPTIMISTIC_TRANSACTION_ID; const reportID = generateReportID(); initMoneyRequest(reportID, undefined, false, undefined, CONST.IOU.REQUEST_TYPE.SCAN); @@ -75,12 +77,13 @@ function EmployeeTestDriveModal() { Navigation.goBack(); Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_CONFIRMATION.getRoute(CONST.IOU.ACTION.CREATE, CONST.IOU.TYPE.SUBMIT, transactionID, reportID)); }); - }); - }) - .catch(() => { - setIsLoading(false); - setFormError(translate('testDrive.modal.employee.error')); - }); + }, + () => { + setIsLoading(false); + setFormError(translate('testDrive.modal.employee.error')); + }, + ); + }); }; return ( diff --git a/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts b/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts new file mode 100644 index 0000000000000..bdaae659ed622 --- /dev/null +++ b/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts @@ -0,0 +1,8 @@ +import {Image} from 'react-native'; +import type {Asset} from '@userActions/setTestReceipt/types'; + +function getFileURL(asset: Asset) { + return Image.resolveAssetSource(asset).uri; +} + +export default getFileURL; diff --git a/src/libs/actions/setTestReceipt/getFileURL/index.ts b/src/libs/actions/setTestReceipt/getFileURL/index.ts new file mode 100644 index 0000000000000..d954bad898636 --- /dev/null +++ b/src/libs/actions/setTestReceipt/getFileURL/index.ts @@ -0,0 +1,12 @@ +import {Image} from 'react-native'; +import ReactNativeBlobUtil from 'react-native-blob-util'; +import type {Asset, AssetExtension} from '@userActions/setTestReceipt/types'; +import CONFIG from '@src/CONFIG'; +import CONST from '@src/CONST'; + +function getFileURL(asset: Asset, assetExtension: AssetExtension) { + const source = Image.resolveAssetSource(asset).uri; + return CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV ? source : ReactNativeBlobUtil.fs.asset(`${source}.${assetExtension}`); +} + +export default getFileURL; diff --git a/src/libs/actions/setTestReceipt/index.native.ts b/src/libs/actions/setTestReceipt/index.native.ts index eefa33b5e6ac0..787d2cd039296 100644 --- a/src/libs/actions/setTestReceipt/index.native.ts +++ b/src/libs/actions/setTestReceipt/index.native.ts @@ -1,43 +1,41 @@ -import {Image} from 'react-native'; import ReactNativeBlobUtil from 'react-native-blob-util'; import type {FileObject} from '@components/AttachmentModal'; import Log from '@libs/Log'; import CONST from '@src/CONST'; +import getFileURL from './getFileURL'; import type {SetTestReceipt} from './types'; -const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead) => { - try { - const filename = `${CONST.TEST_RECEIPT.FILENAME}_${Date.now()}.${assetExtension}`; - const path = `${ReactNativeBlobUtil.fs.dirs.CacheDir}/${filename}`; - const source = Image.resolveAssetSource(asset).uri; +const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead, onFileError) => { + const filename = `${CONST.TEST_RECEIPT.FILENAME}_${Date.now()}.${assetExtension}`; + const path = `${ReactNativeBlobUtil.fs.dirs.CacheDir}/${filename}`; + const source = getFileURL(asset, assetExtension); - ReactNativeBlobUtil.config({ - fileCache: true, - appendExt: assetExtension, - path, - }) - .fetch('GET', source) - .then(() => { - const file: FileObject = { - uri: `file://${path}`, - name: filename, - type: CONST.TEST_RECEIPT.FILE_TYPE, - size: 0, - }; + ReactNativeBlobUtil.config({ + fileCache: true, + appendExt: assetExtension, + path, + }) + .fetch('GET', source) + .then(() => { + const file: FileObject = { + uri: `file://${path}`, + name: filename, + type: CONST.TEST_RECEIPT.FILE_TYPE, + size: 0, + }; + + if (!file.uri) { + Log.warn('Error reading test receipt'); + return; + } - if (!file.uri) { - Log.warn('Error reading test receipt'); - return; - } + onFileRead(file.uri, file, filename); + }) + .catch((error) => { + Log.warn('Error reading test receipt:', {message: error}); - onFileRead(file.uri, file, filename); - }) - .catch((error) => { - Log.warn('Error reading test receipt:', {message: error}); - }); - } catch (error) { - Log.warn('Error in setTestReceipt:', {message: error}); - } + onFileError(error); + }); }; export default setTestReceipt; diff --git a/src/libs/actions/setTestReceipt/index.ts b/src/libs/actions/setTestReceipt/index.ts index f564632ef57bd..9fbfb621fecad 100644 --- a/src/libs/actions/setTestReceipt/index.ts +++ b/src/libs/actions/setTestReceipt/index.ts @@ -3,25 +3,23 @@ import Log from '@libs/Log'; import CONST from '@src/CONST'; import type {SetTestReceipt} from './types'; -const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead) => { - try { - const filename = `${CONST.TEST_RECEIPT.FILENAME}_${Date.now()}.${assetExtension}`; - readFileAsync( - asset as string, - filename, - (file) => { - const source = URL.createObjectURL(file); +const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead, onFileError) => { + const filename = `${CONST.TEST_RECEIPT.FILENAME}_${Date.now()}.${assetExtension}`; + readFileAsync( + asset as string, + filename, + (file) => { + const source = URL.createObjectURL(file); - onFileRead(source, file, filename); - }, - (error) => { - Log.warn('Error reading test receipt:', {message: error}); - }, - CONST.TEST_RECEIPT.FILE_TYPE, - ); - } catch (error) { - Log.warn('Error in setTestReceipt:', {message: error}); - } + onFileRead(source, file, filename); + }, + (error) => { + Log.warn('Error reading test receipt:', {message: error}); + + onFileError(error); + }, + CONST.TEST_RECEIPT.FILE_TYPE, + ); }; export default setTestReceipt; diff --git a/src/libs/actions/setTestReceipt/types.ts b/src/libs/actions/setTestReceipt/types.ts index 54eeff60bc076..119382436f9d4 100644 --- a/src/libs/actions/setTestReceipt/types.ts +++ b/src/libs/actions/setTestReceipt/types.ts @@ -3,9 +3,13 @@ import type {FileObject} from '@components/AttachmentModal'; type OnFileRead = (source: string, file: FileObject, filename: string) => void; -type ReceiptExtension = 'jpg' | 'png'; +type OnFileError = (error: unknown) => void; -type SetTestReceipt = (asset: ImageSourcePropType, assetExtension: ReceiptExtension, onFileRead: OnFileRead) => void; +type AssetExtension = 'jpg' | 'png'; + +type Asset = ImageSourcePropType; + +type SetTestReceipt = (asset: Asset, assetExtension: AssetExtension, onFileRead: OnFileRead, onFileError?: OnFileError) => void; // eslint-disable-next-line import/prefer-default-export -export type {SetTestReceipt}; +export type {Asset, AssetExtension, SetTestReceipt}; From 599c70200d5ac7d47ec25f371d877ca14d214324 Mon Sep 17 00:00:00 2001 From: Pedro Guerreiro Date: Mon, 26 May 2025 22:01:11 +0100 Subject: [PATCH 2/5] fix: linter warnings --- src/libs/actions/setTestReceipt/index.native.ts | 2 +- src/libs/actions/setTestReceipt/index.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/libs/actions/setTestReceipt/index.native.ts b/src/libs/actions/setTestReceipt/index.native.ts index 787d2cd039296..ea3e0ad1c2d64 100644 --- a/src/libs/actions/setTestReceipt/index.native.ts +++ b/src/libs/actions/setTestReceipt/index.native.ts @@ -34,7 +34,7 @@ const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead, onFil .catch((error) => { Log.warn('Error reading test receipt:', {message: error}); - onFileError(error); + onFileError?.(error); }); }; diff --git a/src/libs/actions/setTestReceipt/index.ts b/src/libs/actions/setTestReceipt/index.ts index 9fbfb621fecad..790e3c099f0fd 100644 --- a/src/libs/actions/setTestReceipt/index.ts +++ b/src/libs/actions/setTestReceipt/index.ts @@ -16,7 +16,7 @@ const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead, onFil (error) => { Log.warn('Error reading test receipt:', {message: error}); - onFileError(error); + onFileError?.(error); }, CONST.TEST_RECEIPT.FILE_TYPE, ); From b493ca7d54b3194e325273d0dc67cf575e87baaa Mon Sep 17 00:00:00 2001 From: Pedro Guerreiro Date: Tue, 27 May 2025 00:05:06 +0100 Subject: [PATCH 3/5] chore: second attempt at fixing infinite loader --- src/libs/actions/setTestReceipt/getFileURL/index.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/libs/actions/setTestReceipt/getFileURL/index.ts b/src/libs/actions/setTestReceipt/getFileURL/index.ts index d954bad898636..a44e8c77961a0 100644 --- a/src/libs/actions/setTestReceipt/getFileURL/index.ts +++ b/src/libs/actions/setTestReceipt/getFileURL/index.ts @@ -1,12 +1,11 @@ import {Image} from 'react-native'; -import ReactNativeBlobUtil from 'react-native-blob-util'; import type {Asset, AssetExtension} from '@userActions/setTestReceipt/types'; import CONFIG from '@src/CONFIG'; import CONST from '@src/CONST'; function getFileURL(asset: Asset, assetExtension: AssetExtension) { const source = Image.resolveAssetSource(asset).uri; - return CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV ? source : ReactNativeBlobUtil.fs.asset(`${source}.${assetExtension}`); + return CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV ? source : `file:///android_res/drawable/${source}.${assetExtension}`; } export default getFileURL; From 2e11ac006e0c28f95ca9e73a81093564836384b0 Mon Sep 17 00:00:00 2001 From: Pedro Guerreiro Date: Tue, 27 May 2025 06:41:50 +0100 Subject: [PATCH 4/5] fix: infinite loader when starting employee test drive and mctest tooltip not responding --- .../setTestReceipt/getFile/index.ios.ts | 12 ++++++++++++ .../actions/setTestReceipt/getFile/index.ts | 19 +++++++++++++++++++ .../setTestReceipt/getFileURL/index.ios.ts | 8 -------- .../setTestReceipt/getFileURL/index.ts | 11 ----------- .../actions/setTestReceipt/index.native.ts | 12 ++++-------- 5 files changed, 35 insertions(+), 27 deletions(-) create mode 100644 src/libs/actions/setTestReceipt/getFile/index.ios.ts create mode 100644 src/libs/actions/setTestReceipt/getFile/index.ts delete mode 100644 src/libs/actions/setTestReceipt/getFileURL/index.ios.ts delete mode 100644 src/libs/actions/setTestReceipt/getFileURL/index.ts diff --git a/src/libs/actions/setTestReceipt/getFile/index.ios.ts b/src/libs/actions/setTestReceipt/getFile/index.ios.ts new file mode 100644 index 0000000000000..9c449a1e163ad --- /dev/null +++ b/src/libs/actions/setTestReceipt/getFile/index.ios.ts @@ -0,0 +1,12 @@ +import ReactNativeBlobUtil from 'react-native-blob-util'; +import type {AssetExtension} from '@userActions/setTestReceipt/types'; + +function getFile(source: string, path: string, assetExtension: AssetExtension) { + return ReactNativeBlobUtil.config({ + fileCache: true, + appendExt: assetExtension, + path, + }).fetch('GET', source); +} + +export default getFile; diff --git a/src/libs/actions/setTestReceipt/getFile/index.ts b/src/libs/actions/setTestReceipt/getFile/index.ts new file mode 100644 index 0000000000000..0d74e9e318bbe --- /dev/null +++ b/src/libs/actions/setTestReceipt/getFile/index.ts @@ -0,0 +1,19 @@ +import ReactNativeBlobUtil from 'react-native-blob-util'; +import RNFS from 'react-native-fs'; +import type {AssetExtension} from '@userActions/setTestReceipt/types'; +import CONFIG from '@src/CONFIG'; +import CONST from '@src/CONST'; + +function getFile(source: string, path: string, assetExtension: AssetExtension) { + if (CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV) { + return ReactNativeBlobUtil.config({ + fileCache: true, + appendExt: assetExtension, + path, + }).fetch('GET', source); + } + + return RNFS.copyFileRes(`${source}.${assetExtension}`, path); +} + +export default getFile; diff --git a/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts b/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts deleted file mode 100644 index bdaae659ed622..0000000000000 --- a/src/libs/actions/setTestReceipt/getFileURL/index.ios.ts +++ /dev/null @@ -1,8 +0,0 @@ -import {Image} from 'react-native'; -import type {Asset} from '@userActions/setTestReceipt/types'; - -function getFileURL(asset: Asset) { - return Image.resolveAssetSource(asset).uri; -} - -export default getFileURL; diff --git a/src/libs/actions/setTestReceipt/getFileURL/index.ts b/src/libs/actions/setTestReceipt/getFileURL/index.ts deleted file mode 100644 index a44e8c77961a0..0000000000000 --- a/src/libs/actions/setTestReceipt/getFileURL/index.ts +++ /dev/null @@ -1,11 +0,0 @@ -import {Image} from 'react-native'; -import type {Asset, AssetExtension} from '@userActions/setTestReceipt/types'; -import CONFIG from '@src/CONFIG'; -import CONST from '@src/CONST'; - -function getFileURL(asset: Asset, assetExtension: AssetExtension) { - const source = Image.resolveAssetSource(asset).uri; - return CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV ? source : `file:///android_res/drawable/${source}.${assetExtension}`; -} - -export default getFileURL; diff --git a/src/libs/actions/setTestReceipt/index.native.ts b/src/libs/actions/setTestReceipt/index.native.ts index ea3e0ad1c2d64..49d547708edba 100644 --- a/src/libs/actions/setTestReceipt/index.native.ts +++ b/src/libs/actions/setTestReceipt/index.native.ts @@ -1,21 +1,17 @@ +import {Image} from 'react-native'; import ReactNativeBlobUtil from 'react-native-blob-util'; import type {FileObject} from '@components/AttachmentModal'; import Log from '@libs/Log'; import CONST from '@src/CONST'; -import getFileURL from './getFileURL'; +import getFile from './getFile'; import type {SetTestReceipt} from './types'; const setTestReceipt: SetTestReceipt = (asset, assetExtension, onFileRead, onFileError) => { const filename = `${CONST.TEST_RECEIPT.FILENAME}_${Date.now()}.${assetExtension}`; const path = `${ReactNativeBlobUtil.fs.dirs.CacheDir}/${filename}`; - const source = getFileURL(asset, assetExtension); + const source = Image.resolveAssetSource(asset).uri; - ReactNativeBlobUtil.config({ - fileCache: true, - appendExt: assetExtension, - path, - }) - .fetch('GET', source) + getFile(source, path, assetExtension) .then(() => { const file: FileObject = { uri: `file://${path}`, From a1be562abf1cf44765711de44cf0fbc0ff0a5b55 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A1bio=20Henriques?= Date: Tue, 27 May 2025 13:44:21 +0100 Subject: [PATCH 5/5] Address feedback --- src/libs/actions/setTestReceipt/getFile/index.ios.ts | 6 +++--- src/libs/actions/setTestReceipt/getFile/index.ts | 6 +++--- src/libs/actions/setTestReceipt/getFile/types.ts | 6 ++++++ src/libs/actions/setTestReceipt/types.ts | 7 ++----- 4 files changed, 14 insertions(+), 11 deletions(-) create mode 100644 src/libs/actions/setTestReceipt/getFile/types.ts diff --git a/src/libs/actions/setTestReceipt/getFile/index.ios.ts b/src/libs/actions/setTestReceipt/getFile/index.ios.ts index 9c449a1e163ad..998109baaeb51 100644 --- a/src/libs/actions/setTestReceipt/getFile/index.ios.ts +++ b/src/libs/actions/setTestReceipt/getFile/index.ios.ts @@ -1,12 +1,12 @@ import ReactNativeBlobUtil from 'react-native-blob-util'; -import type {AssetExtension} from '@userActions/setTestReceipt/types'; +import type GetFile from './types'; -function getFile(source: string, path: string, assetExtension: AssetExtension) { +const getFile: GetFile = (source, path, assetExtension) => { return ReactNativeBlobUtil.config({ fileCache: true, appendExt: assetExtension, path, }).fetch('GET', source); -} +}; export default getFile; diff --git a/src/libs/actions/setTestReceipt/getFile/index.ts b/src/libs/actions/setTestReceipt/getFile/index.ts index 0d74e9e318bbe..9514a69969e7c 100644 --- a/src/libs/actions/setTestReceipt/getFile/index.ts +++ b/src/libs/actions/setTestReceipt/getFile/index.ts @@ -1,10 +1,10 @@ import ReactNativeBlobUtil from 'react-native-blob-util'; import RNFS from 'react-native-fs'; -import type {AssetExtension} from '@userActions/setTestReceipt/types'; import CONFIG from '@src/CONFIG'; import CONST from '@src/CONST'; +import type GetFile from './types'; -function getFile(source: string, path: string, assetExtension: AssetExtension) { +const getFile: GetFile = (source, path, assetExtension) => { if (CONFIG.ENVIRONMENT === CONST.ENVIRONMENT.DEV) { return ReactNativeBlobUtil.config({ fileCache: true, @@ -14,6 +14,6 @@ function getFile(source: string, path: string, assetExtension: AssetExtension) { } return RNFS.copyFileRes(`${source}.${assetExtension}`, path); -} +}; export default getFile; diff --git a/src/libs/actions/setTestReceipt/getFile/types.ts b/src/libs/actions/setTestReceipt/getFile/types.ts new file mode 100644 index 0000000000000..3d1300e248c5b --- /dev/null +++ b/src/libs/actions/setTestReceipt/getFile/types.ts @@ -0,0 +1,6 @@ +import type {FetchBlobResponse} from 'react-native-blob-util'; +import type {AssetExtension} from '@userActions/setTestReceipt/types'; + +type GetFile = (source: string, path: string, assetExtension: AssetExtension) => Promise; + +export default GetFile; diff --git a/src/libs/actions/setTestReceipt/types.ts b/src/libs/actions/setTestReceipt/types.ts index 119382436f9d4..785ea115bea3a 100644 --- a/src/libs/actions/setTestReceipt/types.ts +++ b/src/libs/actions/setTestReceipt/types.ts @@ -7,9 +7,6 @@ type OnFileError = (error: unknown) => void; type AssetExtension = 'jpg' | 'png'; -type Asset = ImageSourcePropType; +type SetTestReceipt = (asset: ImageSourcePropType, assetExtension: AssetExtension, onFileRead: OnFileRead, onFileError?: OnFileError) => void; -type SetTestReceipt = (asset: Asset, assetExtension: AssetExtension, onFileRead: OnFileRead, onFileError?: OnFileError) => void; - -// eslint-disable-next-line import/prefer-default-export -export type {Asset, AssetExtension, SetTestReceipt}; +export type {AssetExtension, SetTestReceipt};