From 79517d22625f387c2f4a2f481960cbc3520b9d15 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:26:18 +0100 Subject: [PATCH 1/6] ensure 2FA value is reset when user resets their password --- src/libs/actions/Session/index.js | 2 +- src/pages/signin/PasswordForm.js | 9 ++++++++- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/libs/actions/Session/index.js b/src/libs/actions/Session/index.js index 89476d3a5ca3..7e7db05d8988 100644 --- a/src/libs/actions/Session/index.js +++ b/src/libs/actions/Session/index.js @@ -284,7 +284,7 @@ function signInWithShortLivedToken(accountID, email, shortLivedToken) { * User forgot the password so let's send them the link to reset their password */ function resetPassword() { - Onyx.merge(ONYXKEYS.ACCOUNT, {loading: true, forgotPassword: true}); + Onyx.merge(ONYXKEYS.ACCOUNT, {loading: true, forgotPassword: true, twoFactorAuthCode: '',}); API.ResetPassword({email: credentials.login}) .finally(() => { Onyx.merge(ONYXKEYS.ACCOUNT, {loading: false, validateCodeExpired: false}); diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js index 3f9a9abb55b7..b5caf0e41868 100755 --- a/src/pages/signin/PasswordForm.js +++ b/src/pages/signin/PasswordForm.js @@ -47,6 +47,7 @@ class PasswordForm extends React.Component { constructor(props) { super(props); this.validateAndSubmitForm = this.validateAndSubmitForm.bind(this); + this.reset = this.reset.bind(this); this.state = { formError: false, @@ -78,6 +79,11 @@ class PasswordForm extends React.Component { this.setState({password: ''}, this.input.clear); } + reset() { + this.setState({twoFactorAuthCode: ''}, this.twofainput.clear); + Session.resetPassword(); + } + /** * Check that all the form fields are valid, then trigger the submit callback */ @@ -124,7 +130,7 @@ class PasswordForm extends React.Component { @@ -137,6 +143,7 @@ class PasswordForm extends React.Component { {this.props.account.requiresTwoFactorAuth && ( this.twofainput = el} label={this.props.translate('passwordForm.twoFactorCode')} value={this.state.twoFactorAuthCode} placeholder={this.props.translate('passwordForm.requiredWhen2FAEnabled')} From 51af52ef5fc0a34fffb058417d4af2754270ca44 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:28:30 +0100 Subject: [PATCH 2/6] revert useless change --- src/libs/actions/Session/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/Session/index.js b/src/libs/actions/Session/index.js index 7e7db05d8988..89476d3a5ca3 100644 --- a/src/libs/actions/Session/index.js +++ b/src/libs/actions/Session/index.js @@ -284,7 +284,7 @@ function signInWithShortLivedToken(accountID, email, shortLivedToken) { * User forgot the password so let's send them the link to reset their password */ function resetPassword() { - Onyx.merge(ONYXKEYS.ACCOUNT, {loading: true, forgotPassword: true, twoFactorAuthCode: '',}); + Onyx.merge(ONYXKEYS.ACCOUNT, {loading: true, forgotPassword: true}); API.ResetPassword({email: credentials.login}) .finally(() => { Onyx.merge(ONYXKEYS.ACCOUNT, {loading: false, validateCodeExpired: false}); From ca11a338ebffb3d6d118c2c3fc51950111871347 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:30:40 +0100 Subject: [PATCH 3/6] refactor input field ref, as there are now two input refs --- src/pages/signin/PasswordForm.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js index b5caf0e41868..10691bfcb53d 100755 --- a/src/pages/signin/PasswordForm.js +++ b/src/pages/signin/PasswordForm.js @@ -57,15 +57,15 @@ class PasswordForm extends React.Component { } componentDidMount() { - if (!canFocusInputOnScreenFocus() || !this.input || !this.props.isVisible) { + if (!canFocusInputOnScreenFocus() || !this.inputPassword || !this.props.isVisible) { return; } - this.input.focus(); + this.inputPassword.focus(); } componentDidUpdate(prevProps) { if (!prevProps.isVisible && this.props.isVisible) { - this.input.focus(); + this.inputPassword.focus(); } if (prevProps.isVisible && !this.props.isVisible && this.state.password) { this.clearPassword(); @@ -76,7 +76,7 @@ class PasswordForm extends React.Component { * Clear Password from the state */ clearPassword() { - this.setState({password: ''}, this.input.clear); + this.setState({password: ''}, this.inputPassword.clear); } reset() { @@ -115,7 +115,7 @@ class PasswordForm extends React.Component { <> this.input = el} + ref={el => this.inputPassword = el} label={this.props.translate('common.password')} secureTextEntry autoCompleteType={ComponentUtils.PASSWORD_AUTOCOMPLETE_TYPE} From 5f69895d25b853152ebfbdffabd37d786202e9d0 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:31:30 +0100 Subject: [PATCH 4/6] give the 2FA input field ref a better name --- src/pages/signin/PasswordForm.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js index 10691bfcb53d..15340fd5f08a 100755 --- a/src/pages/signin/PasswordForm.js +++ b/src/pages/signin/PasswordForm.js @@ -80,7 +80,7 @@ class PasswordForm extends React.Component { } reset() { - this.setState({twoFactorAuthCode: ''}, this.twofainput.clear); + this.setState({twoFactorAuthCode: ''}, this.input2FA.clear); Session.resetPassword(); } @@ -143,7 +143,7 @@ class PasswordForm extends React.Component { {this.props.account.requiresTwoFactorAuth && ( this.twofainput = el} + ref={el => this.input2FA = el} label={this.props.translate('passwordForm.twoFactorCode')} value={this.state.twoFactorAuthCode} placeholder={this.props.translate('passwordForm.requiredWhen2FAEnabled')} From f0e51b2825bcca93b304d84a34b792a510f69f52 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:34:00 +0100 Subject: [PATCH 5/6] improve the function name for reset password, and document function --- src/pages/signin/PasswordForm.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js index 15340fd5f08a..f023a7dac8b4 100755 --- a/src/pages/signin/PasswordForm.js +++ b/src/pages/signin/PasswordForm.js @@ -47,7 +47,7 @@ class PasswordForm extends React.Component { constructor(props) { super(props); this.validateAndSubmitForm = this.validateAndSubmitForm.bind(this); - this.reset = this.reset.bind(this); + this.resetPassword = this.resetPassword.bind(this); this.state = { formError: false, @@ -79,7 +79,10 @@ class PasswordForm extends React.Component { this.setState({password: ''}, this.inputPassword.clear); } - reset() { + /** + * Trigger the reset password flow and ensure the 2FA input field is reset to avoid it being permanently hidden + */ + resetPassword() { this.setState({twoFactorAuthCode: ''}, this.input2FA.clear); Session.resetPassword(); } From 424fbcac372dc2b311e92530695829cbd7b5c6e9 Mon Sep 17 00:00:00 2001 From: Jules Rosser Date: Wed, 27 Apr 2022 16:40:32 +0100 Subject: [PATCH 6/6] fix reset password callback function name --- src/pages/signin/PasswordForm.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/signin/PasswordForm.js b/src/pages/signin/PasswordForm.js index f023a7dac8b4..430de26a1829 100755 --- a/src/pages/signin/PasswordForm.js +++ b/src/pages/signin/PasswordForm.js @@ -133,7 +133,7 @@ class PasswordForm extends React.Component {