import React from 'react'
import Picker, { Item } from 'react-native-picker-select'
import { FontAwesome } from "@expo/vector-icons";

interface LandmarkTypePickerProps {
    onValueChange: (value: any, index: number) => void,
    value?: any,
    items: Item[],
    placeholder?: {} | Item 
}

const LandmarkTypePicker: React.FC<LandmarkTypePickerProps> = ({items, value, onValueChange, placeholder}) => {
    return (
    <Picker
        style={{
            inputIOS: { color: 'white' },
            inputAndroid: { color: 'white', alignItems: 'center', justifyContent: 'center' },
            viewContainer: { marginVertical: 5, flex: 1, },
            iconContainer: { height: '100%', justifyContent: 'center' },
            placeholder: { color: 'white' }
        }}
        textInputProps={{ placeholderTextColor: 'white', selectionColor: 'white' }}
        
        placeholder={placeholder}
        value={value}
        onValueChange={onValueChange}
        useNativeAndroidPickerStyle={true}
        items={items}
    />)
}

export default React.memo(LandmarkTypePicker)