[HOLD for payment 2023-10-23][$500] Web - Account Settings - Inappropriate error message when add Legal name in non-English alphabet

[izarutskaya]

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

---

Action Performed:

1. Go to Settings > Profile > Personal details > Legal name
2. Fill the Legal first name or Legal last name with non-English alphabet letters ( Cyrillic alphabet - Гоце Матески)

Expected Result:

Error message should be appropriate, for example - Please enter a name using Latin characters

Actual Result:

Inappropriate error message (Name can only include letters.) appears when User add Legal name in non-English alphabet

Workaround:

Unknown

Platforms:

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

• Android / native
• Android / Chrome
• iOS / native
• iOS / Safari
• MacOS / Chrome / Safari
• MacOS / Desktop

Version Number: 1.3.74-1

Reproducible in staging?: Y

Reproducible in production?: Y

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

Notes/Photos/Videos: Any additional supporting documentation

Bug6214634_20230926_023604.mp4

Expensify/Expensify Issue URL:

Issue reported by: Applause-Internal Team

Slack conversation: @

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0173b61987caa93a3d
• Upwork Job ID: 1706828987571515392
• Last Price Increase: 2023-09-27
• Automatic offers:
• ntdiary | Reviewer | 27031539
• hungvu193 | Contributor | 27031540

[melvin-bot]

Triggered auto assignment to @lschurr (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[melvin-bot]

Bug0 Triage Checklist (Main S/O)

• This "bug" occurs on a supported platform (ensure Platforms in OP are ✅)
• This bug is not a duplicate report (check E/App issues and #expensify-bugs)
  • If it is, comment with a link to the original report, close the issue and add any novel details to the original issue instead
• This bug is reproducible using the reproduction steps in the OP. S/O
  • If the reproduction steps are clear and you're unable to reproduce the bug, check with the reporter and QA first, then close the issue.
  • If the reproduction steps aren't clear and you determine the correct steps, please update the OP.
• This issue is filled out as thoroughly and clearly as possible
  • Pay special attention to the title, results, platforms where the bug occurs, and if the bug happens on staging/production.
• I have reviewed and subscribed to the linked Slack conversation to ensure Slack/Github stay in sync

[hungvu193]

Proposal

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

Validation message showed "Name can only include letters" when user tried to update their name with Cyrillic alphabet characters.

What is the root cause of that problem?

We're currently validating our first name with alphabetic and latin character, in this case, we're using Cyrillic alphabet, which caused the issue.

App/src/libs/ValidationUtils.js

Lines 374 to 376 in 52c3f53

	function isValidLegalName(name) {
	return CONST.REGEX.ALPHABETIC_AND_LATIN_CHARS.test(name);
	}

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

We should change the error message to make it more meaning full:

App/src/languages/en.ts

Line 971 in 52c3f53

hasInvalidCharacter: 'Name can only include letters.',

App/src/languages/es.ts

Line 968 in 52c3f53

hasInvalidCharacter: 'El nombre sólo puede incluir letras.',

"hasInvalidCharacter": `Name can only include alphabetic and latin letters.` // or: Name can only include alphabetic and latin characters.

Also update the error message in Spanish as well

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

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

[melvin-bot]

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

[lncramer]

Hey there, ran into this issue on Upwork and would be happy to help out.

I might need a bit of clarification on the expected result here. I am assuming that Гоце Матески should still be considered invalid, but that the error message just needs to be clearer.

Proposal

If the issue is simply that the error message needs to be updated, then I would update the English and Spanish string values for hasInvalidCharacter as appropriate. I would also add/update any related tests.

[melvin-bot]

📣 @lncramer! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[ntdiary]

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

Hi, folks, please describe the problem in your own words, rather than just copying the title. : )

Additionally, @lncramer, I'm glad you're interested in this project. Please follow our contributor guidelines, which have detailed steps on how to get involved. : )

[hungvu193]

Thanks for reminding 😃 I've just updated my proposal

[HCanArslan]

PROPOSAL:

Root Cause: My application initially lacked a proper validation mechanism to ensure users entered legal names using only Latin characters. This oversight might lead to data inconsistencies or issues in systems that expect legal names to have Latin characters.

Solution:

Defined a Validation Function:

I implemented a utility function isValidLegalName(name) to check the validity of a legal name.

