diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index b122ab19f70e..586d98934291 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -139,7 +139,7 @@ class MoneyRequestConfirmationList extends Component { * @returns {Array} */ getParticipantsWithAmount(participants) { - const iouAmount = IOUUtils.calculateAmount(participants, this.props.iouAmount); + const iouAmount = IOUUtils.calculateAmount(participants.length, this.props.iouAmount); return OptionsListUtils.getIOUConfirmationOptionsFromParticipants(participants, CurrencyUtils.convertToDisplayString(iouAmount, this.props.iou.selectedCurrencyCode)); } @@ -168,7 +168,7 @@ class MoneyRequestConfirmationList extends Component { const formattedUnselectedParticipants = this.getParticipantsWithoutAmount(unselectedParticipants); const formattedParticipants = _.union(formattedSelectedParticipants, formattedUnselectedParticipants); - const myIOUAmount = IOUUtils.calculateAmount(selectedParticipants, this.props.iouAmount, true); + const myIOUAmount = IOUUtils.calculateAmount(selectedParticipants.length, this.props.iouAmount, true); const formattedMyPersonalDetails = OptionsListUtils.getIOUConfirmationOptionsFromMyPersonalDetail( this.props.currentUserPersonalDetails, CurrencyUtils.convertToDisplayString(myIOUAmount, this.props.iou.selectedCurrencyCode), diff --git a/src/components/Pressable/GenericPressable/BaseGenericPressable.js b/src/components/Pressable/GenericPressable/BaseGenericPressable.js index 80664f2d3521..50c933823e63 100644 --- a/src/components/Pressable/GenericPressable/BaseGenericPressable.js +++ b/src/components/Pressable/GenericPressable/BaseGenericPressable.js @@ -63,45 +63,54 @@ const GenericPressable = forwardRef((props, ref) => { return props.disabled || shouldBeDisabledByScreenReader; }, [isScreenReaderActive, enableInScreenReaderStates, props.disabled]); - const onLongPressHandler = useCallback((event) => { - if (isDisabled) { - return; - } - if (!onLongPress) { - return; - } - if (shouldUseHapticsOnLongPress) { - HapticFeedback.longPress(); - } - if (ref && ref.current) { - ref.current.blur(); - } - onLongPress(event); - - Accessibility.moveAccessibilityFocus(nextFocusRef); - }, [shouldUseHapticsOnLongPress, onLongPress, nextFocusRef, ref, isDisabled]); - - const onPressHandler = useCallback((event) => { - if (isDisabled) { - return; - } - if (shouldUseHapticsOnPress) { - HapticFeedback.press(); - } - if (ref && ref.current) { - ref.current.blur(); - } - onPress(event); + const onLongPressHandler = useCallback( + (event) => { + if (isDisabled) { + return; + } + if (!onLongPress) { + return; + } + if (shouldUseHapticsOnLongPress) { + HapticFeedback.longPress(); + } + if (ref && ref.current) { + ref.current.blur(); + } + onLongPress(event); + + Accessibility.moveAccessibilityFocus(nextFocusRef); + }, + [shouldUseHapticsOnLongPress, onLongPress, nextFocusRef, ref, isDisabled], + ); - Accessibility.moveAccessibilityFocus(nextFocusRef); - }, [shouldUseHapticsOnPress, onPress, nextFocusRef, ref, isDisabled]); + const onPressHandler = useCallback( + (event) => { + if (isDisabled) { + return; + } + if (shouldUseHapticsOnPress) { + HapticFeedback.press(); + } + if (ref && ref.current) { + ref.current.blur(); + } + onPress(event); + + Accessibility.moveAccessibilityFocus(nextFocusRef); + }, + [shouldUseHapticsOnPress, onPress, nextFocusRef, ref, isDisabled], + ); - const onKeyPressHandler = useCallback((event) => { - if (event.key !== 'Enter') { - return; - } - onPressHandler(event); - }, [onPressHandler]); + const onKeyPressHandler = useCallback( + (event) => { + if (event.key !== 'Enter') { + return; + } + onPressHandler(event); + }, + [onPressHandler], + ); useEffect(() => { if (!keyboardShortcut) { diff --git a/src/components/ReportActionItem/IOUPreview.js b/src/components/ReportActionItem/IOUPreview.js index 65cc6ed4929f..ca371e403f3c 100644 --- a/src/components/ReportActionItem/IOUPreview.js +++ b/src/components/ReportActionItem/IOUPreview.js @@ -25,6 +25,7 @@ import reportActionPropTypes from '../../pages/home/report/reportActionPropTypes import {showContextMenuForReport} from '../ShowContextMenuContext'; import * as OptionsListUtils from '../../libs/OptionsListUtils'; import * as CurrencyUtils from '../../libs/CurrencyUtils'; +import * as IOUUtils from '../../libs/IOUUtils'; import * as ReportUtils from '../../libs/ReportUtils'; const propTypes = { @@ -225,11 +226,21 @@ const IOUPreview = (props) => { )} - {!isCurrentUserManager && props.shouldShowPendingConversionMessage && ( - {props.translate('iou.pendingConversionMessage')} - )} - - {Str.htmlDecode(lodashGet(props.action, 'originalMessage.comment', ''))} + + + {!isCurrentUserManager && props.shouldShowPendingConversionMessage && ( + {props.translate('iou.pendingConversionMessage')} + )} + {Str.htmlDecode(lodashGet(props.action, 'originalMessage.comment', ''))} + + {props.isBillSplit && !_.isEmpty(participantEmails) && ( + + {props.translate('iou.amountEach', { + amount: CurrencyUtils.convertToDisplayString(IOUUtils.calculateAmount(participantEmails.length - 1, requestAmount), requestCurrency), + })} + + )} + diff --git a/src/languages/en.js b/src/languages/en.js index cb99cbe873ed..ed4731f99ec8 100755 --- a/src/languages/en.js +++ b/src/languages/en.js @@ -325,6 +325,7 @@ export default { settlePaypalMe: 'Pay with PayPal.me', requestAmount: ({amount}) => `request ${amount}`, splitAmount: ({amount}) => `split ${amount}`, + amountEach: ({amount}) => `${amount} each`, payerOwesAmount: ({payer, amount}) => `${payer} owes ${amount}`, payerSettled: ({amount}) => `settled up ${amount}`, noReimbursableExpenses: 'This report has an invalid amount', diff --git a/src/languages/es.js b/src/languages/es.js index 795b05cf109f..49b1dbd6a81b 100644 --- a/src/languages/es.js +++ b/src/languages/es.js @@ -324,6 +324,7 @@ export default { settlePaypalMe: 'Pagar con PayPal.me', requestAmount: ({amount}) => `solicitar ${amount}`, splitAmount: ({amount}) => `dividir ${amount}`, + amountEach: ({amount}) => `${amount} cada uno`, payerOwesAmount: ({payer, amount}) => `${payer} debe ${amount}`, payerSettled: ({amount}) => `pagado ${amount}`, noReimbursableExpenses: 'El monto de este informe es inválido', diff --git a/src/libs/IOUUtils.js b/src/libs/IOUUtils.js index 57ff6af0a0de..f5ebefbad50c 100644 --- a/src/libs/IOUUtils.js +++ b/src/libs/IOUUtils.js @@ -4,13 +4,13 @@ import CONST from '../CONST'; /** * Calculates the amount per user given a list of participants * - * @param {Array} participants - List of logins for the participants in the chat. It should not include the current user's login. + * @param {Number} numberOfParticipants - Number of participants in the chat. It should not include the current user. * @param {Number} total - IOU total amount in the smallest units of the currency * @param {Boolean} isDefaultUser - Whether we are calculating the amount for the current user * @returns {Number} */ -function calculateAmount(participants, total, isDefaultUser = false) { - const totalParticipants = participants.length + 1; +function calculateAmount(numberOfParticipants, total, isDefaultUser = false) { + const totalParticipants = numberOfParticipants + 1; const amountPerPerson = Math.round(total / totalParticipants); let finalAmount = amountPerPerson; if (isDefaultUser) { diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js index b7f7dff45a6d..3a5265286bf1 100644 --- a/src/libs/actions/IOU.js +++ b/src/libs/actions/IOU.js @@ -386,8 +386,8 @@ function createSplitsAndOnyxData(participants, currentUserLogin, amount, comment } // Loop through participants creating individual chats, iouReports and reportActionIDs as needed - const splitAmount = IOUUtils.calculateAmount(participants, amount, false); - const splits = [{email: currentUserEmail, amount: IOUUtils.calculateAmount(participants, amount, true)}]; + const splitAmount = IOUUtils.calculateAmount(participants.length, amount, false); + const splits = [{email: currentUserEmail, amount: IOUUtils.calculateAmount(participants.length, amount, true)}]; const hasMultipleParticipants = participants.length > 1; _.each(participants, (participant) => { diff --git a/tests/unit/IOUUtilsTest.js b/tests/unit/IOUUtilsTest.js index e8164bc0486b..2f6901ca47a2 100644 --- a/tests/unit/IOUUtilsTest.js +++ b/tests/unit/IOUUtilsTest.js @@ -137,20 +137,20 @@ describe('IOUUtils', () => { test('103 JPY split among 3 participants including the default user should be [35, 34, 34]', () => { const participants = ['tonystark@expensify.com', 'reedrichards@expensify.com']; - expect(IOUUtils.calculateAmount(participants, 103, true)).toBe(35); - expect(IOUUtils.calculateAmount(participants, 103)).toBe(34); + expect(IOUUtils.calculateAmount(participants.length, 103, true)).toBe(35); + expect(IOUUtils.calculateAmount(participants.length, 103)).toBe(34); }); test('10 AFN split among 4 participants including the default user should be [1, 3, 3, 3]', () => { const participants = ['tonystark@expensify.com', 'reedrichards@expensify.com', 'suestorm@expensify.com']; - expect(IOUUtils.calculateAmount(participants, 10, true)).toBe(1); - expect(IOUUtils.calculateAmount(participants, 10)).toBe(3); + expect(IOUUtils.calculateAmount(participants.length, 10, true)).toBe(1); + expect(IOUUtils.calculateAmount(participants.length, 10)).toBe(3); }); test('0.02 USD split among 4 participants including the default user should be [-1, 1, 1, 1]', () => { const participants = ['tonystark@expensify.com', 'reedrichards@expensify.com', 'suestorm@expensify.com']; - expect(IOUUtils.calculateAmount(participants, 2, true)).toBe(-1); - expect(IOUUtils.calculateAmount(participants, 2)).toBe(1); + expect(IOUUtils.calculateAmount(participants.length, 2, true)).toBe(-1); + expect(IOUUtils.calculateAmount(participants.length, 2)).toBe(1); }); }); });