[$250] Rules - Unable to clear default value and save value in Random report audit field

[IuliiaHerets]

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.40-0
Reproducible in staging?: Y
Reproducible in production?: Y
Issue was found when executing this PR: #49180
Email or phone of affected tester (no customers): [email protected]
Issue reported by: Applause Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Create a new workspace.
3. Go to More features.
4. Enable Rules.
5. Enable Workflows.
6. Enable Add approval in Workflows settings.
7. Go to Rules.
8. Enable Auto-approve compliant reports.
9. Click Random report audit.
10. Try to remove the default value by delete key and save a new one.

Expected Result:

The default value can be cleared by delete key and a new value can be saved.

Actual Result:

The default value cannot be cleared by delete key.
The default value can be cleared by CMD+A but the value reverts to the default value after saving a new value.

Workaround:

Unknown

Platforms:

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6615157_1727291073352.rules.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021839442575257050533
• Upwork Job ID: 1839442575257050533
• Last Price Increase: 2024-09-26

Issue Owner

Current Issue Owner: @brunovjk

[melvin-bot]

Triggered auto assignment to @trjExpensify (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.

[IuliiaHerets]

We think that this bug might be related to #wave-control

[IuliiaHerets]

@trjExpensify FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[daledah]

Edited by proposal-police: This proposal was edited at 2024-09-25 20:28:42 UTC.

Proposal

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

The default value cannot be cleared by delete key.
The default value can be cleared by CMD+A but the value reverts to the default value after saving a new value.

What is the root cause of that problem?

When we press delete button => newAmoun = 0.0 so function validatePercentage will return it as an invalid percentage value and skip update the input

App/src/components/PercentageForm.tsx

Lines 41 to 43 in a4a344b

	if (!MoneyRequestUtils.validatePercentage(newAmountWithoutSpaces)) {
	return;
	}

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

We should remove this condition and will check valid when we submit the form here and if it's not valid we can show the error

App/src/components/PercentageForm.tsx

Lines 41 to 43 in a4a344b

	if (!MoneyRequestUtils.validatePercentage(newAmountWithoutSpaces)) {
	return;
	}

What alternative solutions did you explore? (Optional)

NA

[abzokhattab]

Edited by proposal-police: This proposal was edited at 2024-09-25 21:48:58 UTC.

Proposal

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

We are unable to clear the default value and save a new value in the "Random report audit" field.

What is the root cause of that problem?

When the delete button is pressed, the PercentageForm validates the new value using the validatePercentage function.

The issue occurs because this function currently checks if the number is between 0 and 100 but only works with integers. It fails when the value is a decimal and returns false.

App/src/libs/MoneyRequestUtils.ts

Lines 55 to 59 in 5797fb1

	function validatePercentage(amount: string): boolean {
	const regexString = '^(100|[0-9]{1,2})$';
	const percentageRegex = new RegExp(regexString, 'i');
	return amount === '' || percentageRegex.test(amount);
	}

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

• I attempted to modify the regular expression inside validatePercentage to allow decimal values up to two decimal places. This works, but after saving, the backend rounds the entered value down to an integer.

• To resolve this, we could either:

  1. Modify the default value to be floored here .

const defaultValue = Math.floor(policy?.autoApproval?.auditRate ?? CONST.POLICY.RANDOM_AUDIT_DEFAULT_PERCENTAGE);

2. Update the regex to allow decimals, such as:
   ^(100(.0{1,2})?|[0-9]{1,2}(.[0-9]{1,2})?)%?$.

• Alternatively, for better readability, we could avoid using regex and do the validation directly in the function. Here’s an example:

/**
 * Check if percentage is between 0 and 100
 */
function validatePercentage(amount: string): boolean {
    const number = parseFloat(amount);
    if (number == "") {
        return true;
    }
    return number >= 0 && number <= 100 && (amount.split('.')[1]?.length ?? 0) <= 2;
}

What alternative solutions did you explore? (Optional)

[bernhardoj]

Proposal

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

Unable to clear Random report audit default value.

What is the root cause of that problem?

When we enable the Auto-approve compliant reports, the BE will return 0.05 as the default value of the Random report audit. On the page, there is a validation to make sure the input is only 0-100, with no decimals.

App/src/libs/MoneyRequestUtils.ts

Lines 55 to 59 in b5c47c5

	function validatePercentage(amount: string): boolean {
	const regexString = '^(100|[0-9]{1,2})$';
	const percentageRegex = new RegExp(regexString, 'i');
	return amount === '' || percentageRegex.test(amount);
	}

App/src/components/PercentageForm.tsx

Lines 41 to 43 in b5c47c5

	if (!MoneyRequestUtils.validatePercentage(newAmountWithoutSpaces)) {
	return;
	}

So, when we press backspace, the input value becomes 0.0 and because it's invalid, the input is not updated. If we see the optimistic default value, the value is 5, not 0.05, so there is a difference between FE and BE.

App/src/CONST.ts

Line 2186 in b5c47c5

RANDOM_AUDIT_DEFAULT_PERCENTAGE: 5,

If we go to OD, we can't input decimals, so I believe the expected behavior here is to not allow decimals, which is what the page validation already did.

The real problem I believe here is, that we need to convert the rate decimal representation to the percentage value by multiplying it by 100, and dividing it by 100 when saving it. Why? Because if we update the value with a number bigger than 1, the BE will return an invalid rate error.

So, if we want to save 1%, we need to send it as 0.01.

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

1. Update the optimistic default rate to 0.05
   

   App/src/CONST.ts

   Line 2186 in b5c47c5

   RANDOM_AUDIT_DEFAULT_PERCENTAGE: 5,

2. Convert to percentage when displaying it
   

   App/src/pages/workspace/rules/ExpenseReportRulesSection.tsx

   Line 145 in b5c47c5

   title={`${policy?.autoApproval?.auditRate ?? CONST.POLICY.RANDOM_AUDIT_DEFAULT_PERCENTAGE}%`}

   
   

   App/src/pages/workspace/rules/RulesRandomReportAuditPage.tsx

   Line 35 in b5c47c5

   const defaultValue = policy?.autoApproval?.auditRate ?? CONST.POLICY.RANDOM_AUDIT_DEFAULT_PERCENTAGE;

Math.round((policy?.autoApproval?.auditRate ?? CONST.POLICY.RANDOM_AUDIT_DEFAULT_PERCENTAGE) * 100)

We can create a PolicyUtils function for that. PolicyUtils.getPolicyAutoApprovalAuditRate()
3. Convert it back to the decimal representation when saving the value

App/src/libs/actions/Policy/Policy.ts

Lines 4160 to 4163 in b5c47c5

	function setPolicyAutomaticApprovalRate(policyID: string, auditRate: string) {
	const policy = getPolicy(policyID);
	const fallbackAuditRate = auditRate === '' ? '0' : auditRate;
	const parsedAuditRate = parseInt(fallbackAuditRate, 10);

const parsedAuditRate = parseInt(fallbackAuditRate, 10) / 100;

[trjExpensify]

@marcaaron @JmillsExpensify @dylanexpensify putting this on your radar. I think we should display this as 5% in the UI, it feels more intuitive than 0.05%,

[melvin-bot]

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

[melvin-bot]

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

[marcaaron]

I think we can close this one out. It should be fixed on main already with #49320 and I've ben looking into it as part of #49254

[marcaaron]

This was basically a temporary side effect of needing to update the backend to accept the correct values.

[trjExpensify]

Of course you're on it!

…

On Fri, Sep 27, 2024 at 12:37 AM Marc Glasser ***@***.***> wrote: This was basically a temporary side effect of needing to update the backend to accept the correct values. — Reply to this email directly, view it on GitHub <#49742 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AD3246NJMNUA4KWSTUWNOI3ZYSLDBAVCNFSM6AAAAABO3JFFM6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZYGEZDCNBZGQ> . You are receiving this because you were mentioned.Message ID: ***@***.***>

-- *Tom Rhys Jones * *Expensify*