import { View, Text } from 'react-native';
import { Marker } from 'react-native-maps';
import { styles } from './styles';

const ClusterItem = ({ cluster }: { cluster: any }) => {
  return (
    <Marker
      coordinate={{
        latitude: cluster.geometry.coordinates[1],
        longitude: cluster.geometry.coordinates[0]
      }}
    >
      <View style={styles.clusterContainer}>
        <Text style={styles.text}>{cluster.properties.point_count}</Text>
      </View>
    </Marker>
  );
};

export default ClusterItem;
