changed imports to remove legacy

src/maps/MapBase.tsx

@@ -33,7 +33,7 @@ import { GeometryMapping, shapeFromCoords } from "models/GeometryMapping";
 import { FeatureCollection, Feature } from "geojson";
 import DrawController from "./mapControllers/drawController";
 //import { Geometry } from "geojson";
-import Map, { MapRef, Marker, MarkerDragEvent } from "react-map-gl/mapbox-legacy";
+import Map, { MapRef, Marker, MarkerDragEvent } from "react-map-gl/mapbox";
 import { getDistanceUnit } from "utils";
 import { MapMouseEvent } from "mapbox-gl";
 import { makeStyles } from "@mui/styles";

src/maps/mapControllers/Geocoder.tsx

@@ -1,4 +1,4 @@
-import { ControlPosition, useMap } from "react-map-gl/mapbox-legacy";
+import { ControlPosition, useMap } from "react-map-gl/mapbox";
 import MapboxGeocoder, { Result } from "@mapbox/mapbox-gl-geocoder";
 import { useEffect, useState } from "react";
 

src/maps/mapControllers/drawController.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { useMap } from "react-map-gl/mapbox-legacy";
+import { useMap } from "react-map-gl/mapbox";
 import { FeatureCollection } from "geojson";
 import MapboxDraw from "@mapbox/mapbox-gl-draw";
 

src/maps/mapLayers/geoMapLayer.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { Layer, Source } from "react-map-gl/mapbox-legacy";
+import { Layer, Source } from "react-map-gl/mapbox";
 import { FeatureCollection } from "geojson";
 
 interface Props {

src/maps/mapMarkers/Markers.tsx

@@ -5,7 +5,7 @@ import { useMobile } from "hooks";
 import { clone } from "lodash";
 import { pond } from "protobuf-ts/pond";
 import React, { useCallback, useEffect, useState } from "react";
-import { Marker } from "react-map-gl/mapbox-legacy";
+import { Marker } from "react-map-gl/mapbox";
 
 //interface for markers
 export interface MarkerData {