From 6ecbaec10d4ca1748145ac786b20f7cfb9d76f3c Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Fri, 11 Aug 2023 10:39:14 +0200 Subject: [PATCH 1/5] feat: enable editing currency --- src/ROUTES.js | 2 ++ .../AppNavigator/ModalStackNavigators.js | 7 +++++++ src/libs/Navigation/linkingConfig.js | 1 + src/pages/EditRequestAmountPage.js | 14 ++++++++++++-- src/pages/EditRequestPage.js | 2 +- src/pages/iou/steps/MoneyRequestAmountForm.js | 7 +------ 6 files changed, 24 insertions(+), 9 deletions(-) diff --git a/src/ROUTES.js b/src/ROUTES.js index 6c0365e40568..e63f4ae72b1e 100644 --- a/src/ROUTES.js +++ b/src/ROUTES.js @@ -68,7 +68,9 @@ export default { REPORT, REPORT_WITH_ID: 'r/:reportID?', EDIT_REQUEST: 'r/:threadReportID/edit/:field', + EDIT_CURRENCY_REQUEST: 'r/:threadReportID/edit/currency', getEditRequestRoute: (threadReportID, field) => `r/${threadReportID}/edit/${field}`, + getEditRequestCurrencyRoute: (threadReportID, currency, backTo) => `r/${threadReportID}/edit/currency?currency=${currency}&backTo=${backTo}`, getReportRoute: (reportID) => `r/${reportID}`, REPORT_WITH_ID_DETAILS_SHARE_CODE: 'r/:reportID/details/shareCode', getReportShareCodeRoute: (reportID) => `r/${reportID}/details/shareCode`, diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.js b/src/libs/Navigation/AppNavigator/ModalStackNavigators.js index 8a489afb035e..ab9e2dcd73b2 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.js +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.js @@ -723,6 +723,13 @@ const EditRequestStackNavigator = createModalStackNavigator([ }, name: 'EditRequest_Root', }, + { + getComponent: () => { + const IOUCurrencySelection = require('../../../pages/iou/IOUCurrencySelection').default; + return IOUCurrencySelection; + }, + name: 'EditRequest_Currency', + }, ]); export { diff --git a/src/libs/Navigation/linkingConfig.js b/src/libs/Navigation/linkingConfig.js index dcc4f77fde73..5a3f0a9abe71 100644 --- a/src/libs/Navigation/linkingConfig.js +++ b/src/libs/Navigation/linkingConfig.js @@ -361,6 +361,7 @@ export default { EditRequest: { screens: { EditRequest_Root: ROUTES.EDIT_REQUEST, + EditRequest_Currency: ROUTES.EDIT_CURRENCY_REQUEST, }, }, }, diff --git a/src/pages/EditRequestAmountPage.js b/src/pages/EditRequestAmountPage.js index cb4817bbaaf3..5e6064318866 100644 --- a/src/pages/EditRequestAmountPage.js +++ b/src/pages/EditRequestAmountPage.js @@ -7,6 +7,7 @@ import HeaderWithBackButton from '../components/HeaderWithBackButton'; import Navigation from '../libs/Navigation/Navigation'; import useLocalize from '../hooks/useLocalize'; import MoneyRequestAmountForm from './iou/steps/MoneyRequestAmountForm'; +import ROUTES from '../ROUTES'; const propTypes = { /** Transaction default amount value */ @@ -17,9 +18,12 @@ const propTypes = { /** Callback to fire when the Save button is pressed */ onSubmit: PropTypes.func.isRequired, + + /** reportID for the "transaction thread" */ + reportID: PropTypes.string.isRequired, }; -function EditRequestAmountPage({defaultAmount, defaultCurrency, onSubmit}) { +function EditRequestAmountPage({defaultAmount, defaultCurrency, onSubmit, reportID}) { const {translate} = useLocalize(); const textInput = useRef(null); @@ -36,6 +40,12 @@ function EditRequestAmountPage({defaultAmount, defaultCurrency, onSubmit}) { }); }; + const navigateToCurrencySelectionPage = () => { + // Remove query from the route and encode it. + const activeRoute = encodeURIComponent(Navigation.getActiveRoute().replace(/\?.*/, '')); + Navigation.navigate(ROUTES.getEditRequestCurrencyRoute(reportID, defaultCurrency, activeRoute)); + }; + useFocusEffect( useCallback(() => { focusTextInput(); @@ -57,7 +67,7 @@ function EditRequestAmountPage({defaultAmount, defaultCurrency, onSubmit}) { currency={defaultCurrency} amount={defaultAmount} ref={(e) => (textInput.current = e)} - onCurrencyButtonPress={() => null} + onCurrencyButtonPress={navigateToCurrencySelectionPage} onSubmitButtonPress={onSubmit} /> diff --git a/src/pages/EditRequestPage.js b/src/pages/EditRequestPage.js index 6c5a5677c505..4cbe1e87ad86 100644 --- a/src/pages/EditRequestPage.js +++ b/src/pages/EditRequestPage.js @@ -41,7 +41,7 @@ function EditRequestPage({report, route}) { const transaction = TransactionUtils.getTransaction(transactionID); const transactionDescription = TransactionUtils.getDescription(transaction); const transactionAmount = TransactionUtils.getAmount(transaction); - const transactionCurrency = TransactionUtils.getCurrency(transaction); + const transactionCurrency = lodashGet(route, 'params.currency', '') || TransactionUtils.getCurrency(transaction); // Take only the YYYY-MM-DD value const transactionCreatedDate = new Date(TransactionUtils.getCreated(transaction)); diff --git a/src/pages/iou/steps/MoneyRequestAmountForm.js b/src/pages/iou/steps/MoneyRequestAmountForm.js index ed6066972119..18d719ae6ed5 100644 --- a/src/pages/iou/steps/MoneyRequestAmountForm.js +++ b/src/pages/iou/steps/MoneyRequestAmountForm.js @@ -31,9 +31,6 @@ const propTypes = { /** Fired when submit button pressed, saves the given amount and navigates to the next page */ onSubmitButtonPress: PropTypes.func.isRequired, - - /** Flag to indicate if the button should be disabled */ - disableCurrency: PropTypes.bool, }; const defaultProps = { @@ -41,7 +38,6 @@ const defaultProps = { currency: CONST.CURRENCY.USD, forwardedRef: null, isEditing: false, - disableCurrency: false, }; /** @@ -61,7 +57,7 @@ const AMOUNT_VIEW_ID = 'amountView'; const NUM_PAD_CONTAINER_VIEW_ID = 'numPadContainerView'; const NUM_PAD_VIEW_ID = 'numPadView'; -function MoneyRequestAmountForm({amount, currency, isEditing, forwardedRef, onCurrencyButtonPress, onSubmitButtonPress, disableCurrency}) { +function MoneyRequestAmountForm({amount, currency, isEditing, forwardedRef, onCurrencyButtonPress, onSubmitButtonPress}) { const {translate, toLocaleDigit, fromLocaleDigit, numberFormat} = useLocalize(); const textInput = useRef(null); @@ -229,7 +225,6 @@ function MoneyRequestAmountForm({amount, currency, isEditing, forwardedRef, onCu } setSelection(e.nativeEvent.selection); }} - disabled={disableCurrency} /> Date: Fri, 11 Aug 2023 17:05:13 +0200 Subject: [PATCH 2/5] fix: get currency from url param --- src/pages/EditRequestPage.js | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/pages/EditRequestPage.js b/src/pages/EditRequestPage.js index 6bfe8d955c77..da31eb4d754d 100644 --- a/src/pages/EditRequestPage.js +++ b/src/pages/EditRequestPage.js @@ -42,7 +42,9 @@ function EditRequestPage({report, route}) { const transaction = TransactionUtils.getTransaction(transactionID); const transactionDescription = TransactionUtils.getDescription(transaction); const transactionAmount = TransactionUtils.getAmount(transaction, ReportUtils.isExpenseReport(ReportUtils.getParentReport(report))); - const transactionCurrency = lodashGet(route, 'params.currency', '') || TransactionUtils.getCurrency(transaction); + const transactionCurrency = TransactionUtils.getCurrency(transaction); + + const defaultCurrency = lodashGet(route, 'params.currency', '') || transactionCurrency; // Take only the YYYY-MM-DD value const transactionCreatedDate = new Date(TransactionUtils.getCreated(transaction)); @@ -91,19 +93,19 @@ function EditRequestPage({report, route}) { return ( { const amount = CurrencyUtils.convertToSmallestUnit(transactionCurrency, Number.parseFloat(transactionChanges)); - // In case the amount hasn't been changed, do not make the API request. - if (amount === transactionAmount) { + // In case the amount and the currency haven't been changed, do not make the API request. + if (amount === transactionAmount && transactionCurrency === defaultCurrency) { Navigation.dismissModal(); return; } // Temporarily disabling currency editing and it will be enabled as a quick follow up editMoneyRequest({ amount, - currency: transactionCurrency, + currency: defaultCurrency, }); }} /> From 677f6a5a1433c13585a1b64acaf4df81742647e2 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Fri, 11 Aug 2023 17:21:03 +0200 Subject: [PATCH 3/5] fix: remove disabled prop for currency symbol --- src/components/CurrencySymbolButton.js | 11 +---------- src/components/TextInputWithCurrencySymbol.js | 5 ----- 2 files changed, 1 insertion(+), 15 deletions(-) diff --git a/src/components/CurrencySymbolButton.js b/src/components/CurrencySymbolButton.js index bd94e5334e9b..ab4488c65f49 100644 --- a/src/components/CurrencySymbolButton.js +++ b/src/components/CurrencySymbolButton.js @@ -13,16 +13,9 @@ const propTypes = { /** Function to call when currency button is pressed */ onCurrencyButtonPress: PropTypes.func.isRequired, - - /** Flag to indicate if the button should be disabled */ - disabled: PropTypes.bool, -}; - -const defaultProps = { - disabled: false, }; -function CurrencySymbolButton({onCurrencyButtonPress, currencySymbol, disabled}) { +function CurrencySymbolButton({onCurrencyButtonPress, currencySymbol}) { const {translate} = useLocalize(); return ( @@ -30,7 +23,6 @@ function CurrencySymbolButton({onCurrencyButtonPress, currencySymbol, disabled}) onPress={onCurrencyButtonPress} accessibilityLabel={translate('iOUCurrencySelection.selectCurrency')} accessibilityRole={CONST.ACCESSIBILITY_ROLE.BUTTON} - disabled={disabled} > {currencySymbol} @@ -40,6 +32,5 @@ function CurrencySymbolButton({onCurrencyButtonPress, currencySymbol, disabled}) CurrencySymbolButton.propTypes = propTypes; CurrencySymbolButton.displayName = 'CurrencySymbolButton'; -CurrencySymbolButton.defaultProps = defaultProps; export default CurrencySymbolButton; diff --git a/src/components/TextInputWithCurrencySymbol.js b/src/components/TextInputWithCurrencySymbol.js index 06f2c62fedd8..ef3fc3a1464a 100644 --- a/src/components/TextInputWithCurrencySymbol.js +++ b/src/components/TextInputWithCurrencySymbol.js @@ -31,9 +31,6 @@ const propTypes = { /** Function to call when selection in text input is changed */ onSelectionChange: PropTypes.func, - - /** Flag to indicate if the button should be disabled */ - disabled: PropTypes.bool, }; const defaultProps = { @@ -42,7 +39,6 @@ const defaultProps = { onCurrencyButtonPress: () => {}, selection: undefined, onSelectionChange: () => {}, - disabled: false, }; function TextInputWithCurrencySymbol(props) { @@ -59,7 +55,6 @@ function TextInputWithCurrencySymbol(props) { ); From b67eae039be90ad4d102c58eecd12e57c362c8c6 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Wed, 16 Aug 2023 09:46:47 +0200 Subject: [PATCH 4/5] fix: apply requested changes --- src/ROUTES.js | 2 +- src/components/CurrencySymbolButton.js | 4 ++-- src/pages/EditRequestAmountPage.js | 3 +-- 3 files changed, 4 insertions(+), 5 deletions(-) diff --git a/src/ROUTES.js b/src/ROUTES.js index e63f4ae72b1e..0a582edce43d 100644 --- a/src/ROUTES.js +++ b/src/ROUTES.js @@ -68,8 +68,8 @@ export default { REPORT, REPORT_WITH_ID: 'r/:reportID?', EDIT_REQUEST: 'r/:threadReportID/edit/:field', - EDIT_CURRENCY_REQUEST: 'r/:threadReportID/edit/currency', getEditRequestRoute: (threadReportID, field) => `r/${threadReportID}/edit/${field}`, + EDIT_CURRENCY_REQUEST: 'r/:threadReportID/edit/currency', getEditRequestCurrencyRoute: (threadReportID, currency, backTo) => `r/${threadReportID}/edit/currency?currency=${currency}&backTo=${backTo}`, getReportRoute: (reportID) => `r/${reportID}`, REPORT_WITH_ID_DETAILS_SHARE_CODE: 'r/:reportID/details/shareCode', diff --git a/src/components/CurrencySymbolButton.js b/src/components/CurrencySymbolButton.js index eaa191be7303..ab4488c65f49 100644 --- a/src/components/CurrencySymbolButton.js +++ b/src/components/CurrencySymbolButton.js @@ -18,10 +18,10 @@ const propTypes = { function CurrencySymbolButton({onCurrencyButtonPress, currencySymbol}) { const {translate} = useLocalize(); return ( - + {currencySymbol} diff --git a/src/pages/EditRequestAmountPage.js b/src/pages/EditRequestAmountPage.js index 4f8eb39adbd2..d087d86ebdf5 100644 --- a/src/pages/EditRequestAmountPage.js +++ b/src/pages/EditRequestAmountPage.js @@ -19,7 +19,7 @@ const propTypes = { /** Callback to fire when the Save button is pressed */ onSubmit: PropTypes.func.isRequired, - /** reportID for the "transaction thread" */ + /** reportID for the transaction thread */ reportID: PropTypes.string.isRequired, }; @@ -63,7 +63,6 @@ function EditRequestAmountPage({defaultAmount, defaultCurrency, onSubmit, report /> (textInput.current = e)} From 7f62d47727385c9dcf2ff5621f1592f80434a236 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 17 Aug 2023 09:51:46 +0200 Subject: [PATCH 5/5] fix: onSubmit amount hotfix --- src/pages/EditRequestPage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/EditRequestPage.js b/src/pages/EditRequestPage.js index 598867193c59..2238c0cf309f 100644 --- a/src/pages/EditRequestPage.js +++ b/src/pages/EditRequestPage.js @@ -108,7 +108,7 @@ function EditRequestPage({report, route, parentReport}) { defaultCurrency={defaultCurrency} reportID={report.reportID} onSubmit={(transactionChanges) => { - const amount = CurrencyUtils.convertToBackendAmount(defaultCurrency, Number.parseFloat(transactionChanges)); + const amount = CurrencyUtils.convertToBackendAmount(Number.parseFloat(transactionChanges)); // In case the amount hasn't been changed, do not make the API request. if (amount === transactionAmount && transactionCurrency === defaultCurrency) { Navigation.dismissModal();