Fix bolded text for Existing Owners Error

[jasperhuangg]

Details

This PR fixes the text in the error message to prevent any separators (e.g. , , , and, etc.) from being bolded. It also ensures we use the localization for the word and.

Fixed Issues

$ https://github.com/Expensify/Expensify/issues/169896#issuecomment-884327715

Tests

1. Paste this code block here. This'll simulate the server returning with an existingOwners error:

   return new Promise(resolve => resolve({existingOwners: ['[email protected]', '[email protected]', '[email protected]']})).then((response) => {
       const existingOwnersList = response.existingOwners.reduce((ownersStr, owner, i, ownersArr) => {
           let separator = ',\n';
           if (i === 0) {
               separator = '\n';
           } else if (i === ownersArr.length - 1) {
               separator = ' and\n';
           }
           return `${ownersStr}${separator}${owner}`;
       }, '');
       Onyx.merge(ONYXKEYS.REIMBURSEMENT_ACCOUNT, {loading: false, error: CONST.BANK_ACCOUNT.ERROR.EXISTING_OWNERS, existingOwnersList});
   });

2. Navigate to the add bank account flow for a workspace.
3. Verify that you're unable to add the account since the bank account already has an existing owner, and verify that the error step displays (see screenshots).

QA

1. Create a new workspace and click "Get Started".
2. Add a bank account manually following the steps here.
3. In a different account, follow steps 1 and 2.
4. Verify that you're unable to add the account since the bank account already has an existing owner, and verify that the error step displays (see screenshots).

Tested On

• Web
• Mobile Web
• Desktop
• iOS
• Android

Screenshots

Web

Mobile Web

Desktop

iOS

Android

cc @michelle-thompson

[tgolen]

Are you able to get it tested on Android?

[jasperhuangg]

@tgolen My android emulator is being all wonky. I have an old android device lying around somewhere, lemme see if I can find it 🧐

[jasperhuangg]

Yup, can't get my physical device to work either :/ @tgolen Reaching out in #engineering-chat for help.

@tgolen Got it working and added a screenshot on Android, thanks!

[tgolen]

Ah, cool. Thanks! Sorry it gave you such fits. I know the pain

[tgolen]

I assume the removal of flex was intentional?

[tgolen]

I'll must assume you meant to remove the flex and merge this. If we need to revert that change in another PR (like if it was a mistake), then that's OK.

[OSBotify]

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

[OSBotify]

🚀 Deployed to staging in version: 1.0.81-5🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	failure ❌
🕸 web 🕸	success ✅

[OSBotify]

🚀 Deployed to production in version: 1.0.82-7🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