First, it checks for any non-Latin characters using the regex /[^ -~]+/, which matches any character outside the ASCII printable characters range.
If the name has non-Latin characters, it immediately returns false.
Next, the function checks the name against another regex I defined in CONST.REGEX.ALPHABETIC_AND_LATIN_CHARS to ensure it contains valid Latin characters only.
Implemented Form Validation:

In the form validation logic, I used the isValidLegalName utility function to perform checks:

If the name contains non-Latin characters, it triggers an error message: 'privatePersonalDetails.error.nonLatinCharacter'.
If the name has any other invalid characters, as defined by the Latin regex, it triggers another error message: 'privatePersonalDetails.error.hasInvalidCharacter'.
For an empty name field, the error message generated is: 'common.error.fieldRequired'.
I ensured these checks were applied separately to both legalFirstName and legalLastName.

[melvin-bot]

📣 @HCanArslan! 📣
Hey, it seems we don’t have your contributor details yet! You'll only have to do this once, and this is how we'll hire you on Upwork.
Please follow these steps:

1. Make sure you've read and understood the contributing guidelines.
2. Get the email address used to login to your Expensify account. If you don't already have an Expensify account, create one here. If you have multiple accounts (e.g. one for testing), please use your main account email.
3. Get the link to your Upwork profile. It's necessary because we only pay via Upwork. You can access it by logging in, and then clicking on your name. It'll look like this. If you don't already have an account, sign up for one here.
4. Copy the format below and paste it in a comment on this issue. Replace the placeholder text with your actual details.
   
   Format:

Contributor details
Your Expensify account email: <REPLACE EMAIL HERE>
Upwork Profile Link: <REPLACE LINK HERE>

[HCanArslan]

Contributor details
Your Expensify account email: ayediix@gmail.com
Upwork Profile Link: https://www.upwork.com/freelancers/~0191eac67fcbdb48aa

[melvin-bot]

✅ Contributor details stored successfully. Thank you for contributing to Expensify!

[ntdiary]

I remember we discussed the regex pattern for names before, and it seems it also involved the backend, need to find that discussion first to confirm. 🤔

[HCanArslan]

I defined a utility function named isValidLegalName within ValidationUtils.ts which uses regular expressions to validate a provided name, ensuring that it does not contain non-Latin or special characters. Then I employed the regex pattern to detect non-Latin characters and I implemented a validate function that checks both legalFirstName and legalLastName fields against various conditions. When a validation fails, the associated error message (like 'privatePersonalDetails.error.nonLatinCharacter') is assigned, which likely corresponds to a user-facing error message.

I could not find anything about backend that possibly involved with this issue.
Could you explain a little bit more?

[ntdiary]

I think one regular expression is enough, and I don't see the necessity to add another one.

The expected result in the OP seems very simple on the surface, we just need to update an appropriate error message. (e.g., Name can only include latin letters.)

By the way, @hungvu193, this is a suggestion given to you by Google's Bard for your proposal:

---

In fact, there are some interesting things worth exploring and summarizing, they may be out of the scope of this specific issue, but I believe they could be helpful for dealing with similar issues in the future.

Here is the revision history related to the legal name validation:

1. Use legal names for updating wallet #10488
   When submitting this PR, we enabled regex validation for legal names on the backend, and provided the regex format used on the backend in this slack conversation.

   '(\\w+([\\s_\\-\\.]+\\w+)*)(\/\\w+([\\s_\\-\\.]+\\w+)*)*'

2. Display error message for symbols in legal name #15989
   In this PR, we added regex validation for legal names on the frontend. The js pattern contains 62 characters.

   // regex format:
   /^[a-zA-Z0-9 ]*$/
   // message:
   'Name can only include letters and numbers.'

3. Allow Spanish chars in Legal first and last name #18786
   In this PR, we tried to support Spanish letters. The backend also updated the regex, but I could only find an internal slack converstaion. The js pattern contains 126 characters.

   // regex format:
   /^[a-zA-ZÀ-ÿ0-9 ]*$/
   // message:
   'Name can only include latin letters and numbers'

4. updated regex for legal name and cardholder name #23650
   In this PR, we no longer support numbers. The js pattern contains 116 characters.

   // regex format:
   /^[a-zA-ZÀ-ÿ ]*$/
   // message:
   'Name can only include letters.'

