import React, { useEffect, useState } from 'react';
import { View } from 'react-native';
import MapView from 'react-native-maps';
import Geolocation from '@react-native-community/geolocation';
import Search from '../search';

export function Map(props: Props) {
    const [region, setRegion] = useState(null)

    useEffect(() => {
        Geolocation.getCurrentPosition(
            ({ coords: { latitude, longitude } }) => {
                setRegion({
                    region: {
                        latitude,
                        longitude,
                        latitudeDelta: 0.0143,
                        longitudeDelta: 0.0134
                    }
                })
            },//sucesso
            () => { }, //erro
            {
                timeout: 2000,//espera encontrar a localizacao em ate 2 segundos se nao cai em erro
                enableHighAccuracy: true,//Para pegar a localizacao via gps
                maximumAge: 1000, //especie de cache que salva a localizacao
            }
        );
    }, [])

    return (
        <View style={{ flex: 1 }}>
            <MapView
                style={{ flex: 1 }}
                region={region}
                showsUserLocation //Poem um icone onde usuario esta
                loadingEnabled //Poem um active mostrando que esta carrregando
            />
            <Search></Search>
        </View>
    );
}