diff --git a/src/Components/Map/Subcomponents/Controls/LocateControl.tsx b/src/Components/Map/Subcomponents/Controls/LocateControl.tsx index be537ff8..08949961 100644 --- a/src/Components/Map/Subcomponents/Controls/LocateControl.tsx +++ b/src/Components/Map/Subcomponents/Controls/LocateControl.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import * as L from 'leaflet' -import { useMap } from 'react-leaflet' +import { useMap, useMapEvents } from 'react-leaflet' import 'leaflet.locatecontrol' import 'leaflet.locatecontrol/dist/L.Control.Locate.css' @@ -28,23 +28,31 @@ export const LocateControl = () => { } }, []) - return (<> -
+ useMapEvents({ + locationfound: () => { + setLoading(false); + setActive(true); + }, + }) -
{ + return (<> +
+ +
{ if (active) { lc.stop(); setActive(false); } else { lc.start(); - setActive(true); + setLoading(true); } - }}> - - - + }}>{loading ? : + + + } +
) diff --git a/src/Components/Map/UtopiaMap.tsx b/src/Components/Map/UtopiaMap.tsx index 8b714538..e4c93448 100644 --- a/src/Components/Map/UtopiaMap.tsx +++ b/src/Components/Map/UtopiaMap.tsx @@ -20,7 +20,6 @@ import { QuestControl } from "./Subcomponents/Controls/QuestControl"; import { Control } from "./Subcomponents/Controls/Control"; import { Outlet } from "react-router-dom"; import { TagsControl } from "./Subcomponents/Controls/TagsControl"; -import { LocateControl } from "./Subcomponents/Controls/LocateControl"; export interface MapEventListenerProps {