[HOLD for payment 2024-11-14] [$250] Splitting 9000 with 4 users, the confirmation page incorrectly displays the participant amounts as 0.

[m-natarajan]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: 9.0.56-0.
Reproducible in staging?: y
Reproducible in production?: n
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Only in stand alone, Hybrid is not updated yet
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @rayane-djouah
Slack conversation (hyperlinked to channel name): https://expensify.slack.com/archives/C049HHMV9SM/p1730291114159429

Action Performed:

1. Start a group
2. Split money (e.g 9000)
3. Enter the value in the BNP
4. Observe the individual split amount

Expected Result:

Should be 2250

Actual Result:

Showing as 0

Workaround:

unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

381488319-be8b5291-471a-4fae-8a25-37aba3074166.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021852081957595400665
• Upwork Job ID: 1852081957595400665
• Last Price Increase: 2024-10-31

Issue Owner

Current Issue Owner: @sonialiap

[melvin-bot]

Triggered auto assignment to @sonialiap (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[melvin-bot]

Triggered auto assignment to @marcochavezf (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[melvin-bot]

💬 A slack conversation has been started in #expensify-open-source

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[mkzie2]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Unable to edit

What is the root cause of that problem?

It comes from #51202

The amount regex doesn't accept commas character

App/src/components/MoneyRequestAmountInput.tsx

Line 277 in 7216310

const regex = useMemo(() => MoneyRequestUtils.amountRegex(decimals), [decimals]);

App/src/libs/MoneyRequestUtils.ts

Lines 43 to 47 in 7216310

	function amountRegex(decimals: number, amountMaxLength: number = CONST.IOU.AMOUNT_MAX_LENGTH): string {
	return decimals === 0
	? `^\\d{0,${amountMaxLength}}$` // Don't allow decimal point if decimals === 0
	: `^\\d{0,${amountMaxLength}}(?:(?:\\.|\\,)\\d{0,${decimals}})?$`; // Allow the decimal point and the desired number of digits after the point
	}

What changes do you think we should make in order to solve the problem?

We should update this function with another param, isAllowCommas, whose default value is false, and introduce a new prop, isAllowCommas, with the same default value in MoneyRequestAmountInput.

if isAllowCommas is true, we should return the regex that allows the commas

/**
 * Get amount regex string
 */
function amountRegex(decimals: number, amountMaxLength: number = CONST.IOU.AMOUNT_MAX_LENGTH, isAllowCommans = false): string {
    const amountRegexWithoutDecimals = isAllowCommans ? `(?:\\d{1,3})(?:,\\d{3}){0,${Math.floor((amountMaxLength - 1) / 3)}}$|^\\d{1,${amountMaxLength}}` : `\\d{0,${amountMaxLength}}`;
    return decimals === 0
        ? `^${amountRegexWithoutDecimals}$` // Don't allow decimal point if decimals === 0
        : `^${amountRegexWithoutDecimals}(?:(?:\\.|\\,)\\d{0,${decimals}})?$`; // Allow the decimal point and the desired number of digits after the point
}

App/src/libs/MoneyRequestUtils.ts

Lines 43 to 47 in 7216310

	function amountRegex(decimals: number, amountMaxLength: number = CONST.IOU.AMOUNT_MAX_LENGTH): string {
	return decimals === 0
	? `^\\d{0,${amountMaxLength}}$` // Don't allow decimal point if decimals === 0
	: `^\\d{0,${amountMaxLength}}(?:(?:\\.|\\,)\\d{0,${decimals}})?$`; // Allow the decimal point and the desired number of digits after the point
	}

Update this line to pass isAllowCommans prop

const regex = useMemo(() => MoneyRequestUtils.amountRegex(decimals, undefined, isAllowCommans), [decimals]);

App/src/components/MoneyRequestAmountInput.tsx

Line 277 in 7216310

const regex = useMemo(() => MoneyRequestUtils.amountRegex(decimals), [decimals]);

After that we can pass isAllowCommans={true} here

App/src/components/MoneyRequestConfirmationList.tsx

Line 548 in 224b633

<MoneyRequestAmountInput

What alternative solutions did you explore? (Optional)

[melvin-bot]

⚠️ Looks like this issue was linked to a Deploy Blocker here

If you are the assigned CME please investigate whether the linked PR caused a regression and leave a comment with the results.

If a regression has occurred and you are the assigned CM follow the instructions here.

If this regression could have been avoided please consider also proposing a recommendation to the PR checklist so that we can avoid it in the future.

[s77rt]

Hmm this is starting to get a little bit complicated as what the user can input vs what the BE consider valid are two different things e.g.

• 1500.79
• 1,500.79
• 1.500,79

All the above are valid numbers and can be entered by the user but only the first is accepted in the BE

[marcochavezf]

I haven't been able to reproduce it on the web; seems it's only happening on Android. So I don't think this should block the deploy, but it should be fixed.

All the above are valid numbers and can be entered by the user but only the first is accepted in the BE

But why is it working on other platforms? Given it's still in the regression period, can you fix it @s77rt?

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021852081957595400665

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @rushatgabhane (External)

[mkzie2]

When we send the value to BE we will send the correct amount. In other cases, the formatted amount is only used to display. Since editing the amount with commas seems complex, when we focus on the amount input we can change the text input to the value amount and only change it to the formatted amount text after we blur the text input.

[s77rt]

I'm working on it. The bug does not happen on web because the regex prop only is only available in native (it was added on native to prevent some flickering)

[s77rt]

I spent some time on this. I can't seem to find an easy solution because the comma position for groups is not predetermined e.g. if the input is 1,90|0.00 (| is the cursor) and you press delete the value would be 1,90.00 which is not a valid amount but it's a valid intermediate state. An option to fix this is to have 2 regex but I found this will pretty much re-introduce the original bug #47875. For that reason I think it's best to revert the PR

[mkzie2]

@s77rt What do you think about my idea above?

[s77rt]

@mkzie2 The value is displayed 0 even before focus

[mkzie2]

We still need to update the regex to accept commas but use the idea above to edit the amount with commas.

[s77rt]

@mkzie2 I think that would fix that bug but I faced another problem since now you can paste 14,500.00 but in some places the grouping is not allowed and it keeps only periods or commas (depending on the locale) making the value 14.500.00 or 14,500,00 which is not a number (NaN).

Screen.Recording.2024-11-01.at.3.58.04.PM.mov

[rushatgabhane]

ahh this one is trickyy

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.58-2 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Revert "Add regex to TextInput" #51849

If no regressions arise, payment will be issued on 2024-11-14. 🎊

For reference, here are some details about the assignees on this issue:

• @rushatgabhane requires payment through NewDot Manual Requests

[melvin-bot]

@rushatgabhane @sonialiap The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]