export default class LoginLayout extends Component {
    constructor(props) {
        super(props);
        this.state = {
          username: '',
          password: ''
        };
      }


    render() {
        return (
            <View style={styles.formContainer}>
                <LoginInput placeholder='Username'
                            iconName={'user-circle'}
                            iconSource={'FontAwesome'}
                            secureTextEntry={false}
                            onChangeText={this.onChangeUsername}
                            onSubmitEditing={() => this.passwordInput.focus()}
                            autoCorrect={false}
                            autoCapitalize="none"
                            returnKeyType='next' />

                <LoginInput placeholder='Password'
                            iconName={'lock'}
                            iconSource={'FontAwesome'}
                            secureTextEntry={true}
                            onChangeText={this.onChangeUsername}
                            onSubmitEditing={() => this.onSubmit}
                            autoCorrect={false}
                            autoCapitalize="none"
                            returnKeyType='done'
                            passRef={ref => this.passwordInput = ref}
                             />
                            {/*
              <TouchableOpacity style={this.state.disabled ? styles.buttonContainerDisabled : styles.buttonContainer} onPress={this.onSubmit} disabled={this.props.loggingIn}>
                    <Text style={styles.buttonText}>LOGIN</Text>
                </TouchableOpacity>  */}
            </View>
        );
    }

    onChangeUsername = (text) => this.setState({username: text})
    onChangePassword = (text) => this.setState({password: text})

    focusPassword = () => this.passwordInput.focus()
    setRef = (input) => this.passwordInput = input

     onSubmit = () => {

        this.props.login(this.state.username, this.state.password)

    //     //dispatch the prelogin action to update the "isLoggingIn/isFetching"
    //     //display loading wheel while waiting for API call
    //     //when api data fetched dispatch its result and stop loading


    //     //this.props.navigate('App');
       };
}