import React, { useRef } from 'react';
import Mapbox from '@rnmapbox/maps';
import {View} from "react-native";

Mapbox.setAccessToken('YOUR_MAPBOX_ACCESS_TOKEN');

const Map = () => {
  const camera = useRef<Mapbox.Camera>(null);
  const map = useRef<Mapbox.MapView>(null);

  const zoomLevel = 10;

  return (
    <View>
        <Mapbox.MapView
          ref={map}
          styleURL="mapbox://styles/mapbox/light-v11"
          projection={'globe'}
          logoEnabled={false}
          attributionEnabled={false}
          scaleBarEnabled={false}>
          <Mapbox.Camera ref={camera} zoomLevel={zoomLevel} animationMode={'flyTo'} animationDuration={2000} />
        </Mapbox.MapView>
    </View>
  );
};