import React, { Component } from "react";
import { TextInput, TouchableWithoutFeedback, Keyboard, ImageBackground, Image, View } from "react-native";
import firebase from "firebase";
import { Picker } from "@react-native-picker/picker";

import { styles } from "../config/styles";
import CustomButton from "../components/CustomButton";


export default class AvailabilityScreen extends Component {
    constructor(props) {
        super(props);
        this.state = {
            face_to_face: false,
            online: false,
            multiple: false,
            one_on_one: false,
            spanish: false,
            english: false,
            language: 0,
        };
    };

    render() {  
        return (
            <View style={styles.regcontainer}>
                <Picker style={styles.picker} selectedValue={this.state.language} onValueChange={(itemValue,itemIndex) => {
                    this.setState({language: itemValue})
                    if(itemValue === 0){
                        this.setState({english: true, spanish: false});
                    }
                    else if(itemValue === 1){
                        this.setState({english: false, spanish: true});
                    }
                    else{
                        this.setState({english: true, spanish: true});
                    }}}>
                        <Picker.Item label="English" value={0}/>
                        <Picker.Item label="Spanish" value={1}/>
                        <Picker.Item label="Both" value={2}/>
                    </Picker>
            </View>
        );
    }
}