import React, { Component } from 'react';
import {Form, FormControl, FormGroup, Button} from 'react-bootstrap';
import SignupModal from './SignupModal';
import * as config from '../../config';
import {Link} from 'react-router-dom';

import axios from 'axios';
axios.defaults.withCredentials = true;

class SignupForm extends Component {
    constructor(props) {
        super(props);
        this.state = {
            email: '',
            isModalOpen: false,
            isSignupButtonLoading: false,
            invalidEmail: false
        };
    }

    hideModal = () => {
        this.setState({isModalOpen: false});
    }

    handleEmailChange = (event) => {
        this.setState({email: event.target.value});
        if (this.state.invalidEmail) {
            this.setState({invalidEmail: false});
        }
    }

    signupSubmit = (event) => {
        event.preventDefault();
        this.setState({isSignupButtonLoading: true});

        axios.post(config.backendUrl + '/signup', {email: this.state.email})
        .then(res => {
            if (res.status === 200 && res.data === 'Signup OK') {
                this.setState({
                    isSignupButtonLoading: false,
                    isModalOpen: true,
                    email: ''
                });
            }
        })
        .catch(error => {
            if (error.response.status === 400 && error.response.data === 'Invalid univesity email') {
                this.setState({
                    isSignupButtonLoading: false,
                    invalidEmail: true
                });
                this.signupEmail.focus();
            }
            else {
                console.log(error);
            }
        })
    }

    render() {
        return (
            <div>
                Το <b>ακαδημαϊκό</b> σου email:
                <Form horizontal className="signup-form" onSubmit={this.signupSubmit}>
                    <FormGroup
                        validationState={this.state.invalidEmail ? "warning" : null}
                        ref={(input) => { this.signupForm = input; }}
                    >
                        <FormControl
                            type="text"
                            name="email"
                            autoComplete="off"
                            autoFocus
                            placeholder="example@uoa.gr"
                            ref={(input) => { this.signupEmail = input; }}
                            value={this.state.email}
                            disabled={this.state.isSignupButtonLoading}
                            onChange={this.handleEmailChange}
                        />
                    </FormGroup>
                    <Button
                        type="submit"
                        bsStyle="primary"
                        id="btn-signup"
                        disabled={this.state.isSignupButtonLoading}
                        onClick={!this.state.isSignupButtonLoading? this.signupSubmit : null}
                    >
                        {this.state.isSignupButtonLoading? 'Εγγραφή...' : 'Εγγραφή'}
                    </Button>
                    {this.state.invalidEmail ?
                        <div className="email-error">
                            <b>Υπήρξε κάποιο πρόβλημα! Χρησιμοποίησες ένα <Link to="/faq" target="_blank">έγκυρο ακαδημαϊκό</Link> email?</b>
                        </div>
                    : null}
                </Form>
                <div className="copyright text-muted" id="email-disclaimer" >Η διεύθυνση email σου θα χρησιμοποιηθεί <b>μόνο</b> για να επιβεβαιωθεί ότι είσαι φοιτητής.</div>
                <SignupModal isModalOpen={this.state.isModalOpen} hideModal={this.hideModal} />
            </div>
        );
    }
}

export default SignupForm;

@@ -1329,114 +1329,8 @@
 %3E %7B%0A
-            if (error.response.status === 400 && error.response.data === 'Invalid univesity email') %7B%0A    
     
@@ -1361,36 +1361,32 @@
                 
-   
- 
 isSignupButtonLo
@@ -1391,36 +1391,32 @@
 Loading: false,%0A
-    
                 
@@ -1438,36 +1438,32 @@
 rue%0A            
-    
 %7D);%0A            
@@ -1458,28 +1458,24 @@
             
-  
-  
 this.signupE
@@ -1492,45 +1492,8 @@
 ();%0A
-            %7D%0A            else %7B%0A    
     
@@ -1520,30 +1520,16 @@
 error);%0A
-            %7D%0A
         

Handle all errors gently in SignupForm