From 769e6a991e0f6d5c8477819a4ae8b0768f2607d3 Mon Sep 17 00:00:00 2001 From: Santhoshkumar Sellavel Date: Tue, 3 Aug 2021 01:07:35 +0530 Subject: [PATCH 1/3] IOU Error Handling, navigated back to Amount Page on error --- src/languages/en.js | 5 ++++ src/languages/es.js | 5 ++++ src/libs/actions/IOU.js | 62 +++++++++++++++++++++++++++++---------- src/pages/iou/IOUModal.js | 11 +++++++ 4 files changed, 68 insertions(+), 15 deletions(-) diff --git a/src/languages/en.js b/src/languages/en.js index 0f14c11433589..d6c02c9beb51c 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -167,6 +167,11 @@ export default { send: ({amount}) => `Send ${amount}`, choosePaymentMethod: 'Choose payment method:', noReimbursableExpenses: 'This report has an invalid amount', + error: { + invalidAmount: 'Invalid Amount', + invalidSplit: 'Splits amount does not equal total amount', + other: 'Unexpected error, please try again later', + }, }, reportDetailsPage: { notificationPreferencesDescription: 'How often should we notify you when there are new messages to catch up on in this room?', diff --git a/src/languages/es.js b/src/languages/es.js index f4d3b8eff7c68..5de87898b22e5 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -167,6 +167,11 @@ export default { send: ({amount}) => `Enviar ${amount}`, choosePaymentMethod: 'Elige el método de pago:', noReimbursableExpenses: 'El monto de este informe es inválido', + error: { + invalidAmount: 'Invalid Amount', + invalidSplit: 'Splits amount does not equal total amount', + other: 'Unexpected error, please try again later', + }, }, reportDetailsPage: { notificationPreferencesDescription: 'Cada cuanto tiempo quieres que te avisemos que hay nuevos mensajes en este canal?', diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index 5665592335489..6be601ffe21e8 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -55,6 +55,20 @@ function getIOUReportsForNewTransaction(requestParams) { .finally(() => Onyx.merge(ONYXKEYS.IOU, {loading: false, creatingIOUTransaction: false})); } +/** + * Returns IOU Transaction Error Messages + * @param {Number} responseCode + */ + +function getIOUErrorMessage(responseCode) { + if (responseCode === 405) { + return translateLocal('iou.error.invalidAmount'); + } if (responseCode === 404) { + return translateLocal('iou.error.invalidSplit'); + } + return translateLocal('iou.error.other'); +} + /** * Creates IOUSplit Transaction * @param {Object} params @@ -67,8 +81,17 @@ function createIOUTransaction(params) { Onyx.merge(ONYXKEYS.IOU, {loading: true, creatingIOUTransaction: true, error: false}); API.CreateIOUTransaction(params) .then((data) => { - getIOUReportsForNewTransaction([data]); - Navigation.navigate(ROUTES.getReportRoute(data.chatReportID)); + if (data.jsonCode === 200) { + getIOUReportsForNewTransaction([data]); + Navigation.navigate(ROUTES.getReportRoute(data.chatReportID)); + } else { + Onyx.merge(ONYXKEYS.IOU, { + loading: false, + creatingIOUTransaction: false, + error: true, + }); + Growl.error(getIOUErrorMessage(data.jsonCode)); + } }); } @@ -96,21 +119,30 @@ function createIOUSplit(params) { }); }) .then((data) => { - // This data needs to go from this: - // {reportIDList: [1, 2], chatReportIDList: [3, 4]} - // to this: - // [{reportID: 1, chatReportID: 3}, {reportID: 2, chatReportID: 4}] - // in order for getIOUReportsForNewTransaction to know which IOU reports are associated with which - // chat reports - const reportParams = []; - for (let i = 0; i < data.reportIDList.length; i++) { - reportParams.push({ - reportID: data.reportIDList[i], - chatReportID: data.chatReportIDList[i], + if (data.jsonCode === 200) { + // This data needs to go from this: + // {reportIDList: [1, 2], chatReportIDList: [3, 4]} + // to this: + // [{reportID: 1, chatReportID: 3}, {reportID: 2, chatReportID: 4}] + // in order for getIOUReportsForNewTransaction to know which IOU reports are associated with which + // chat reports + const reportParams = []; + for (let i = 0; i < data.reportIDList.length; i++) { + reportParams.push({ + reportID: data.reportIDList[i], + chatReportID: data.chatReportIDList[i], + }); + } + getIOUReportsForNewTransaction(reportParams); + Navigation.navigate(ROUTES.getReportRoute(chatReportID)); + } else { + Onyx.merge(ONYXKEYS.IOU, { + loading: false, + creatingIOUTransaction: false, + error: true, }); + Growl.error(getIOUErrorMessage(data.jsonCode)); } - getIOUReportsForNewTransaction(reportParams); - Navigation.navigate(ROUTES.getReportRoute(chatReportID)); }); } diff --git a/src/pages/iou/IOUModal.js b/src/pages/iou/IOUModal.js index 660ca27b0422b..1b6bd1f152e6d 100755 --- a/src/pages/iou/IOUModal.js +++ b/src/pages/iou/IOUModal.js @@ -101,6 +101,7 @@ class IOUModal extends Component { this.addParticipants = this.addParticipants.bind(this); this.createTransaction = this.createTransaction.bind(this); this.updateComment = this.updateComment.bind(this); + this.handleTransactionError = this.handleTransactionError.bind(this); const participants = lodashGet(props, 'report.participants', []); const participantsWithDetails = getPersonalDetailsForLogins(participants, props.personalDetails) .map(personalDetails => ({ @@ -140,6 +141,11 @@ class IOUModal extends Component { Navigation.dismissModal(); } + // If transaction fails, handling it here + if (prevProps.iou.creatingIOUTransaction && this.props.iou.error === true) { + this.handleTransactionError(); + } + if (prevProps.iou.selectedCurrencyCode !== this.props.iou.selectedCurrencyCode) { setIOUSelectedCurrency(this.props.iou.selectedCurrencyCode); @@ -248,6 +254,11 @@ class IOUModal extends Component { }); } + handleTransactionError() { + // Navigating to Enter Amount Page + this.setState({currentStepIndex: 0}); + } + render() { const currentStep = this.steps[this.state.currentStepIndex]; const reportID = lodashGet(this.props, 'route.params.reportID', ''); From a697fff222b34fd2b0dba70af6ada8ecf6278bf9 Mon Sep 17 00:00:00 2001 From: Santhoshkumar Sellavel Date: Wed, 4 Aug 2021 03:04:59 +0530 Subject: [PATCH 2/3] IOU Error messages, Spansish translation updated --- src/languages/es.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/languages/es.js b/src/languages/es.js index 5de87898b22e5..8c27d33b81f9f 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -168,9 +168,9 @@ export default { choosePaymentMethod: 'Elige el método de pago:', noReimbursableExpenses: 'El monto de este informe es inválido', error: { - invalidAmount: 'Invalid Amount', - invalidSplit: 'Splits amount does not equal total amount', - other: 'Unexpected error, please try again later', + invalidAmount: 'Monto no válido', + invalidSplit: 'La suma de las partes no equivale al monto total', + other: 'Error inesperado, por favor inténtalo más tarde', }, }, reportDetailsPage: { From b576a7327795144a4485a1623fb9f422747dd135 Mon Sep 17 00:00:00 2001 From: Santhoshkumar Sellavel Date: Wed, 4 Aug 2021 03:09:12 +0530 Subject: [PATCH 3/3] IOU transaction error handling, updated with proper promise rejection --- src/libs/API.js | 7 ++++ src/libs/actions/IOU.js | 76 ++++++++++++++++++++--------------------- 2 files changed, 44 insertions(+), 39 deletions(-) diff --git a/src/libs/API.js b/src/libs/API.js index 01d0e819b2cda..8a3c56b505e33 100644 --- a/src/libs/API.js +++ b/src/libs/API.js @@ -160,6 +160,13 @@ Network.registerResponseHandler((queuedRequest, response) => { return; } + if (response.jsonCode === 405 || response.jsonCode === 404) { + // IOU Split & Request money transactions failed due to invalid amount(405) or unable to split(404) + // It's a failure, so reject the queued request + queuedRequest.reject(response); + return; + } + queuedRequest.resolve(response); }); diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index 6be601ffe21e8..1483a0beef029 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -57,14 +57,16 @@ function getIOUReportsForNewTransaction(requestParams) { /** * Returns IOU Transaction Error Messages - * @param {Number} responseCode + * @param {Object} error */ -function getIOUErrorMessage(responseCode) { - if (responseCode === 405) { - return translateLocal('iou.error.invalidAmount'); - } if (responseCode === 404) { - return translateLocal('iou.error.invalidSplit'); +function getIOUErrorMessage(error) { + if (error && error.jsonCode) { + if (error.jsonCode === 405) { + return translateLocal('iou.error.invalidAmount'); + } if (error.jsonCode === 404) { + return translateLocal('iou.error.invalidSplit'); + } } return translateLocal('iou.error.other'); } @@ -81,17 +83,15 @@ function createIOUTransaction(params) { Onyx.merge(ONYXKEYS.IOU, {loading: true, creatingIOUTransaction: true, error: false}); API.CreateIOUTransaction(params) .then((data) => { - if (data.jsonCode === 200) { - getIOUReportsForNewTransaction([data]); - Navigation.navigate(ROUTES.getReportRoute(data.chatReportID)); - } else { - Onyx.merge(ONYXKEYS.IOU, { - loading: false, - creatingIOUTransaction: false, - error: true, - }); - Growl.error(getIOUErrorMessage(data.jsonCode)); - } + getIOUReportsForNewTransaction([data]); + Navigation.navigate(ROUTES.getReportRoute(data.chatReportID)); + })?.catch((error) => { + Onyx.merge(ONYXKEYS.IOU, { + loading: false, + creatingIOUTransaction: false, + error: true, + }); + Growl.error(getIOUErrorMessage(error)); }); } @@ -119,30 +119,28 @@ function createIOUSplit(params) { }); }) .then((data) => { - if (data.jsonCode === 200) { - // This data needs to go from this: - // {reportIDList: [1, 2], chatReportIDList: [3, 4]} - // to this: - // [{reportID: 1, chatReportID: 3}, {reportID: 2, chatReportID: 4}] - // in order for getIOUReportsForNewTransaction to know which IOU reports are associated with which - // chat reports - const reportParams = []; - for (let i = 0; i < data.reportIDList.length; i++) { - reportParams.push({ - reportID: data.reportIDList[i], - chatReportID: data.chatReportIDList[i], - }); - } - getIOUReportsForNewTransaction(reportParams); - Navigation.navigate(ROUTES.getReportRoute(chatReportID)); - } else { - Onyx.merge(ONYXKEYS.IOU, { - loading: false, - creatingIOUTransaction: false, - error: true, + // This data needs to go from this: + // {reportIDList: [1, 2], chatReportIDList: [3, 4]} + // to this: + // [{reportID: 1, chatReportID: 3}, {reportID: 2, chatReportID: 4}] + // in order for getIOUReportsForNewTransaction to know which IOU reports are associated with which + // chat reports + const reportParams = []; + for (let i = 0; i < data.reportIDList.length; i++) { + reportParams.push({ + reportID: data.reportIDList[i], + chatReportID: data.chatReportIDList[i], }); - Growl.error(getIOUErrorMessage(data.jsonCode)); } + getIOUReportsForNewTransaction(reportParams); + Navigation.navigate(ROUTES.getReportRoute(chatReportID)); + })?.catch((error) => { + Onyx.merge(ONYXKEYS.IOU, { + loading: false, + creatingIOUTransaction: false, + error: true, + }); + Growl.error(getIOUErrorMessage(error)); }); }