import React from 'react';
import { FlatList } from 'react-native';
import PropTypes from 'prop-types';
import { CountryPropTypes } from './';
import ListItem from './listItem';
import { Divider } from './styled';
const List = props => {
    const { data = [], onSelect } = props;
    return (<FlatList data={data} renderItem={({ item }) => <ListItem item={item} onPress={onSelect}/>} keyExtractor={item => item.country} 
    // TODO: make a separator styled component
    ItemSeparatorComponent={Divider}/>);
};
List.propTypes = {
    data: PropTypes.arrayOf(PropTypes.shape(CountryPropTypes).isRequired),
    onSelect: PropTypes.func,
};
List.defaultProps = {
    data: [],
    onSelect: () => { },
};
export default List;
