import React from "react";
import { View, ImageBackground } from "react-native";
import { Text, TextInput, Button, Divider, Checkbox } from "react-native-paper";
import i18n from "../i18nMessages.js";
import { useSnapshot } from 'valtio';
import GlobalState from '../contexts/GlobalState.js';


let InviteView = ()=>{
    const gState = useSnapshot(GlobalState);
    const viewer = gState.me;
    return (
        <View style={{
            padding: 10,
            height: "100%"
        }}>
            <ImageBackground source={require("../assets/Invite.png")} 
                style={{paddingTop:10, flex:1, opacity:1}} 
                imageStyle={{resizeMode:"contain", opacity: 0.05}}
            >
                <Text style={{marginBottom:10, fontSize:20}}>{i18n.t("message.invite")}</Text>
                <TextInput
                    label={i18n.t("message.name")}
                    style={{backgroundColor:"rgba(0,0,0,0)"}}
                    value={''}
                    //onChangeText={text => setText(text)}
                />
                <TextInput
                    label={i18n.t("message.email")}
                    style={{backgroundColor:"rgba(0,0,0,0)"}}
                    value={''}
                    //onChangeText={text => setText(text)}
                />
                <Checkbox.Item label={i18n.t("message.IKnowThisPerson")} status="checked" />
                <Divider />
                <Button mode="outlined">Invite</Button>
            </ImageBackground>
        </View>
    )
}

export default InviteView;