[$250] Refactor SMS Delivery Failure sign in flow

[carlosmiceli]

We need to refactor the existing flow blacklisting phone numbers (see steps in screenshots). This is triggered when the user tries to sign in with a phone number that failed to receive Twilio SMS. This is a follow up to this issue.

---

When calling BeginSignIn, if response[smsDeliveryFailureStatus] is not null, then it should display the following message:

"We've been unable to deliver SMS messages to [PHONE-NUMBER], so we've suspended it for 24 hours. Please try validating your number:"

There should also be a "Validate" button that calls ResetSMSDeliveryFailure.

If response[hasSMSDeliveryFailure]is set totrue, we should display Validation failed because it hasn't been 24 hours since your last attempt. ${response.message} and a "Got it" button that sends the user back to the beginning of the sign in flow.

If response[hasSMSDeliveryFailure]is set tofalse, we should display Your number has been validated! Click below to send a new magic sign-in code. and a "Send" button that calls BeginSignIn as usual.

Once this is complete and merged I'll do the internal QA with the BE.

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021867038175379475893
• Upwork Job ID: 1867038175379475893
• Last Price Increase: 2024-12-12
• Automatic offers:
• nyomanjyotisa | Contributor | 105327292

Issue Owner

Current Issue Owner: @hungvu193

[melvin-bot]

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

[melvin-bot]

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

[nyomanjyotisa]

Proposal

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

Refactor SMS Delivery Failure sign in flow

What is the root cause of that problem?

Improvement

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

We should change smsDeliveryFailureMessage on both en and es translation files

    smsDeliveryFailurePage: {
        smsDeliveryFailureMessage: ({login}: OurEmailProviderParams) =>
            `We've been unable to deliver SMS messages to ${login}, so we've suspended it for 24 hours. Please try validating your number:`,
    },

We should also change this button to text={translate('common.validate')}

And on Validate button click, execute new function that we will create, which is Session.ResetSMSDeliveryFailure

function resetSMSDeliveryFailure(email: string) {
    const params: ResetSMSDeliveryFailureParams = {email};

    API.write(WRITE_COMMANDS.RESET_SMS_DELIVERY_FAILURE, params);
}

We should also update the UI on SMSDeliveryFailurePage based on the API response

If hasSMSDeliveryFailure is true from the ResetSMSDeliveryFailure calls, show the message and Got it button. Got it button should execute Session.clearSignInData

If hasSMSDeliveryFailure is false from the ResetSMSDeliveryFailure calls, show the message and Send button. Send button should execute Session.beginSignIn which will navigate to enter magic code screen

To check if response from smsDeliveryFailureStatus is not null we can change this code to this
const hasSMSDeliveryFailure = !!account?.smsDeliveryFailureStatus;

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

What alternative solutions did you explore? (Optional)

[hungvu193]

I'll review proposal tomorrow.

[carlosmiceli]

@hungvu193 thank you, this is kinda urgent but tomorrow works! 👍

[hungvu193]

Reviewing shortly

[hungvu193]

@nyomanjyotisa 's proposal looks good to me!

🎀 👀 🎀

[melvin-bot]

Current assignee @carlosmiceli is eligible for the choreEngineerContributorManagement assigner, not assigning anyone new.

[melvin-bot]

📣 @nyomanjyotisa 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