fix(aws-amplify-react): change to forgetpassword state if need to reset password

Author: powerful23

packages/aws-amplify-react/src/Auth/AuthPiece.jsx

@@ -81,6 +81,7 @@ export default class AuthPiece extends Component {
     render() {
         if (!this._validAuthStates.includes(this.props.authState)) {
             this._isHidden = true;
+            this.inputs = {};
             return null;
         }
 

packages/aws-amplify-react/src/Auth/ForgotPassword.jsx

@@ -47,7 +47,8 @@ export default class ForgotPassword extends AuthPiece {
     }
 
     send() {
-        const { username } = this.inputs;
+        const { authData={} } = this.props;
+        const username = this.inputs.username || authData.username;
         if (!Auth || typeof Auth.forgotPassword !== 'function') {
             throw new Error('No Auth module found, please ensure @aws-amplify/auth is imported');
         }
@@ -60,7 +61,10 @@ export default class ForgotPassword extends AuthPiece {
     }
 
     submit() {
-        const { username, code, password } = this.inputs;
+        const { authData={} } = this.props;
+        const { code, password } = this.inputs;
+        const username = this.inputs.username || authData.username;
+        
         if (!Auth || typeof Auth.forgotPasswordSubmit !== 'function') {
             throw new Error('No Auth module found, please ensure @aws-amplify/auth is imported');
         }
@@ -117,24 +121,24 @@ export default class ForgotPassword extends AuthPiece {
     }
 
     showComponent(theme) {
-        const { authState, hide } = this.props;
+        const { authState, hide, authData={} } = this.props;
         if (hide && hide.includes(ForgotPassword)) { return null; }
 
         return (
             <FormSection theme={theme}>
                 <SectionHeader theme={theme}>{I18n.get('Reset your password')}</SectionHeader>
                 <SectionBody>
-                    { this.state.delivery? this.submitView() : this.sendView() }
+                    { this.state.delivery || authData.username ? this.submitView() : this.sendView() }
                 </SectionBody>
                 <SectionFooter theme={theme}>
                     <SectionFooterPrimaryContent theme={theme}>
-                        { this.state.delivery ? 
+                        { this.state.delivery || authData.username ? 
                             <Button theme={theme} onClick={this.submit}>{I18n.get('Submit')}</Button> :
                             <Button theme={theme} onClick={this.send}>{I18n.get('Send Code')}</Button>
                         }
                     </SectionFooterPrimaryContent>
                     <SectionFooterSecondaryContent theme={theme}>
-                        { this.state.delivery ?
+                        { this.state.delivery || authData.username ?
                             <Link theme={theme} onClick={this.send}>{I18n.get('Resend Code')}</Link> :
                             <Link theme={theme} onClick={() => this.changeState('signIn')}>{I18n.get('Back to Sign In')}</Link>
                         }

packages/aws-amplify-react/src/Auth/SignIn.jsx

@@ -108,7 +108,7 @@ export default class SignIn extends AuthPiece {
                 }
                 else if (err.code === 'PasswordResetRequiredException') {
                     logger.debug('the user requires a new password');
-                    this.changeState('requireNewPassword', { username });
+                    this.changeState('forgotPassword', { username });
                 } else {
                     this.error(err);
                 }