import React from 'react';
import {StyleSheet, View, Text} from 'react-native';
import MapView, {PROVIDER_GOOGLE, Marker, Callout} from 'react-native-maps'; // remove PROVIDER_GOOGLE import if not using Google Maps
const styles = StyleSheet.create({
  container: {
    ...StyleSheet.absoluteFillObject,
    height: '100%',
    width: '100%',
    justifyContent: 'center',
    alignItems: 'center',
  },
  map: {
    ...StyleSheet.absoluteFillObject,
    height: '100%',
    width: '100%',
  },
});

const HouseLocation = () => {
  const [marker, setMarker] = React.useState({
          latitude: 37.78825,
          longitude: -122.4324,
	});
  return (
    <View style={styles.container}>
      <MapView
        provider={PROVIDER_GOOGLE} // remove if not using Google Maps
        style={styles.map}
        initialRegion={{
          latitude: 37.78825,
          longitude: -122.4324,
          latitudeDelta: 0.015,
          longitudeDelta: 0.0121,
        }}>
        <Marker
          coordinate={marker}
          draggable={true}
					onDragEnd = {(e) => {
						setMarker({
							latitude: e.nativeEvent.coordinate.latitude,
							longitude: e.nativeEvent.coordinate.longitude,

						})
						


					}}
        >
	<Callout>
					<Text>{marker.latitude.toFixed(3)}, {marker.longitude.toFixed(3)}</Text>


				</Callout>
				</Marker>
      </MapView>
    </View>
  );
};
export default HouseLocation;