text: /*
   *   Copyright 2018 Amazon.com, Inc. or its affiliates. All Rights Reserved.
  
   *  Licensed under the Apache License, Version 2.0 (the "License").
   *  You may not use this file except in compliance with the License.
   *  A copy of the License is located at
   *
   *      http://www.apache.org/licenses/LICENSE-2.0
   *
   *  or in the "license" file accompanying this file. This file is distributed
   *  on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either
   *  express or implied. See the License for the specific language governing
   *  permissions and limitations under the License.
   */
  import React from 'react';
  import { Auth } from 'aws-amplify';
  import DynamicImage from '../components/DynamicImage';
  import { withRouter } from 'react-router-dom';
  import SiteNav from '../components/SiteNav';
  
  import '../css/app.css';
  
  /**
   * Sign-in Page
   */
  class SignIn extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        stage: 0,
        email: '',
        password: '',
        code: '',
        userObject: null
      };
    }
  
    async onSubmitForm(e) {
      e.preventDefault();
      console.log('Form Submitted');
      this.setState({ stage: 1 });
    }
  
    async onSubmitVerification(e) {
      e.preventDefault();
      console.log('Verification Submitted');
      this.setState({ stage: 0, email: '', password: '', code: '' });
      // Go back home
      this.props.history.replace('/');
    }
  
    onEmailChanged(e) {
      this.setState({ email: e.target.value.toLowerCase() });
    }
  
    onPasswordChanged(e) {
      this.setState({ password: e.target.value });
    }
  
    onCodeChanged(e) {
      this.setState({ code: e.target.value });
    }
  
    isValidEmail(email) {
      var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
      return re.test(String(email).toLowerCase());
    }
  
    renderSignIn() {
      const isValidEmail = this.isValidEmail(this.state.email);
      const isValidPassword = this.state.password.length > 1;
  
      return (
        <div className="app">
          <header>
            <DynamicImage src="logo.png"/>
          </header>
          <section className="form-wrap">
            <h1>Sign in</h1>
            <SiteNav/>
            <form id="registrationForm" onSubmit={(e) => this.onSubmitForm(e)}>
              <input className={isValidEmail?'valid':'invalid'} type="email" placeholder="Email" value={this.state.email} onChange={(e) => this.onEmailChanged(e)}/>
              <input className={isValidPassword?'valid':'invalid'} type="password" placeholder="Password" value={this.state.password} onChange={(e) => this.onPasswordChanged(e)}/>
              <input disabled={!(isValidEmail && isValidPassword)} type="submit" value="Let's Ryde"/>
            </form>
          </section>
        </div>
      );
    }
  
    renderConfirm() {
      const isValidEmail = this.isValidEmail(this.state.email);
      const isValidCode = this.state.code.length === 6;
  
      return (
        <div className="app">
          <header>
            <DynamicImage src="logo.png"/>
          </header>
          <section className="form-wrap">
            <h1>Enter MFA Code</h1>
            <form id="verifyForm" onSubmit={(e) => this.onSubmitVerification(e)}>
              <input className={isValidEmail?'valid':'invalid'} type="email" placeholder="Email" value={this.state.email}/>
              <input className={isValidCode?'valid':'invalid'} type="text" placeholder="Verification Code" value={this.state.code} onChange={(e) => this.onCodeChanged(e)}/>
              <input disabled={!(isValidCode&&isValidEmail)} type="submit" value="Verify"/>
            </form>
          </section>
        </div>
      );
    }
  
    render() {
      switch (this.state.stage) {
        case 0:
        default:
          return this.renderSignIn();
        case 1:
          return this.renderConfirm();
      }
    }
  }
  
  export default withRouter(SignIn);
  
  