[HOLD for payment 2024-08-01] [$250] Subscription size - Decimal point can be inserted and not removed on the confirmation page

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 1.4.84-0
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Issue reported by: Applause - Internal Team

Issue found when executing PR #43328

Action Performed:

1. Go to staging.new.expensify.com/settings/subscription/subscription-size
2. Enter a digit and a decimal point
3. Click Next

Expected Result:

Decimal point will be removed on the next page

Actual Result:

Decimal point can be inserted and not removed on the confirmation page

Workaround:

Unknown

Platforms:

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

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6514089_1718444363848.bandicam_2024-06-15_17-37-25-460.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01d8c409a169a06c82
• Upwork Job ID: 1803448780086879493
• Last Price Increase: 2024-06-19
• Automatic offers:
• fedirjh | Reviewer | 102862371
• Krishna2323 | Contributor | 102862372

Issue Owner

Current Issue Owner: @miljakljajic

[melvin-bot]

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

[lanitochka17]

@miljakljajic 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

[Krishna2323]

Proposal

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

Subscription size - Decimal point can be inserted and not removed on the confirmation page

What is the root cause of that problem?

We haven't added a check for decimal point.

App/src/libs/ValidationUtils.ts

Lines 485 to 488 in 75c104b

	function isValidSubscriptionSize(subscriptionSize: string): boolean {
	const parsedSubscriptionSize = Number(subscriptionSize);
	return !Number.isNaN(parsedSubscriptionSize) && parsedSubscriptionSize > 0 && parsedSubscriptionSize <= CONST.SUBSCRIPTION_SIZE_LIMIT && Number.isInteger(parsedSubscriptionSize);
	}

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

Check if the number contains ..

function isValidSubscriptionSize(subscriptionSize: string): boolean {
    const parsedSubscriptionSize = Number(subscriptionSize);
    if (subscriptionSize.includes('.')) {
        return false;
    }
    return !Number.isNaN(parsedSubscriptionSize) && parsedSubscriptionSize > 0 && parsedSubscriptionSize <= CONST.SUBSCRIPTION_SIZE_LIMIT && Number.isInteger(parsedSubscriptionSize);
}

What alternative solutions did you explore? (Optional)

We can use NUMBER regex.

function isValidSubscriptionSize(subscriptionSize: string): boolean {
    const parsedSubscriptionSize = Number(subscriptionSize);
    return (
        !Number.isNaN(parsedSubscriptionSize) &&
        parsedSubscriptionSize > 0 &&
        parsedSubscriptionSize <= CONST.SUBSCRIPTION_SIZE_LIMIT &&
        Number.isInteger(parsedSubscriptionSize) &&
        CONST.REGEX.NUMBER.test(subscriptionSize)
    );
}

What alternative solutions did you explore? (Optional 2)

If we don't want to show error when entering 0 after decimal then we need to trim the decimal points on confirmation page.

App/src/pages/settings/Subscription/SubscriptionSize/substeps/Confirmation.tsx

Line 44 in 75c104b

title={translate('subscription.subscriptionSize.activeMembers', {size: subscriptionSizeFormDraft ? subscriptionSizeFormDraft[INPUT_IDS.SUBSCRIPTION_SIZE] : 0})}

title={translate('subscription.subscriptionSize.activeMembers', {
    size: subscriptionSizeFormDraft ? `${Math.trunc(Number(subscriptionSizeFormDraft[INPUT_IDS.SUBSCRIPTION_SIZE]))}` : 0,
})}

Additionally we should also clear the draft value when saving the subscription size.

App/src/pages/settings/Subscription/SubscriptionSize/index.tsx

Lines 29 to 32 in 75c104b

	const onFinished = () => {
	Subscription.updateSubscriptionSize(subscriptionSizeFormDraft ? Number(subscriptionSizeFormDraft[INPUT_IDS.SUBSCRIPTION_SIZE]) : 0, privateSubscription?.userCount ?? 0);
	Navigation.goBack();
	};

To:

    const onFinished = () => {
        FormActions.clearDraftValues(ONYXKEYS.FORMS.SUBSCRIPTION_SIZE_FORM);
        Subscription.updateSubscriptionSize(subscriptionSizeFormDraft ? Number(subscriptionSizeFormDraft[INPUT_IDS.SUBSCRIPTION_SIZE]) : 0, privateSubscription?.userCount ?? 0);
        Navigation.goBack();
    };

[Krishna2323]

Proposal Updated

• Added alternative 1 and 2

[melvin-bot]

@miljakljajic Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[melvin-bot]

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

[melvin-bot]

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