5. App allows '÷×' symbols in legal name even though error states that 'Name can only include letters' #25615
   In this PR, we changed the regex to the Latin script on the frontend. The js pattern contains 1481 characters.

   // regex format:
   /^[\p{Script=Latin} ]*$/u
   // message:
   'Name can only include letters.'

Another interesting thing, according to my tests, our backend now only supports a small subset of Latin characters, it seems to be [\p{Block=Basic Latin}\p{Block=Latin 1 Supplement}]&[\p{Emoji=No}]&[\p{General_Category=Letter}], plus some symbols like _- / etc, only less than 130 characters. This means when we use any of the remaining 1000+ characters, the name will be cleared (e.g, Ālan). If we also want to solve this problem, we need to align the regex patterns between the frontend and backend.

Finally, I think it's okay to assign this issue to @hungvu193, because their proposal is closest to the expected result, and since I have provided the full context, they should also be capable of implementing it even if we want to align the regex patterns. : )

🎀 👀 🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @NikkiWines, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[lschurr]

@NikkiWines could you take a look at this one?

[NikkiWines]

Yep, @hungvu193's proposal looks good to me as well.

[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 1.3.83-11 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Update appropriate message for legal name validation. #28892

If no regressions arise, payment will be issued on 2023-10-20. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @ntdiary requires payment offer (Reviewer)
• @hungvu193 requires payment offer (Contributor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ntdiary] The PR that introduced the bug has been identified. Link to the PR:
• [@ntdiary] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@ntdiary] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@ntdiary] Determine if we should create a regression test for this bug.
• [@ntdiary] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@lschurr] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[melvin-bot]

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

• Update appropriate message for legal name validation. #28892

If no regressions arise, payment will be issued on 2023-10-20. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @ntdiary requires payment offer (Reviewer)
• @hungvu193 requires payment offer (Contributor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ntdiary] The PR that introduced the bug has been identified. Link to the PR:
• [@ntdiary] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@ntdiary] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@ntdiary] Determine if we should create a regression test for this bug.
• [@ntdiary] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@lschurr] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[melvin-bot]

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

• Update appropriate message for legal name validation. #28892

If no regressions arise, payment will be issued on 2023-10-23. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @ntdiary requires payment offer (Reviewer)
• @hungvu193 requires payment offer (Contributor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ntdiary] The PR that introduced the bug has been identified. Link to the PR:
• [@ntdiary] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@ntdiary] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@ntdiary] Determine if we should create a regression test for this bug.
• [@ntdiary] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@lschurr] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[melvin-bot]

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

• Update appropriate message for legal name validation. #28892

If no regressions arise, payment will be issued on 2023-10-23. 🎊

After the hold period is over and BZ checklist items are completed, please complete any of the applicable payments for this issue, and check them off once done.

• External issue reporter
• Contributor that fixed the issue
• Contributor+ that helped on the issue and/or PR

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

• @ntdiary requires payment offer (Reviewer)
• @hungvu193 requires payment offer (Contributor)

As a reminder, here are the bonuses/penalties that should be applied for any External issue:

• Merged PR within 3 business days of assignment - 50% bonus
• Merged PR more than 9 business days after assignment - 50% penalty

[melvin-bot]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ntdiary] The PR that introduced the bug has been identified. Link to the PR:
• [@ntdiary] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment:
• [@ntdiary] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion:
• [@ntdiary] Determine if we should create a regression test for this bug.
• [@ntdiary] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@lschurr] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[melvin-bot]

@ntdiary, @hungvu193, @NikkiWines, @lschurr Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[ntdiary]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@ntdiary] The PR that introduced the bug has been identified. Link to the PR: N/A
• [@ntdiary] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment: N/A
• [@ntdiary] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion: No need
• [@ntdiary] Determine if we should create a regression test for this bug. No need
• [@ntdiary] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again. No need
• [@lschurr] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

this is not a regression, just a translation improvement.

[lschurr]

Payment summary:

• Bug reporter: Applause (no payment)
• Contributor: @hungvu193 $500
• Contributor+: @ntdiary $500

[lschurr]

@ntdiary - please accept the offer in Upwork! https://www.upwork.com/nx/wm/offer/27031539

[ntdiary]

@ntdiary - please accept the offer in Upwork! https://www.upwork.com/nx/wm/offer/27031539

@lschurr Accepted. : )

[lschurr]

This is done. Closing!