From 02b2315b9e91a1b96800045c82d23bedb018b164 Mon Sep 17 00:00:00 2001 From: ntdiary <2471314@gmail.com> Date: Tue, 16 Apr 2024 22:56:51 +0800 Subject: [PATCH 001/219] clean up mobile safari code --- src/libs/updateMultilineInputRange/index.ts | 11 ++---- .../report/ReportActionItemMessageEdit.tsx | 35 ++++--------------- 2 files changed, 9 insertions(+), 37 deletions(-) diff --git a/src/libs/updateMultilineInputRange/index.ts b/src/libs/updateMultilineInputRange/index.ts index f5d71c5e2038..d0bc1c306dac 100644 --- a/src/libs/updateMultilineInputRange/index.ts +++ b/src/libs/updateMultilineInputRange/index.ts @@ -1,4 +1,3 @@ -import * as Browser from '@libs/Browser'; import type UpdateMultilineInputRange from './types'; /** @@ -17,14 +16,10 @@ const updateMultilineInputRange: UpdateMultilineInputRange = (input, shouldAutoF if ('value' in input && input.value && input.setSelectionRange) { const length = input.value.length; - - // For mobile Safari, updating the selection prop on an unfocused input will cause it to automatically gain focus - // and subsequent programmatic focus shifts (e.g., modal focus trap) to show the blue frame (:focus-visible style), - // so we need to ensure that it is only updated after focus. - const shouldSetSelection = !(Browser.isMobileSafari() && !shouldAutoFocus); - if (shouldSetSelection) { - input.setSelectionRange(length, length); + if (!shouldAutoFocus) { + return; } + input.setSelectionRange(length, length); // eslint-disable-next-line no-param-reassign input.scrollTop = input.scrollHeight; } diff --git a/src/pages/home/report/ReportActionItemMessageEdit.tsx b/src/pages/home/report/ReportActionItemMessageEdit.tsx index fc3c92434fc4..8920f789e167 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.tsx +++ b/src/pages/home/report/ReportActionItemMessageEdit.tsx @@ -22,7 +22,6 @@ import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import * as Browser from '@libs/Browser'; import * as ComposerUtils from '@libs/ComposerUtils'; import * as EmojiUtils from '@libs/EmojiUtils'; import focusComposerWithDelay from '@libs/focusComposerWithDelay'; @@ -68,7 +67,6 @@ type ReportActionItemMessageEditProps = { const emojiButtonID = 'emojiButton'; const messageEditInput = 'messageEditInput'; -const isMobileSafari = Browser.isMobileSafari(); const shouldUseForcedSelectionRange = shouldUseEmojiPickerSelection(); function ReportActionItemMessageEdit( @@ -84,14 +82,6 @@ function ReportActionItemMessageEdit( const {isSmallScreenWidth} = useWindowDimensions(); const prevDraftMessage = usePrevious(draftMessage); - const getInitialSelection = () => { - if (isMobileSafari) { - return {start: 0, end: 0}; - } - - const length = draftMessage.length; - return {start: length, end: length}; - }; const emojisPresentBefore = useRef([]); const [draft, setDraft] = useState(() => { if (draftMessage) { @@ -99,7 +89,7 @@ function ReportActionItemMessageEdit( } return draftMessage; }); - const [selection, setSelection] = useState(getInitialSelection); + const [selection, setSelection] = useState({start: 0, end: 0}); const [isFocused, setIsFocused] = useState(false); const {hasExceededMaxCommentLength, validateCommentMaxLength} = useHandleExceedMaxCommentLength(); const [modal, setModal] = useState({ @@ -171,23 +161,10 @@ function ReportActionItemMessageEdit( ); useEffect(() => { - // For mobile Safari, updating the selection prop on an unfocused input will cause it to automatically gain focus - // and subsequent programmatic focus shifts (e.g., modal focus trap) to show the blue frame (:focus-visible style), - // so we need to ensure that it is only updated after focus. - if (isMobileSafari) { - setDraft((prevDraft) => { - setSelection({ - start: prevDraft.length, - end: prevDraft.length, - }); - return prevDraft; - }); - - // Scroll content of textInputRef to bottom - if (textInputRef.current) { - textInputRef.current.scrollTop = textInputRef.current.scrollHeight; - } - } + setSelection({ + start: draftMessage.length, + end: draftMessage.length, + }); return () => { InputFocus.callback(() => setIsFocused(false)); @@ -208,7 +185,7 @@ function ReportActionItemMessageEdit( // Show the main composer when the focused message is deleted from another client // to prevent the main composer stays hidden until we swtich to another chat. setShouldShowComposeInputKeyboardAware(true); - }; + } // eslint-disable-next-line react-hooks/exhaustive-deps -- this cleanup needs to be called only on unmount }, [action.reportActionID]); From ed168c1a2206d839926655ad4bc7d3334ebdc510 Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Wed, 17 Apr 2024 22:50:28 +0200 Subject: [PATCH 002/219] feat: setup Terms and Fees step --- src/languages/en.ts | 4 + src/languages/es.ts | 4 + .../TermsAndFees/TermsAndFees.tsx | 58 ++++++++++ .../TermsAndFees/substeps/FeesStep.tsx | 24 ++++ .../TermsAndFees/substeps/TermsStep.tsx | 106 ++++++++++++++++++ 5 files changed, 196 insertions(+) create mode 100644 src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx create mode 100644 src/pages/EnablePayments/TermsAndFees/substeps/FeesStep.tsx create mode 100644 src/pages/EnablePayments/TermsAndFees/substeps/TermsStep.tsx diff --git a/src/languages/en.ts b/src/languages/en.ts index fda7acc309bd..2aab5f00c830 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -1564,6 +1564,7 @@ export default { }, termsStep: { headerTitle: 'Terms and fees', + headerTitleRefactor: 'Fees and terms', haveReadAndAgree: 'I have read and agree to receive ', electronicDisclosures: 'electronic disclosures', agreeToThe: 'I agree to the', @@ -1574,6 +1575,9 @@ export default { noOverdraftOrCredit: 'No overdraft/credit feature.', electronicFundsWithdrawal: 'Electronic funds withdrawal', standard: 'Standard', + takeALookAtSomeFees: 'Take a look at some fees.', + checkPlease: 'Check please.', + agreeToTerms: 'Agree to the terms and you’ll be good to go!', shortTermsForm: { expensifyPaymentsAccount: ({walletProgram}: WalletProgramParams) => `The Expensify Wallet is issued by ${walletProgram}.`, perPurchase: 'Per purchase', diff --git a/src/languages/es.ts b/src/languages/es.ts index 46a8d051bdfe..acdf9978de0b 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -1585,6 +1585,7 @@ export default { }, termsStep: { headerTitle: 'Condiciones y tarifas', + headerTitleRefactor: 'Tarifas y condiciones', haveReadAndAgree: 'He leído y acepto recibir ', electronicDisclosures: 'divulgaciones electrónicas', agreeToThe: 'Estoy de acuerdo con el ', @@ -1595,6 +1596,9 @@ export default { noOverdraftOrCredit: 'Sin función de sobregiro/crédito', electronicFundsWithdrawal: 'Retiro electrónico de fondos', standard: 'Estándar', + takeALookAtSomeFees: 'Echa un vistazo a algunas tarifas.', + checkPlease: 'Por favor, revisa.', + agreeToTerms: 'Debes aceptar los términos y condiciones para continuar.', shortTermsForm: { expensifyPaymentsAccount: ({walletProgram}: WalletProgramParams) => `La billetera Expensify es emitida por ${walletProgram}.`, perPurchase: 'Por compra', diff --git a/src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx b/src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx new file mode 100644 index 000000000000..7e26f652efe8 --- /dev/null +++ b/src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx @@ -0,0 +1,58 @@ +import React from 'react'; +import {View} from 'react-native'; +import HeaderWithBackButton from '@components/HeaderWithBackButton'; +import InteractiveStepSubHeader from '@components/InteractiveStepSubHeader'; +import ScreenWrapper from '@components/ScreenWrapper'; +import useLocalize from '@hooks/useLocalize'; +import useSubStep from '@hooks/useSubStep'; +import type {SubStepProps} from '@hooks/useSubStep/types'; +import useThemeStyles from '@hooks/useThemeStyles'; +import CONST from '@src/CONST'; +import FeesStep from './substeps/FeesStep'; +import TermsStep from './substeps/TermsStep'; + +const termsAndFeesSubsteps: Array> = [FeesStep, TermsStep]; + +function TermsAndFees() { + const {translate} = useLocalize(); + const styles = useThemeStyles(); + + const submit = () => {}; + const {componentToRender: SubStep, isEditing, screenIndex, nextScreen, prevScreen, moveTo} = useSubStep({bodyContent: termsAndFeesSubsteps, startFrom: 0, onFinished: submit}); + + const handleBackButtonPress = () => { + if (screenIndex === 0) { + return; + } + prevScreen(); + }; + + return ( + + + + + + + + ); +} + +TermsAndFees.displayName = 'TermsAndFees'; + +export default TermsAndFees; diff --git a/src/pages/EnablePayments/TermsAndFees/substeps/FeesStep.tsx b/src/pages/EnablePayments/TermsAndFees/substeps/FeesStep.tsx new file mode 100644 index 000000000000..78ff371b747c --- /dev/null +++ b/src/pages/EnablePayments/TermsAndFees/substeps/FeesStep.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import {useOnyx} from 'react-native-onyx'; +import ScrollView from '@components/ScrollView'; +import useThemeStyles from '@hooks/useThemeStyles'; +import LongTermsForm from '@pages/EnablePayments/TermsPage/LongTermsForm'; +import ShortTermsForm from '@pages/EnablePayments/TermsPage/ShortTermsForm'; +import ONYXKEYS from '@src/ONYXKEYS'; + +function FeesStep() { + const styles = useThemeStyles(); + const [userWallet] = useOnyx(ONYXKEYS.USER_WALLET); + + return ( + + + + + ); +} + +export default FeesStep; diff --git a/src/pages/EnablePayments/TermsAndFees/substeps/TermsStep.tsx b/src/pages/EnablePayments/TermsAndFees/substeps/TermsStep.tsx new file mode 100644 index 000000000000..e77bf7db4817 --- /dev/null +++ b/src/pages/EnablePayments/TermsAndFees/substeps/TermsStep.tsx @@ -0,0 +1,106 @@ +import React, {useEffect, useState} from 'react'; +import {View} from 'react-native'; +import {useOnyx} from 'react-native-onyx'; +import CheckboxWithLabel from '@components/CheckboxWithLabel'; +import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton'; +import ScrollView from '@components/ScrollView'; +import Text from '@components/Text'; +import TextLink from '@components/TextLink'; +import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; +import * as ErrorUtils from '@libs/ErrorUtils'; +import * as BankAccounts from '@userActions/BankAccounts'; +import CONST from '@src/CONST'; +import ONYXKEYS from '@src/ONYXKEYS'; + +function HaveReadAndAgreeLabel() { + const {translate} = useLocalize(); + + return ( + + {`${translate('termsStep.haveReadAndAgree')}`} + {`${translate('termsStep.electronicDisclosures')}.`} + + ); +} + +function AgreeToTheLabel() { + const {translate} = useLocalize(); + + return ( + + {`${translate('termsStep.agreeToThe')} `} + {`${translate('common.privacy')} `} + {`${translate('common.and')} `} + {`${translate('termsStep.walletAgreement')}.`} + + ); +} + +function TermsStep() { + const styles = useThemeStyles(); + const [hasAcceptedDisclosure, setHasAcceptedDisclosure] = useState(false); + const [hasAcceptedPrivacyPolicyAndWalletAgreement, setHasAcceptedPrivacyPolicyAndWalletAgreement] = useState(false); + const [error, setError] = useState(false); + const {translate} = useLocalize(); + + const [walletTerms] = useOnyx(ONYXKEYS.WALLET_TERMS); + + const errorMessage = error ? 'common.error.acceptTerms' : ErrorUtils.getLatestErrorMessage(walletTerms ?? {}) ?? ''; + + const toggleDisclosure = () => { + setHasAcceptedDisclosure(!hasAcceptedDisclosure); + }; + + const togglePrivacyPolicy = () => { + setHasAcceptedPrivacyPolicyAndWalletAgreement(!hasAcceptedPrivacyPolicyAndWalletAgreement); + }; + + /** clear error */ + useEffect(() => { + if (!hasAcceptedDisclosure || !hasAcceptedPrivacyPolicyAndWalletAgreement) { + return; + } + + setError(false); + }, [hasAcceptedDisclosure, hasAcceptedPrivacyPolicyAndWalletAgreement]); + + return ( + + {translate('termsStep.checkPlease')} + {translate('termsStep.agreeToTerms')} + + + { + if (!hasAcceptedDisclosure || !hasAcceptedPrivacyPolicyAndWalletAgreement) { + setError(true); + return; + } + + setError(false); + BankAccounts.acceptWalletTerms({ + hasAcceptedTerms: hasAcceptedDisclosure && hasAcceptedPrivacyPolicyAndWalletAgreement, + reportID: walletTerms?.chatReportID ?? '', + }); + }} + message={errorMessage} + isAlertVisible={error || Boolean(errorMessage)} + isLoading={!!walletTerms?.isLoading} + containerStyles={[styles.mh0, styles.mv4]} + /> + + ); +} + +export default TermsStep; From 7574fc9acbe20a012b7d92a90ff1523d20b373d6 Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 13:19:08 +0100 Subject: [PATCH 003/219] add taxAmount param to updateMoneyRequestAmountAndCurrency --- src/libs/actions/IOU.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 83caa65e1d77..43cc73df9c97 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -4449,6 +4449,7 @@ type UpdateMoneyRequestAmountAndCurrencyParams = { transactionThreadReportID: string; currency: string; amount: number; + taxAmount?: number; policy?: OnyxEntry; policyTagList?: OnyxEntry; policyCategories?: OnyxEntry; @@ -4460,6 +4461,7 @@ function updateMoneyRequestAmountAndCurrency({ transactionThreadReportID, currency, amount, + taxAmount, policy, policyTagList, policyCategories, @@ -4467,6 +4469,7 @@ function updateMoneyRequestAmountAndCurrency({ const transactionChanges = { amount, currency, + ...(taxAmount && {taxAmount}), }; const {params, onyxData} = getUpdateMoneyRequestParams( transactionID, From 1ed12dfe94efdb4cf61a0cf865e98b2dd08f71ee Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 13:19:58 +0100 Subject: [PATCH 004/219] should optimistically update tax amount when updating expense amount --- .../iou/request/step/IOURequestStepAmount.tsx | 23 ++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/src/pages/iou/request/step/IOURequestStepAmount.tsx b/src/pages/iou/request/step/IOURequestStepAmount.tsx index cb8e51120f01..7b56049811fc 100644 --- a/src/pages/iou/request/step/IOURequestStepAmount.tsx +++ b/src/pages/iou/request/step/IOURequestStepAmount.tsx @@ -16,7 +16,7 @@ import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; -import type {Transaction} from '@src/types/onyx'; +import type {Policy, TaxRatesWithDefault, Transaction} from '@src/types/onyx'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; import StepScreenWrapper from './StepScreenWrapper'; import withFullTransactionOrNotFound from './withFullTransactionOrNotFound'; @@ -33,6 +33,9 @@ type IOURequestStepAmountOnyxProps = { /** The draft transaction object being modified in Onyx */ draftTransaction: OnyxEntry; + + /** The policy which the user has access to and which the report is tied to */ + policy: OnyxEntry; }; type IOURequestStepAmountProps = IOURequestStepAmountOnyxProps & @@ -40,7 +43,15 @@ type IOURequestStepAmountProps = IOURequestStepAmountOnyxProps & /** The transaction object being modified in Onyx */ transaction: OnyxEntry; }; - +function getTaxAmount(transaction: OnyxEntry, taxRates: TaxRatesWithDefault | undefined, newAmount: number) { + if (!transaction?.amount) { + return; + } + const transactionTaxCode = transaction?.taxCode ?? ''; + const defaultTaxValue = taxRates?.defaultValue; + const taxPercentage = (transactionTaxCode ? taxRates?.taxes[transactionTaxCode]?.value : defaultTaxValue) ?? ''; + return CurrencyUtils.convertToBackendAmount(TransactionUtils.calculateTaxAmount(taxPercentage, newAmount)); +} function IOURequestStepAmount({ report, route: { @@ -49,6 +60,7 @@ function IOURequestStepAmount({ transaction, splitDraftTransaction, draftTransaction, + policy, }: IOURequestStepAmountProps) { const {translate} = useLocalize(); const textInput = useRef(null); @@ -148,7 +160,9 @@ function IOURequestStepAmount({ return; } - IOU.updateMoneyRequestAmountAndCurrency({transactionID, transactionThreadReportID: reportID, currency, amount: newAmount}); + const taxAmount = getTaxAmount(transaction, policy?.taxRates, newAmount); + + IOU.updateMoneyRequestAmountAndCurrency({transactionID, transactionThreadReportID: reportID, currency, amount: newAmount, taxAmount}); Navigation.dismissModal(); }; @@ -190,6 +204,9 @@ export default withWritableReportOrNotFound( return `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`; }, }, + policy: { + key: ({report}) => `${ONYXKEYS.COLLECTION.POLICY}${report ? report.policyID : '0'}`, + }, })(IOURequestStepAmount), ), ); From 1c16b1aeab10ab4e85462dcc9b50cb399d6588f7 Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 13:33:58 +0100 Subject: [PATCH 005/219] add UpdateMoneyRequestTaxRateParams types to updateMoneyRequestTaxRate --- src/libs/actions/IOU.ts | 18 ++++++++++-------- .../request/step/IOURequestStepTaxRatePage.tsx | 9 ++++++++- 2 files changed, 18 insertions(+), 9 deletions(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 43cc73df9c97..04dd151506bb 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -2379,15 +2379,17 @@ function updateMoneyRequestTaxAmount( API.write('UpdateMoneyRequestTaxAmount', params, onyxData); } +type UpdateMoneyRequestTaxRateParams = { + transactionID: string; + optimisticReportActionID: string; + taxCode: string; + policy: OnyxEntry; + policyTagList: OnyxEntry; + policyCategories: OnyxEntry; +}; + /** Updates the created tax rate of an expense */ -function updateMoneyRequestTaxRate( - transactionID: string, - optimisticReportActionID: string, - taxCode: string, - policy: OnyxEntry, - policyTagList: OnyxEntry, - policyCategories: OnyxEntry, -) { +function updateMoneyRequestTaxRate({transactionID, optimisticReportActionID, taxCode, policy, policyTagList, policyCategories}: UpdateMoneyRequestTaxRateParams) { const transactionChanges = { taxCode, }; diff --git a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx index da3a244a2db2..3e14610652df 100644 --- a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx +++ b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx @@ -74,7 +74,14 @@ function IOURequestStepTaxRatePage({ navigateBack(); return; } - IOU.updateMoneyRequestTaxRate(transaction?.transactionID ?? '', report?.reportID ?? '', newTaxCode, policy, policyTags, policyCategories); + IOU.updateMoneyRequestTaxRate({ + transactionID: transaction?.transactionID ?? '', + optimisticReportActionID: report?.reportID ?? '', + taxCode: newTaxCode, + policy, + policyTagList: policyTags, + policyCategories, + }); navigateBack(); return; } From 8dce58a29da1500c7178168f31affbb669abeb4a Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 13:37:51 +0100 Subject: [PATCH 006/219] add taxAmount to UpdateMoneyRequestTaxRateParams types --- src/libs/actions/IOU.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/libs/actions/IOU.ts b/src/libs/actions/IOU.ts index 04dd151506bb..53fc9e408a06 100644 --- a/src/libs/actions/IOU.ts +++ b/src/libs/actions/IOU.ts @@ -2383,15 +2383,17 @@ type UpdateMoneyRequestTaxRateParams = { transactionID: string; optimisticReportActionID: string; taxCode: string; + taxAmount?: number; policy: OnyxEntry; policyTagList: OnyxEntry; policyCategories: OnyxEntry; }; /** Updates the created tax rate of an expense */ -function updateMoneyRequestTaxRate({transactionID, optimisticReportActionID, taxCode, policy, policyTagList, policyCategories}: UpdateMoneyRequestTaxRateParams) { +function updateMoneyRequestTaxRate({transactionID, optimisticReportActionID, taxCode, taxAmount, policy, policyTagList, policyCategories}: UpdateMoneyRequestTaxRateParams) { const transactionChanges = { taxCode, + ...(taxAmount && {taxAmount}), }; const {params, onyxData} = getUpdateMoneyRequestParams(transactionID, optimisticReportActionID, transactionChanges, policy, policyTagList, policyCategories, true); API.write('UpdateMoneyRequestTaxRate', params, onyxData); From 228c47705cc4a06d8d0a343be222e8e952523039 Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 14:36:36 +0100 Subject: [PATCH 007/219] should optimistically update tax amount when updating tax rate --- .../iou/request/step/IOURequestStepTaxRatePage.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx index 3e14610652df..55d43370c477 100644 --- a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx +++ b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx @@ -68,6 +68,12 @@ function IOURequestStepTaxRatePage({ : transactionTaxCode && TransactionUtils.getTaxName(taxRates.taxes, transactionTaxCode)); const updateTaxRates = (taxes: OptionsListUtils.TaxRatesOption) => { + if (!transaction || !taxes.text || !taxRates) { + Navigation.goBack(backTo); + return; + } + const taxAmount = getTaxAmount(taxRates, taxes.text, TransactionUtils.getAmount(transaction, false, true)); + if (isEditing) { const newTaxCode = taxes.data.code; if (newTaxCode === undefined || newTaxCode === TransactionUtils.getTaxCode(transaction)) { @@ -78,6 +84,7 @@ function IOURequestStepTaxRatePage({ transactionID: transaction?.transactionID ?? '', optimisticReportActionID: report?.reportID ?? '', taxCode: newTaxCode, + taxAmount: CurrencyUtils.convertToBackendAmount(taxAmount ?? 0), policy, policyTagList: policyTags, policyCategories, @@ -85,11 +92,7 @@ function IOURequestStepTaxRatePage({ navigateBack(); return; } - if (!transaction || !taxes.text || !taxRates) { - Navigation.goBack(backTo); - return; - } - const taxAmount = getTaxAmount(taxRates, taxes.text, transaction?.amount); + if (taxAmount === undefined) { Navigation.goBack(backTo); return; From a0ac9bac20da8c89b5a5f2e9bbaee1e314e7bb49 Mon Sep 17 00:00:00 2001 From: Etotaziba Olei Date: Thu, 18 Apr 2024 14:39:33 +0100 Subject: [PATCH 008/219] fix lint --- src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx index 55d43370c477..c310e88dc928 100644 --- a/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx +++ b/src/pages/iou/request/step/IOURequestStepTaxRatePage.tsx @@ -73,7 +73,7 @@ function IOURequestStepTaxRatePage({ return; } const taxAmount = getTaxAmount(taxRates, taxes.text, TransactionUtils.getAmount(transaction, false, true)); - + if (isEditing) { const newTaxCode = taxes.data.code; if (newTaxCode === undefined || newTaxCode === TransactionUtils.getTaxCode(transaction)) { From 0999bf7371971d8c50f9f39a9e03dc25023a2bea Mon Sep 17 00:00:00 2001 From: Agata Kosior Date: Thu, 18 Apr 2024 18:48:35 +0200 Subject: [PATCH 009/219] feat: rename terms and feex, fix styling, create temporary test route --- src/ROUTES.ts | 2 + src/SCREENS.ts | 2 + .../ModalStackNavigators/index.tsx | 2 + src/libs/Navigation/linkingConfig/config.ts | 5 +++ .../FeesAndTerms.tsx} | 8 ++-- .../FeesAndTerms/substeps/FeesStep.tsx | 37 +++++++++++++++++++ .../substeps/TermsStep.tsx | 32 ++++++++-------- .../TermsAndFees/substeps/FeesStep.tsx | 24 ------------ .../TermsPage/ShortTermsForm.tsx | 16 ++++---- src/styles/index.ts | 5 ++- 10 files changed, 80 insertions(+), 53 deletions(-) rename src/pages/EnablePayments/{TermsAndFees/TermsAndFees.tsx => FeesAndTerms/FeesAndTerms.tsx} (93%) create mode 100644 src/pages/EnablePayments/FeesAndTerms/substeps/FeesStep.tsx rename src/pages/EnablePayments/{TermsAndFees => FeesAndTerms}/substeps/TermsStep.tsx (79%) delete mode 100644 src/pages/EnablePayments/TermsAndFees/substeps/FeesStep.tsx diff --git a/src/ROUTES.ts b/src/ROUTES.ts index 46f2e2fef049..2ed8be54f408 100644 --- a/src/ROUTES.ts +++ b/src/ROUTES.ts @@ -119,6 +119,8 @@ const ROUTES = { SETTINGS_ADD_BANK_ACCOUNT: 'settings/wallet/add-bank-account', SETTINGS_ADD_BANK_ACCOUNT_REFACTOR: 'settings/wallet/add-bank-account-refactor', SETTINGS_ENABLE_PAYMENTS: 'settings/wallet/enable-payments', + // TODO: Added temporarily for testing purposes, remove after refactor - https://github.com/Expensify/App/issues/36648 + SETTINGS_ENABLE_PAYMENTS_TEMPORARY_TERMS: 'settings/wallet/enable-payments-temporary-terms', SETTINGS_WALLET_CARD_DIGITAL_DETAILS_UPDATE_ADDRESS: { route: 'settings/wallet/card/:domain/digital-details/update-address', getRoute: (domain: string) => `settings/wallet/card/${domain}/digital-details/update-address` as const, diff --git a/src/SCREENS.ts b/src/SCREENS.ts index acbb4b507b65..cf5723c43d31 100644 --- a/src/SCREENS.ts +++ b/src/SCREENS.ts @@ -84,6 +84,8 @@ const SCREENS = { TRANSFER_BALANCE: 'Settings_Wallet_Transfer_Balance', CHOOSE_TRANSFER_ACCOUNT: 'Settings_Wallet_Choose_Transfer_Account', ENABLE_PAYMENTS: 'Settings_Wallet_EnablePayments', + // TODO: Added temporarily for testing purposes, remove after refactor - https://github.com/Expensify/App/issues/36648 + ENABLE_PAYMENTS_TEMPORARY_TERMS: 'Settings_Wallet_EnablePayments_Temporary_Terms', CARD_ACTIVATE: 'Settings_Wallet_Card_Activate', REPORT_VIRTUAL_CARD_FRAUD: 'Settings_Wallet_ReportVirtualCardFraud', CARDS_DIGITAL_DETAILS_UPDATE_ADDRESS: 'Settings_Wallet_Cards_Digital_Details_Update_Address', diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx index a596acf0a3ac..711e911fe9f1 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx @@ -215,6 +215,8 @@ const SettingsModalStackNavigator = createModalStackNavigator require('../../../../pages/settings/Wallet/TransferBalancePage').default as React.ComponentType, [SCREENS.SETTINGS.WALLET.CHOOSE_TRANSFER_ACCOUNT]: () => require('../../../../pages/settings/Wallet/ChooseTransferAccountPage').default as React.ComponentType, [SCREENS.SETTINGS.WALLET.ENABLE_PAYMENTS]: () => require('../../../../pages/EnablePayments/EnablePaymentsPage').default as React.ComponentType, + // TODO: Added temporarily for testing purposes, remove after refactor - https://github.com/Expensify/App/issues/36648 + [SCREENS.SETTINGS.WALLET.ENABLE_PAYMENTS_TEMPORARY_TERMS]: () => require('../../../../pages/EnablePayments/FeesAndTerms/FeesAndTerms').default as React.ComponentType, [SCREENS.SETTINGS.ADD_DEBIT_CARD]: () => require('../../../../pages/settings/Wallet/AddDebitCardPage').default as React.ComponentType, [SCREENS.SETTINGS.ADD_BANK_ACCOUNT]: () => require('../../../../pages/AddPersonalBankAccountPage').default as React.ComponentType, [SCREENS.SETTINGS.ADD_BANK_ACCOUNT_REFACTOR]: () => require('../../../../pages/EnablePayments/AddBankAccount/AddBankAccount').default as React.ComponentType, diff --git a/src/libs/Navigation/linkingConfig/config.ts b/src/libs/Navigation/linkingConfig/config.ts index 05b7190fa181..c19ce019a621 100644 --- a/src/libs/Navigation/linkingConfig/config.ts +++ b/src/libs/Navigation/linkingConfig/config.ts @@ -156,6 +156,11 @@ const config: LinkingOptions['config'] = { path: ROUTES.SETTINGS_ENABLE_PAYMENTS, exact: true, }, + // TODO: Added temporarily for testing purposes, remove after refactor - https://github.com/Expensify/App/issues/36648 + [SCREENS.SETTINGS.WALLET.ENABLE_PAYMENTS_TEMPORARY_TERMS]: { + path: ROUTES.SETTINGS_ENABLE_PAYMENTS_TEMPORARY_TERMS, + exact: true, + }, [SCREENS.SETTINGS.WALLET.TRANSFER_BALANCE]: { path: ROUTES.SETTINGS_WALLET_TRANSFER_BALANCE, exact: true, diff --git a/src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx b/src/pages/EnablePayments/FeesAndTerms/FeesAndTerms.tsx similarity index 93% rename from src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx rename to src/pages/EnablePayments/FeesAndTerms/FeesAndTerms.tsx index 7e26f652efe8..76955e860f13 100644 --- a/src/pages/EnablePayments/TermsAndFees/TermsAndFees.tsx +++ b/src/pages/EnablePayments/FeesAndTerms/FeesAndTerms.tsx @@ -13,7 +13,7 @@ import TermsStep from './substeps/TermsStep'; const termsAndFeesSubsteps: Array> = [FeesStep, TermsStep]; -function TermsAndFees() { +function FeesAndTerms() { const {translate} = useLocalize(); const styles = useThemeStyles(); @@ -29,7 +29,7 @@ function TermsAndFees() { return ( + {translate('termsStep.takeALookAtSomeFees')} + + + +