[HOLD for payment + bonus] Password error translation not updated on Language change

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:

Go to Login page
Don't enter anything and press enter
You'll see an error Please enter an email or phone number
Now change the language to Spanish
You'll see the whole page is translated except for the error message.

Expected Result:

The error message should've been updated with the correct translation text

Actual Result:

Error message translation not updated on language change.

Workaround:

The user will have to click the button again to get the correct error message.

Platform:

Where is this issue occurring?

Web
iOS
Android
Desktop App
Mobile Web

Version Number:
Logs: https://stackoverflow.com/c/expensify/questions/4856
Notes/Photos/Videos: Any additional supporting documentation
Expensify/Expensify Issue URL:

View all open jobs on Upwork

@greg-schroeder

Triggered auto assignment to @greg-schroeder (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

Proposal

In the LoginForm.validateAndSubmitForm, we're storing the whole translated error message in the state.

if (!this.state.login.trim()) {
    this.setState({formError: this.props.translate('loginForm.pleaseEnterEmailOrPhoneNumber')});
    return;
}

Instead we should only store the key and use translation in the render method

//validateAndSubmitForm ()
if (!this.state.login.trim()) {
    this.setState({formError: 'loginForm.pleaseEnterEmailOrPhoneNumber'});
    return;
}


// render()

{this.state.formError && (
    <Text style={[styles.formError]}>
        {this.props.translate(this.state.formError)}
    </Text>
)}

The same issue exists in PasswordForm too.

Also the error message is a little misleading when there's only one field it says, Please fill out all fields

@timszot

Triggered auto assignment to @timszot (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

@anthony-hull

@anthony-hull the error that I reported was more of UI issue even before hitting any API. If you notice the error has translation but it doesn't switch translation on language change.

Your solution might be an extension/separate enhancement for API error handling. I am not sure if any issues exist with that. You can create an issue with relevant data/screenshots etc.

Ahh. Yes I see good point!

@mananjadhav

Sorry for the delay on this, @mananjadhav your proposal looks good, could you implement the change on the PasswordForm as well? Regarding the Please fill out all fields issue, I think #4856 will cover that one so for this issue let's just focus on the error translations. I've invited you to the Upwork job, once you accept feel free to start on the PR and I'll assign you.

@anthony-hull I agree that the issue you pointed out is important, and I think we should handle it separately so we can standardize some way of doing that across the app. There is some discussion relating to that in this slack thread so I'd have a look there!

@Jag96

@Jag96 Sure. I’ll take care of both the issues. Thanks.

Fix has been on production for 7 days without regression, paid + bonus!

Navigation Menu

Repository navigation

[HOLD for payment + bonus] Password error translation not updated on Language change #4663

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platform:

27 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

[HOLD for payment + bonus] Password error translation not updated on Language change #4663

Description

Action Performed:

Expected Result:

Actual Result:

Workaround:

Platform:

Activity

MelvinBot commented on Aug 14, 2021

mananjadhav commented on Aug 14, 2021

mananjadhav commented on Aug 14, 2021

MelvinBot commented on Aug 16, 2021

27 remaining items

mananjadhav commented on Aug 24, 2021

anthony-hull commented on Aug 24, 2021

Jag96 commented on Aug 26, 2021

mananjadhav commented on Aug 27, 2021

Jag96 commented on Sep 8, 2021

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions