From d940b3324dedb0106c0e912db9e0067a3e5ebabb Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Fri, 13 Oct 2023 16:23:22 +0800 Subject: [PATCH 01/23] Fix proptypes --- src/components/MoneyRequestConfirmationList.js | 3 +++ src/pages/EditSplitBillPage.js | 4 ++-- src/pages/iou/SplitBillDetailsPage.js | 2 +- 3 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index d6fd80057c25..6638cdd5cf1a 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -144,6 +144,9 @@ const propTypes = { /** Whether the money request is a scan request */ isScanRequest: PropTypes.bool, + /** Whether we're editing a split bill */ + isEditingSplitBill: PropTypes.bool, + /** Whether we should show the amount, date, and merchant fields. */ shouldShowSmartScanFields: PropTypes.bool, diff --git a/src/pages/EditSplitBillPage.js b/src/pages/EditSplitBillPage.js index 217b1a100572..d10803cd40ea 100644 --- a/src/pages/EditSplitBillPage.js +++ b/src/pages/EditSplitBillPage.js @@ -37,11 +37,11 @@ const propTypes = { transaction: transactionPropTypes.isRequired, /** The draft transaction that holds data to be persisted on the current transaction */ - draftTransaction: PropTypes.shape(transactionPropTypes), + draftTransaction: transactionPropTypes, }; const defaultProps = { - draftTransaction: {}, + draftTransaction: undefined, }; function EditSplitBillPage({route, transaction, draftTransaction}) { diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index 1b3052e9e72c..552727946ebe 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -40,7 +40,7 @@ const propTypes = { transaction: transactionPropTypes.isRequired, /** The draft transaction that holds data to be persisited on the current transaction */ - draftTransaction: PropTypes.shape(transactionPropTypes), + draftTransaction: transactionPropTypes, /** Route params */ route: PropTypes.shape({ From ce96b01db4b15eacdf21a2c9e24edf0ed2e043f0 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Fri, 13 Oct 2023 21:57:35 +0800 Subject: [PATCH 02/23] Add configurable option to OptionsSelector and make split details scrollable --- .../MoneyRequestConfirmationList.js | 5 ++ .../OptionsSelector/BaseOptionsSelector.js | 74 ++++++++++++------- .../optionsSelectorPropTypes.js | 4 + src/pages/iou/SplitBillDetailsPage.js | 1 + 4 files changed, 57 insertions(+), 27 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 6638cdd5cf1a..e392fc3ee42e 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -150,6 +150,9 @@ const propTypes = { /** Whether we should show the amount, date, and merchant fields. */ shouldShowSmartScanFields: PropTypes.bool, + /** Whether we should show the amount, date, and merchant fields. */ + isScrollable: PropTypes.bool, + /** A flag for verifying that the current report is a sub-report of a workspace chat */ isPolicyExpenseChat: PropTypes.bool, @@ -191,6 +194,7 @@ const defaultProps = { isScanRequest: false, shouldShowSmartScanFields: true, isPolicyExpenseChat: false, + shouldAllowScrollingInputs: false, }; function MoneyRequestConfirmationList(props) { @@ -549,6 +553,7 @@ function MoneyRequestConfirmationList(props) { optionHoveredStyle={canModifyParticipants ? styles.hoveredComponentBG : {}} footerContent={footerContent} listStyles={props.listStyles} + shouldAllowScrollingChildren={props.isScrollable} > {props.isDistanceRequest && ( diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index 3c9d401cdbdb..bb5802b35c1b 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -2,7 +2,7 @@ import _ from 'underscore'; import lodashGet from 'lodash/get'; import React, {Component} from 'react'; import PropTypes from 'prop-types'; -import {View} from 'react-native'; +import {ScrollView, View} from 'react-native'; import Button from '../Button'; import FixedFooter from '../FixedFooter'; import OptionsList from '../OptionsList'; @@ -434,6 +434,24 @@ class BaseOptionsSelector extends Component { shouldPreventDefaultFocusOnSelectRow={this.props.shouldPreventDefaultFocusOnSelectRow} /> ); + + const {shouldAllowScrollingChildren} = this.props; + const ScrollWrapper = function (props) { + if (!shouldAllowScrollingChildren) { + return props.children; + } + return ( + + + {props.children} + + + ); + }; + return ( {} : this.updateFocusedIndex} shouldResetIndexOnEndReached={false} > - - {this.props.shouldTextInputAppearBelowOptions ? ( - <> - {optionsList} - - {this.props.children} - {this.props.shouldShowTextInput && textInput} - - - ) : ( - <> - - {this.props.children} - {this.props.shouldShowTextInput && textInput} - {Boolean(this.props.textInputAlert) && ( - - )} - - {optionsList} - - )} - + + + {this.props.shouldTextInputAppearBelowOptions ? ( + <> + {optionsList} + + {this.props.children} + {this.props.shouldShowTextInput && textInput} + + + ) : ( + <> + + {this.props.children} + {this.props.shouldShowTextInput && textInput} + {Boolean(this.props.textInputAlert) && ( + + )} + + {optionsList} + + )} + + {shouldShowFooter && ( {shouldShowDefaultConfirmButton && ( diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index 9e028510e608..759f34658d0b 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -128,6 +128,9 @@ const propTypes = { /** Whether the text input should intercept swipes or not */ shouldTextInputInterceptSwipe: PropTypes.bool, + + /** Whether we should allow the view wrapping the nested children to be scrollable */ + shouldAllowScrollingChildren: PropTypes.bool, }; const defaultProps = { @@ -165,6 +168,7 @@ const defaultProps = { isRowMultilineSupported: false, initialFocusedIndex: undefined, shouldTextInputInterceptSwipe: false, + shouldAllowScrollingChildren: false, }; export {propTypes, defaultProps}; diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index 552727946ebe..ee4a506dee94 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -141,6 +141,7 @@ function SplitBillDetailsPage(props) { reportID={reportID} reportActionID={reportAction.reportActionID} transactionID={props.transaction.transactionID} + isScrollable onConfirm={onConfirm} /> )} From ae0a3b65e004bb6cb749f7eb7c067f98512e144f Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Fri, 13 Oct 2023 22:46:10 +0800 Subject: [PATCH 03/23] Show receipt scanning message for splits as well --- src/libs/ReportUtils.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index fdfc630cfd33..b0488896a199 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -1525,6 +1525,9 @@ function getReportPreviewMessage(report, reportAction = {}, shouldConsiderReceip if (_.isEmpty(linkedTransaction)) { return reportActionMessage; } + if (TransactionUtils.isReceiptBeingScanned(linkedTransaction)) { + return Localize.translateLocal('iou.receiptScanning'); + } const {amount, currency, comment} = getTransactionDetails(linkedTransaction); const formattedAmount = CurrencyUtils.convertToDisplayString(amount, currency); return Localize.translateLocal('iou.didSplitAmount', {formattedAmount, comment}); From 8cf9b1eaeff387a11324c7e6f42c0563b62f416f Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Fri, 13 Oct 2023 22:46:22 +0800 Subject: [PATCH 04/23] Do not display last message from backend if report has no actions --- src/libs/SidebarUtils.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/libs/SidebarUtils.js b/src/libs/SidebarUtils.js index 7a32db660021..314a1d63760e 100644 --- a/src/libs/SidebarUtils.js +++ b/src/libs/SidebarUtils.js @@ -347,17 +347,17 @@ function getOptionData(report, reportActions, personalDetails, preferredLocale, if ((result.isChatRoom || result.isPolicyExpenseChat || result.isThread || result.isTaskReport) && !result.isArchivedRoom) { const lastAction = visibleReportActionItems[report.reportID]; - if (lodashGet(lastAction, 'actionName', '') === CONST.REPORT.ACTIONS.TYPE.RENAMED) { + if (lastAction && lastAction.actionName === CONST.REPORT.ACTIONS.TYPE.RENAMED) { const newName = lodashGet(lastAction, 'originalMessage.newName', ''); result.alternateText = Localize.translate(preferredLocale, 'newRoomPage.roomRenamedTo', {newName}); - } else if (lodashGet(lastAction, 'actionName', '') === CONST.REPORT.ACTIONS.TYPE.TASKREOPENED) { + } else if (lastAction && lastAction.actionName === CONST.REPORT.ACTIONS.TYPE.TASKREOPENED) { result.alternateText = `${Localize.translate(preferredLocale, 'task.messages.reopened')}`; - } else if (lodashGet(lastAction, 'actionName', '') === CONST.REPORT.ACTIONS.TYPE.TASKCOMPLETED) { + } else if (lastAction && lastAction.actionName === CONST.REPORT.ACTIONS.TYPE.TASKCOMPLETED) { result.alternateText = `${Localize.translate(preferredLocale, 'task.messages.completed')}`; - } else if (lodashGet(lastAction, 'actionName', '') !== CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW && lastActorDisplayName && lastMessageTextFromReport) { + } else if (lastAction && lastAction.actionName !== CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW && lastActorDisplayName && lastMessageTextFromReport) { result.alternateText = `${lastActorDisplayName}: ${lastMessageText}`; } else { - result.alternateText = lastMessageTextFromReport.length > 0 ? lastMessageText : Localize.translate(preferredLocale, 'report.noActivityYet'); + result.alternateText = lastAction && lastMessageTextFromReport.length > 0 ? lastMessageText : Localize.translate(preferredLocale, 'report.noActivityYet'); } } else { if (!lastMessageText) { From e2a5657fd02361c1f1d0df9293d62b4b06ceb6ce Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Fri, 13 Oct 2023 23:00:03 +0800 Subject: [PATCH 05/23] Only make BaseOptionsSelector scrollable when inputs are below the options --- .../OptionsSelector/BaseOptionsSelector.js | 62 +++++++++---------- 1 file changed, 30 insertions(+), 32 deletions(-) diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index bb5802b35c1b..0cab6122bb1b 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -436,9 +436,9 @@ class BaseOptionsSelector extends Component { ); const {shouldAllowScrollingChildren} = this.props; - const ScrollWrapper = function (props) { + function ScrollWrapper({children}) { if (!shouldAllowScrollingChildren) { - return props.children; + return children; } return ( @@ -446,11 +446,11 @@ class BaseOptionsSelector extends Component { horizontal contentContainerStyle={[styles.flex1, styles.flexColumn]} > - {props.children} + {children} ); - }; + } return ( {} : this.updateFocusedIndex} shouldResetIndexOnEndReached={false} > - - - {this.props.shouldTextInputAppearBelowOptions ? ( - <> - {optionsList} - - {this.props.children} - {this.props.shouldShowTextInput && textInput} - - - ) : ( - <> - - {this.props.children} - {this.props.shouldShowTextInput && textInput} - {Boolean(this.props.textInputAlert) && ( - - )} - - {optionsList} - - )} - - + + {this.props.shouldTextInputAppearBelowOptions ? ( + + {optionsList} + + {this.props.children} + {this.props.shouldShowTextInput && textInput} + + + ) : ( + <> + + {this.props.children} + {this.props.shouldShowTextInput && textInput} + {Boolean(this.props.textInputAlert) && ( + + )} + + {optionsList} + + )} + {shouldShowFooter && ( {shouldShowDefaultConfirmButton && ( From 1127b20593de68f2876b5ade0200635db2bcc024 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sat, 14 Oct 2023 00:33:04 +0800 Subject: [PATCH 06/23] Fix proptype name --- src/components/OptionsSelector/optionsSelectorPropTypes.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index 759f34658d0b..f69b8b115dc6 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -130,7 +130,7 @@ const propTypes = { shouldTextInputInterceptSwipe: PropTypes.bool, /** Whether we should allow the view wrapping the nested children to be scrollable */ - shouldAllowScrollingChildren: PropTypes.bool, + isScrollable: PropTypes.bool, }; const defaultProps = { From c35cbc660bf738d803e7fc8b2e4637738bda5c9d Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sat, 14 Oct 2023 02:50:19 +0800 Subject: [PATCH 07/23] Address comments --- .../MoneyRequestConfirmationList.js | 6 +- .../OptionsSelector/BaseOptionsSelector.js | 40 ++++---- .../optionsSelectorPropTypes.js | 2 +- src/pages/iou/SplitBillDetailsPage.js | 1 - .../iou/steps/MoneyRequestConfirmPage.js | 91 +++++++++---------- 5 files changed, 66 insertions(+), 74 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 4db40f78cd83..863ecd0022ad 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -156,9 +156,6 @@ const propTypes = { /** Whether we should show the amount, date, and merchant fields. */ shouldShowSmartScanFields: PropTypes.bool, - /** Whether we should show the amount, date, and merchant fields. */ - isScrollable: PropTypes.bool, - /** A flag for verifying that the current report is a sub-report of a workspace chat */ isPolicyExpenseChat: PropTypes.bool, @@ -202,7 +199,6 @@ const defaultProps = { isScanRequest: false, shouldShowSmartScanFields: true, isPolicyExpenseChat: false, - shouldAllowScrollingInputs: false, }; function MoneyRequestConfirmationList(props) { @@ -561,7 +557,7 @@ function MoneyRequestConfirmationList(props) { optionHoveredStyle={canModifyParticipants ? styles.hoveredComponentBG : {}} footerContent={footerContent} listStyles={props.listStyles} - shouldAllowScrollingChildren={props.isScrollable} + shouldAllowScrollingChildren > {props.isDistanceRequest && ( diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index 0cab6122bb1b..2ad901ded520 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -46,6 +46,27 @@ const defaultProps = { ...optionsSelectorDefaultProps, }; +/* + * The OptionsList component uses a SectionList which uses a VirtualizedList internally. + * VirtualizedList cannot be directly nested within ScrollViews of the same orientation. + * To work around this, we wrap the MoneyRequestConfirmationList component with a horizontal ScrollView. + */ +function ScrollWrapper(props) { + if (!props.shouldAllowScrollingChildren) { + return props.children; + } + return ( + + + {props.children} + + + ); +} + class BaseOptionsSelector extends Component { constructor(props) { super(props); @@ -435,23 +456,6 @@ class BaseOptionsSelector extends Component { /> ); - const {shouldAllowScrollingChildren} = this.props; - function ScrollWrapper({children}) { - if (!shouldAllowScrollingChildren) { - return children; - } - return ( - - - {children} - - - ); - } - return ( {this.props.shouldTextInputAppearBelowOptions ? ( - + {optionsList} {this.props.children} diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index f69b8b115dc6..759f34658d0b 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -130,7 +130,7 @@ const propTypes = { shouldTextInputInterceptSwipe: PropTypes.bool, /** Whether we should allow the view wrapping the nested children to be scrollable */ - isScrollable: PropTypes.bool, + shouldAllowScrollingChildren: PropTypes.bool, }; const defaultProps = { diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index ee4a506dee94..552727946ebe 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -141,7 +141,6 @@ function SplitBillDetailsPage(props) { reportID={reportID} reportActionID={reportAction.reportActionID} transactionID={props.transaction.transactionID} - isScrollable onConfirm={onConfirm} /> )} diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index ea7d477717f7..7977f606218c 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -337,55 +337,48 @@ function MoneyRequestConfirmPage(props) { * VirtualizedList cannot be directly nested within ScrollViews of the same orientation. * To work around this, we wrap the MoneyRequestConfirmationList component with a horizontal ScrollView. */} - - - { - const newParticipants = _.map(props.iou.participants, (participant) => { - if (participant.accountID === option.accountID) { - return {...participant, selected: !participant.selected}; - } - return participant; - }); - IOU.setMoneyRequestParticipants(newParticipants); - }} - receiptPath={props.iou.receiptPath} - receiptFilename={props.iou.receiptFilename} - iouType={iouType.current} - reportID={reportID.current} - isPolicyExpenseChat={isPolicyExpenseChat} - // The participants can only be modified when the action is initiated from directly within a group chat and not the floating-action-button. - // This is because when there is a group of people, say they are on a trip, and you have some shared expenses with some of the people, - // but not all of them (maybe someone skipped out on dinner). Then it's nice to be able to select/deselect people from the group chat bill - // split rather than forcing the user to create a new group, just for that expense. The reportID is empty, when the action was initiated from - // the floating-action-button (since it is something that exists outside the context of a report). - canModifyParticipants={!_.isEmpty(reportID.current)} - policyID={props.report.policyID} - bankAccountRoute={ReportUtils.getBankAccountRoute(props.report)} - iouMerchant={props.iou.merchant} - iouCreated={props.iou.created} - isScanRequest={isScanRequest} - isDistanceRequest={isDistanceRequest} - listStyles={[StyleUtils.getMaximumHeight(windowHeight / 3)]} - shouldShowSmartScanFields={_.isEmpty(props.iou.receiptPath)} - /> - - + { + const newParticipants = _.map(props.iou.participants, (participant) => { + if (participant.accountID === option.accountID) { + return {...participant, selected: !participant.selected}; + } + return participant; + }); + IOU.setMoneyRequestParticipants(newParticipants); + }} + receiptPath={props.iou.receiptPath} + receiptFilename={props.iou.receiptFilename} + iouType={iouType.current} + reportID={reportID.current} + isPolicyExpenseChat={isPolicyExpenseChat} + // The participants can only be modified when the action is initiated from directly within a group chat and not the floating-action-button. + // This is because when there is a group of people, say they are on a trip, and you have some shared expenses with some of the people, + // but not all of them (maybe someone skipped out on dinner). Then it's nice to be able to select/deselect people from the group chat bill + // split rather than forcing the user to create a new group, just for that expense. The reportID is empty, when the action was initiated from + // the floating-action-button (since it is something that exists outside the context of a report). + canModifyParticipants={!_.isEmpty(reportID.current)} + policyID={props.report.policyID} + bankAccountRoute={ReportUtils.getBankAccountRoute(props.report)} + iouMerchant={props.iou.merchant} + iouCreated={props.iou.created} + isScanRequest={isScanRequest} + isDistanceRequest={isDistanceRequest} + listStyles={[StyleUtils.getMaximumHeight(windowHeight / 3)]} + shouldShowSmartScanFields={_.isEmpty(props.iou.receiptPath)} + /> )} From 4983055bcfaaabf9c2315ecaf846b18b7a0ac638 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sat, 14 Oct 2023 15:19:29 +0800 Subject: [PATCH 08/23] Add partial merchant when creating transaction --- src/libs/actions/IOU.js | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index 7f5f6d74ed67..9aac516267d1 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -1303,7 +1303,18 @@ function startSplitBill(participants, currentUserLogin, currentUserAccountID, co const receiptObject = {state, source}; // ReportID is -2 (aka "deleted") on the group transaction - const splitTransaction = TransactionUtils.buildOptimisticTransaction(0, CONST.CURRENCY.USD, CONST.REPORT.SPLIT_REPORTID, comment, '', '', '', '', receiptObject, filename); + const splitTransaction = TransactionUtils.buildOptimisticTransaction( + 0, + CONST.CURRENCY.USD, + CONST.REPORT.SPLIT_REPORTID, + comment, + '', + '', + '', + CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT, + receiptObject, + filename, + ); // Note: The created action must be optimistically generated before the IOU action so there's no chance that the created action appears after the IOU action in the chat const splitChatCreatedReportAction = ReportUtils.buildOptimisticCreatedReportAction(currentUserEmailForIOUSplit); From e622ab6e0c92343ba847a82fa5039c79ae3b317f Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sat, 14 Oct 2023 15:20:47 +0800 Subject: [PATCH 09/23] CLeanup checking for missing fields --- .../MoneyRequestConfirmationList.js | 20 ++++++------------- src/libs/TransactionUtils.ts | 20 +++++++++++++++---- 2 files changed, 22 insertions(+), 18 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 863ecd0022ad..42fa1db48220 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -593,8 +593,8 @@ function MoneyRequestConfirmationList(props) { style={[styles.moneyRequestMenuItem, styles.mt2]} titleStyle={styles.moneyRequestConfirmationAmount} disabled={didConfirm} - brickRoadIndicator={shouldDisplayFieldError && !transaction.modifiedAmount ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''} - error={shouldDisplayFieldError && !transaction.modifiedAmount ? translate('common.error.enterAmount') : ''} + brickRoadIndicator={shouldDisplayFieldError && TransactionUtils.isAmountMissing(transaction) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''} + error={shouldDisplayFieldError && TransactionUtils.isAmountMissing(transaction) ? translate('common.error.enterAmount') : ''} /> )} )} {props.isDistanceRequest && ( @@ -680,16 +680,8 @@ function MoneyRequestConfirmationList(props) { }} disabled={didConfirm} interactive={!props.isReadOnly} - brickRoadIndicator={ - shouldDisplayFieldError && (transaction.modifiedMerchant === '' || transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT) - ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR - : '' - } - error={ - shouldDisplayFieldError && (transaction.modifiedMerchant === '' || transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT) - ? translate('common.error.enterMerchant') - : '' - } + brickRoadIndicator={shouldDisplayFieldError && TransactionUtils.isMerchantMissing(transaction) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''} + error={shouldDisplayFieldError && TransactionUtils.isMerchantMissing(transaction) ? translate('common.error.enterMerchant') : ''} /> )} {shouldShowCategories && ( diff --git a/src/libs/TransactionUtils.ts b/src/libs/TransactionUtils.ts index 43b1c2f39902..d0a000704b35 100644 --- a/src/libs/TransactionUtils.ts +++ b/src/libs/TransactionUtils.ts @@ -80,7 +80,7 @@ function hasReceipt(transaction: Transaction | undefined | null): boolean { return !!transaction?.receipt?.state; } -function areRequiredFieldsEmpty(transaction: Transaction): boolean { +function isMerchantMissing(transaction: Transaction) { const isMerchantEmpty = transaction.merchant === CONST.TRANSACTION.UNKNOWN_MERCHANT || transaction.merchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT || transaction.merchant === ''; @@ -90,10 +90,19 @@ function areRequiredFieldsEmpty(transaction: Transaction): boolean { transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT || transaction.modifiedMerchant === ''; - const isModifiedAmountEmpty = !transaction.modifiedAmount || transaction.modifiedAmount === 0; - const isModifiedCreatedEmpty = !transaction.modifiedCreated || transaction.modifiedCreated === ''; + return isMerchantEmpty && isModifiedMerchantEmpty; +} + +function isAmountMissing(transaction: Transaction) { + return transaction.amount === 0 && (!transaction.modifiedAmount || transaction.modifiedAmount === 0); +} - return (isModifiedMerchantEmpty && isMerchantEmpty) || (isModifiedAmountEmpty && transaction.amount === 0) || (isModifiedCreatedEmpty && transaction.created === ''); +function isCreatedMissing(transaction: Transaction) { + return transaction.created === '' && (!transaction.created || transaction.modifiedCreated === ''); +} + +function areRequiredFieldsEmpty(transaction: Transaction): boolean { + return isMerchantMissing(transaction) || isAmountMissing(transaction) || isCreatedMissing(transaction); } /** @@ -446,6 +455,9 @@ export { isPending, isPosted, getWaypoints, + isAmountMissing, + isMerchantMissing, + isCreatedMissing, areRequiredFieldsEmpty, hasMissingSmartscanFields, getWaypointIndex, From d52729dd811acb0faaf5aba591d1d94c668f2cd6 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sat, 14 Oct 2023 15:21:03 +0800 Subject: [PATCH 10/23] Remove extra component --- .../OptionsSelector/BaseOptionsSelector.js | 59 +++++++++---------- .../iou/steps/MoneyRequestConfirmPage.js | 7 +-- 2 files changed, 30 insertions(+), 36 deletions(-) diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index 2ad901ded520..63e2a396117c 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -46,27 +46,6 @@ const defaultProps = { ...optionsSelectorDefaultProps, }; -/* - * The OptionsList component uses a SectionList which uses a VirtualizedList internally. - * VirtualizedList cannot be directly nested within ScrollViews of the same orientation. - * To work around this, we wrap the MoneyRequestConfirmationList component with a horizontal ScrollView. - */ -function ScrollWrapper(props) { - if (!props.shouldAllowScrollingChildren) { - return props.children; - } - return ( - - - {props.children} - - - ); -} - class BaseOptionsSelector extends Component { constructor(props) { super(props); @@ -456,6 +435,16 @@ class BaseOptionsSelector extends Component { /> ); + const optionsAndInputsBelowThem = ( + <> + {optionsList} + + {this.props.children} + {this.props.shouldShowTextInput && textInput} + + + ); + return ( - {this.props.shouldTextInputAppearBelowOptions ? ( - - {optionsList} - - {this.props.children} - {this.props.shouldShowTextInput && textInput} - - - ) : ( + {/* + * The OptionsList component uses a SectionList which uses a VirtualizedList internally. + * VirtualizedList cannot be directly nested within ScrollViews of the same orientation. + * To work around this, we wrap the OptionsList component with a horizontal ScrollView. + */} + {this.props.shouldTextInputAppearBelowOptions && this.props.shouldAllowScrollingChildren && ( + + + {optionsAndInputsBelowThem} + + + )} + + {this.props.shouldTextInputAppearBelowOptions && !this.props.shouldAllowScrollingChildren && optionsAndInputsBelowThem} + + {!this.props.shouldTextInputAppearBelowOptions && ( <> {this.props.children} diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index 7977f606218c..e2e3dc72bed4 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -1,5 +1,5 @@ import React, {useCallback, useEffect, useMemo, useRef} from 'react'; -import {ScrollView, View} from 'react-native'; +import {View} from 'react-native'; import PropTypes from 'prop-types'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; @@ -332,11 +332,6 @@ function MoneyRequestConfirmPage(props) { }, ]} /> - {/* - * The MoneyRequestConfirmationList component uses a SectionList which uses a VirtualizedList internally. - * VirtualizedList cannot be directly nested within ScrollViews of the same orientation. - * To work around this, we wrap the MoneyRequestConfirmationList component with a horizontal ScrollView. - */} Date: Sun, 15 Oct 2023 04:22:16 +0800 Subject: [PATCH 11/23] Make isEditingSplitBill depend on only the fields being empty --- src/pages/iou/SplitBillDetailsPage.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index 552727946ebe..ab8827d25715 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -90,10 +90,9 @@ function SplitBillDetailsPage(props) { const payeePersonalDetails = props.personalDetails[reportAction.actorAccountID]; const participantsExcludingPayee = _.filter(participants, (participant) => participant.accountID !== reportAction.actorAccountID); - const isScanning = - TransactionUtils.hasReceipt(props.transaction) && TransactionUtils.isReceiptBeingScanned(props.transaction) && TransactionUtils.areRequiredFieldsEmpty(props.transaction); + const isScanning = TransactionUtils.hasReceipt(props.transaction) && TransactionUtils.isReceiptBeingScanned(props.transaction); const hasSmartScanFailed = TransactionUtils.hasReceipt(props.transaction) && props.transaction.receipt.state === CONST.IOU.RECEIPT_STATE.SCANFAILED; - const isEditingSplitBill = props.session.accountID === reportAction.actorAccountID && (TransactionUtils.areRequiredFieldsEmpty(props.transaction) || hasSmartScanFailed); + const isEditingSplitBill = props.session.accountID === reportAction.actorAccountID && TransactionUtils.areRequiredFieldsEmpty(props.transaction); const { amount: splitAmount, @@ -135,7 +134,6 @@ function SplitBillDetailsPage(props) { receiptPath={props.transaction.receipt && props.transaction.receipt.source} receiptFilename={props.transaction.filename} shouldShowFooter={false} - isScanning={isScanning} isEditingSplitBill={isEditingSplitBill} hasSmartScanFailed={hasSmartScanFailed} reportID={reportID} From fc1e3ff36f52a2cea32a66ab788b1d7a19a489f6 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sun, 15 Oct 2023 04:38:14 +0800 Subject: [PATCH 12/23] Fix missing money request status details --- src/pages/iou/SplitBillDetailsPage.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index ab8827d25715..640831d4b337 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -15,6 +15,7 @@ import reportActionPropTypes from '../home/report/reportActionPropTypes'; import reportPropTypes from '../reportPropTypes'; import transactionPropTypes from '../../components/transactionPropTypes'; import withReportAndReportActionOrNotFound from '../home/report/withReportAndReportActionOrNotFound'; +import useLocalize from '../../hooks/useLocalize'; import * as TransactionUtils from '../../libs/TransactionUtils'; import * as ReportUtils from '../../libs/ReportUtils'; import * as IOU from '../../libs/actions/IOU'; @@ -72,6 +73,7 @@ const defaultProps = { }; function SplitBillDetailsPage(props) { + const {translate} = useLocalize(); const {reportID} = props.report; const reportAction = props.reportActions[`${props.route.params.reportActionID.toString()}`]; const participantAccountIDs = reportAction.originalMessage.participantAccountIDs; @@ -116,7 +118,13 @@ function SplitBillDetailsPage(props) { pointerEvents="box-none" style={[styles.containerWithSpaceBetween]} > - {isScanning && } + {isScanning && ( + + )} {Boolean(participants.length) && ( Date: Sun, 15 Oct 2023 21:04:54 +0800 Subject: [PATCH 13/23] Disable nested scroll on OptionsList used in MoneyRequestConfirmationList --- src/components/MoneyRequestConfirmationList.js | 1 + src/components/OptionsList/BaseOptionsList.js | 3 ++- src/components/OptionsList/optionsListPropTypes.js | 4 ++++ src/components/OptionsSelector/BaseOptionsSelector.js | 1 + src/components/OptionsSelector/optionsSelectorPropTypes.js | 4 ++++ 5 files changed, 12 insertions(+), 1 deletion(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 42fa1db48220..ca0af7248b35 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -558,6 +558,7 @@ function MoneyRequestConfirmationList(props) { footerContent={footerContent} listStyles={props.listStyles} shouldAllowScrollingChildren + nestedScrollEnabled={false} > {props.isDistanceRequest && ( diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index edea0b8d1aba..81a96a3ecb51 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -67,6 +67,7 @@ function BaseOptionsList({ innerRef, isRowMultilineSupported, isLoadingNewOptions, + nestedScrollEnabled, }) { const flattenedData = useRef(); const previousSections = usePrevious(sections); @@ -255,7 +256,7 @@ function BaseOptionsList({ ) : null} ); diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index 759f34658d0b..bfef8ca3a925 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -131,6 +131,9 @@ const propTypes = { /** Whether we should allow the view wrapping the nested children to be scrollable */ shouldAllowScrollingChildren: PropTypes.bool, + + /** Whether nested scroll of options is enabled, true by default */ + nestedScrollEnabled: PropTypes.bool, }; const defaultProps = { @@ -169,6 +172,7 @@ const defaultProps = { initialFocusedIndex: undefined, shouldTextInputInterceptSwipe: false, shouldAllowScrollingChildren: false, + nestedScrollEnabled: true, }; export {propTypes, defaultProps}; From 072c6331da94cf184dd4816d8406e30799a40df5 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sun, 15 Oct 2023 21:07:06 +0800 Subject: [PATCH 14/23] tidy up --- src/components/OptionsList/BaseOptionsList.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index 81a96a3ecb51..1da16001ccb6 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -256,11 +256,11 @@ function BaseOptionsList({ ) : null} Date: Sun, 15 Oct 2023 21:24:27 +0800 Subject: [PATCH 15/23] Use scrollViewEnabled as well to disable scroll on iOS --- src/components/OptionsList/BaseOptionsList.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index 1da16001ccb6..e29fae8cf6c3 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -261,6 +261,7 @@ function BaseOptionsList({ keyboardShouldPersistTaps="always" keyboardDismissMode={keyboardDismissMode} nestedScrollEnabled={nestedScrollEnabled} + scrollEnabled={nestedScrollEnabled} onScrollBeginDrag={onScrollBeginDrag} onScroll={onScroll} contentContainerStyle={contentContainerStyles} From 984e5e8d84ebd43b24cc6f7c1d394b5136829217 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sun, 15 Oct 2023 21:39:07 +0800 Subject: [PATCH 16/23] Fix error translation key --- src/libs/actions/IOU.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index e87eb5595b35..902faa764182 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -1418,7 +1418,7 @@ function startSplitBill(participants, currentUserLogin, currentUserAccountID, co key: `${ONYXKEYS.COLLECTION.REPORT}${splitChatReport.reportID}`, value: { errorFields: { - createChat: ErrorUtils.getMicroSecondOnyxError('report.genericCreateReportFailureMessage'), + createChat: ErrorUtils.getMicroSecondOnyxError('report.error.genericCreateReportFailureMessage'), }, }, }, From 630cfd348f2fdb80448a7ffbce5081332a54cb39 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Sun, 15 Oct 2023 21:42:59 +0800 Subject: [PATCH 17/23] Translation fix --- src/libs/actions/IOU.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index 902faa764182..4c1f24698655 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -1418,7 +1418,7 @@ function startSplitBill(participants, currentUserLogin, currentUserAccountID, co key: `${ONYXKEYS.COLLECTION.REPORT}${splitChatReport.reportID}`, value: { errorFields: { - createChat: ErrorUtils.getMicroSecondOnyxError('report.error.genericCreateReportFailureMessage'), + createChat: ErrorUtils.getMicroSecondOnyxError('report.genericCreateReportFailureMessage'), }, }, }, @@ -1430,7 +1430,7 @@ function startSplitBill(participants, currentUserLogin, currentUserAccountID, co errors: ErrorUtils.getMicroSecondOnyxError('report.genericCreateReportFailureMessage'), }, [splitIOUReportAction.reportActionID]: { - errors: ErrorUtils.getMicroSecondOnyxError('report.genericCreateFailureMessage'), + errors: ErrorUtils.getMicroSecondOnyxError('iou.error.genericCreateFailureMessage'), }, }, }, From cbfa239dbeab3fb8f72b42c67da0a0941436581b Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 04:21:51 +0800 Subject: [PATCH 18/23] Allow options to expand to full height --- src/components/MoneyRequestConfirmationList.js | 1 - src/pages/iou/steps/MoneyRequestConfirmPage.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index ca0af7248b35..42fa1db48220 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -558,7 +558,6 @@ function MoneyRequestConfirmationList(props) { footerContent={footerContent} listStyles={props.listStyles} shouldAllowScrollingChildren - nestedScrollEnabled={false} > {props.isDistanceRequest && ( diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index e2e3dc72bed4..14c99247c2cf 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -371,7 +371,6 @@ function MoneyRequestConfirmPage(props) { iouCreated={props.iou.created} isScanRequest={isScanRequest} isDistanceRequest={isDistanceRequest} - listStyles={[StyleUtils.getMaximumHeight(windowHeight / 3)]} shouldShowSmartScanFields={_.isEmpty(props.iou.receiptPath)} /> From 2a406ca19f750fbed8185b6c458fd2b694c48504 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 05:06:36 +0800 Subject: [PATCH 19/23] Disable bounce effect on money request options to fix scroll issues --- src/components/MoneyRequestConfirmationList.js | 1 + src/components/OptionsList/BaseOptionsList.js | 2 ++ src/components/OptionsList/optionsListPropTypes.js | 4 ++++ src/components/OptionsSelector/BaseOptionsSelector.js | 2 ++ src/components/OptionsSelector/optionsSelectorPropTypes.js | 4 ++++ 5 files changed, 13 insertions(+) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 42fa1db48220..cdb5f8df8317 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -558,6 +558,7 @@ function MoneyRequestConfirmationList(props) { footerContent={footerContent} listStyles={props.listStyles} shouldAllowScrollingChildren + bounces={false} > {props.isDistanceRequest && ( diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index e29fae8cf6c3..91fd77dbea30 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -68,6 +68,7 @@ function BaseOptionsList({ isRowMultilineSupported, isLoadingNewOptions, nestedScrollEnabled, + bounces, }) { const flattenedData = useRef(); const previousSections = usePrevious(sections); @@ -278,6 +279,7 @@ function BaseOptionsList({ windowSize={5} viewabilityConfig={{viewAreaCoveragePercentThreshold: 95}} onViewableItemsChanged={onViewableItemsChanged} + bounces={bounces} /> )} diff --git a/src/components/OptionsList/optionsListPropTypes.js b/src/components/OptionsList/optionsListPropTypes.js index 7be1cdd6efdf..caabf39a41bb 100644 --- a/src/components/OptionsList/optionsListPropTypes.js +++ b/src/components/OptionsList/optionsListPropTypes.js @@ -93,6 +93,9 @@ const propTypes = { /** Whether nested scroll of options is enabled, true by default */ nestedScrollEnabled: PropTypes.bool, + + /** Whether the list should have a bounce effect on iOS */ + bounces: PropTypes.bool, }; const defaultProps = { @@ -121,6 +124,7 @@ const defaultProps = { isRowMultilineSupported: false, isLoadingNewOptions: false, nestedScrollEnabled: true, + bounces: true, }; export {propTypes, defaultProps}; diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index 4b10dbe77c77..73cb60e15eda 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -433,6 +433,7 @@ class BaseOptionsSelector extends Component { isLoadingNewOptions={this.props.isLoadingNewOptions} shouldPreventDefaultFocusOnSelectRow={this.props.shouldPreventDefaultFocusOnSelectRow} nestedScrollEnabled={this.props.nestedScrollEnabled} + bounces={this.props.bounces} /> ); @@ -464,6 +465,7 @@ class BaseOptionsSelector extends Component { {optionsAndInputsBelowThem} diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index bfef8ca3a925..67891f40858c 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -134,6 +134,9 @@ const propTypes = { /** Whether nested scroll of options is enabled, true by default */ nestedScrollEnabled: PropTypes.bool, + + /** Whether the list should have a bounce effect on iOS */ + bounces: PropTypes.bool, }; const defaultProps = { @@ -173,6 +176,7 @@ const defaultProps = { shouldTextInputInterceptSwipe: false, shouldAllowScrollingChildren: false, nestedScrollEnabled: true, + bounces: true, }; export {propTypes, defaultProps}; From 43d8dcba9474a6d21c6314c4f789f2c1d1178f25 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 05:07:46 +0800 Subject: [PATCH 20/23] Fix lint --- src/pages/iou/steps/MoneyRequestConfirmPage.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index 14c99247c2cf..2d2fe5cb15fb 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -24,8 +24,6 @@ import personalDetailsPropType from '../../personalDetailsPropType'; import * as FileUtils from '../../../libs/fileDownload/FileUtils'; import * as Policy from '../../../libs/actions/Policy'; import useNetwork from '../../../hooks/useNetwork'; -import useWindowDimensions from '../../../hooks/useWindowDimensions'; -import * as StyleUtils from '../../../styles/StyleUtils'; import {iouPropTypes, iouDefaultProps} from '../propTypes'; import * as Expensicons from '../../../components/Icon/Expensicons'; @@ -62,7 +60,6 @@ const defaultProps = { function MoneyRequestConfirmPage(props) { const {isOffline} = useNetwork(); - const {windowHeight, windowWidth} = useWindowDimensions(); const prevMoneyRequestId = useRef(props.iou.id); const iouType = useRef(lodashGet(props.route, 'params.iouType', '')); const isDistanceRequest = MoneyRequestUtils.isDistanceRequest(iouType.current, props.selectedTab); From 6f47cf80f3bdb78e097dcbb24744c482ad7b4471 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 05:13:12 +0800 Subject: [PATCH 21/23] Another lint fix --- src/pages/iou/steps/MoneyRequestConfirmPage.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index 2d2fe5cb15fb..46367e275af4 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -24,6 +24,7 @@ import personalDetailsPropType from '../../personalDetailsPropType'; import * as FileUtils from '../../../libs/fileDownload/FileUtils'; import * as Policy from '../../../libs/actions/Policy'; import useNetwork from '../../../hooks/useNetwork'; +import useWindowDimensions from '../../../hooks/useWindowDimensions'; import {iouPropTypes, iouDefaultProps} from '../propTypes'; import * as Expensicons from '../../../components/Icon/Expensicons'; @@ -60,6 +61,7 @@ const defaultProps = { function MoneyRequestConfirmPage(props) { const {isOffline} = useNetwork(); + const {windowWidth} = useWindowDimensions(); const prevMoneyRequestId = useRef(props.iou.id); const iouType = useRef(lodashGet(props.route, 'params.iouType', '')); const isDistanceRequest = MoneyRequestUtils.isDistanceRequest(iouType.current, props.selectedTab); From 18769cf6e31dc0908bad9cc74fccdd48306206dd Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 05:21:21 +0800 Subject: [PATCH 22/23] Remove redundant prop --- src/components/OptionsSelector/BaseOptionsSelector.js | 2 +- src/components/OptionsSelector/optionsSelectorPropTypes.js | 4 ---- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js index 73cb60e15eda..4ffddd700359 100755 --- a/src/components/OptionsSelector/BaseOptionsSelector.js +++ b/src/components/OptionsSelector/BaseOptionsSelector.js @@ -433,7 +433,7 @@ class BaseOptionsSelector extends Component { isLoadingNewOptions={this.props.isLoadingNewOptions} shouldPreventDefaultFocusOnSelectRow={this.props.shouldPreventDefaultFocusOnSelectRow} nestedScrollEnabled={this.props.nestedScrollEnabled} - bounces={this.props.bounces} + bounces={!this.props.shouldTextInputAppearBelowOptions || !this.props.shouldAllowScrollingChildren} /> ); diff --git a/src/components/OptionsSelector/optionsSelectorPropTypes.js b/src/components/OptionsSelector/optionsSelectorPropTypes.js index 67891f40858c..bfef8ca3a925 100644 --- a/src/components/OptionsSelector/optionsSelectorPropTypes.js +++ b/src/components/OptionsSelector/optionsSelectorPropTypes.js @@ -134,9 +134,6 @@ const propTypes = { /** Whether nested scroll of options is enabled, true by default */ nestedScrollEnabled: PropTypes.bool, - - /** Whether the list should have a bounce effect on iOS */ - bounces: PropTypes.bool, }; const defaultProps = { @@ -176,7 +173,6 @@ const defaultProps = { shouldTextInputInterceptSwipe: false, shouldAllowScrollingChildren: false, nestedScrollEnabled: true, - bounces: true, }; export {propTypes, defaultProps}; From 71064ed378342bd66f83f40b4e23fbd7acd86660 Mon Sep 17 00:00:00 2001 From: Youssef Lourayad Date: Mon, 16 Oct 2023 15:57:15 +0800 Subject: [PATCH 23/23] Update src/components/MoneyRequestConfirmationList.js Co-authored-by: Situ Chandra Shil <108292595+situchan@users.noreply.github.com> --- src/components/MoneyRequestConfirmationList.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index cdb5f8df8317..42fa1db48220 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -558,7 +558,6 @@ function MoneyRequestConfirmationList(props) { footerContent={footerContent} listStyles={props.listStyles} shouldAllowScrollingChildren - bounces={false} > {props.isDistanceRequest && (