import React from "react";
import { View } from "react-native";
import { Text, List, RadioButton } from "react-native-paper";
import { SafeAreaView } from "react-native-safe-area-context";
import i18n from "../i18nMessages.js";
import Moment from 'moment';


let MenuView = ()=>{
    const [value, setValue] = React.useState('es');

    React.useEffect(()=>{
        i18n.locale = value;
        Moment.updateLocale(i18n.locale);
    }, [value])
    
    return (
        <View>
            <List.Section title="User Actions">
                <List.Item title="Settings" left={props => <List.Icon {...props} icon="settings" />}  />
                <List.Item title="Sign out" left={props => <List.Icon {...props} icon="logout" />}  />
                <List.Item title="About" left={props => <List.Icon {...props} icon="more" />} />
            </List.Section>
            <View>
                <RadioButton.Group onValueChange={newValue => setValue(newValue)} value={value}>
                    <View>
                        <Text>Español</Text>
                        <RadioButton value="es" />
                    </View>
                    <View>
                        <Text>English</Text>
                        <RadioButton value="en" />
                    </View>
                </RadioButton.Group>
            </View>
        </View>
    )
}

export default MenuView;