Prototype envoi géolocalisations

client/components/GeolocationProvider.tsx

@@ -0,0 +1,32 @@
+import { ReactNode, useEffect } from 'react'
+import { useAuth } from '@/hooks/useAuth'
+import { useQueuedLocations, useUnqueueLocation } from '@/hooks/useLocation'
+import { useGeolocationMutation } from '@/hooks/mutations/useGeolocationMutation'
+import { useStartGeolocationServiceEffect } from '@/utils/geolocation'
+
+export default function GeolocationProvider({ children }: { children: ReactNode }) {
+  useStartGeolocationServiceEffect()
+
+  const auth = useAuth()
+  const geolocationsQueue = useQueuedLocations()
+  const unqueueLocation = useUnqueueLocation()
+  const geolocationMutation = useGeolocationMutation({
+    auth,
+    onPostSuccess: ({ data, variables: location }) => {
+      unqueueLocation(location)
+      geolocationMutation.reset()
+    },
+    onError: ({ response, error }) => { console.error(response, error) }
+  })
+  
+    useEffect(() => {
+    if (geolocationsQueue.length === 0 || geolocationMutation.isPending)
+      return
+    const locToSend = geolocationsQueue[0]
+    geolocationMutation.mutate(locToSend)
+  }, [auth, geolocationsQueue])
+
+  return <>
+    {children}
+  </>
+}

client/components/Map.tsx

@@ -2,10 +2,10 @@ import { StyleSheet } from 'react-native'
 import MapLibreGL, { Camera, FillLayer, LineLayer, MapView, PointAnnotation, RasterLayer, RasterSource, ShapeSource, UserLocation } from '@maplibre/maplibre-react-native'
 import { FontAwesome5 } from '@expo/vector-icons'
 import { circle } from '@turf/circle'
-import { useLocation } from '@/hooks/useLocation'
+import { useLastOwnLocation } from '@/hooks/useLocation'
 
 export default function Map() {
-  const userLocation = useLocation()
+  const userLocation = useLastOwnLocation()
   MapLibreGL.setAccessToken(null)
   const accuracyCircle = circle([userLocation?.coords.longitude ?? 0, userLocation?.coords.latitude ?? 0], userLocation?.coords.accuracy ?? 0, {steps: 64, units: 'meters'})
   return (

client/components/Map.web.tsx

@@ -1,4 +1,4 @@
-import { useLocation } from "@/hooks/useLocation"
+import { useLastOwnLocation } from "@/hooks/useLocation"
 import { circle } from "@turf/circle"
 import { type Map as MaplibreGLMap } from "maplibre-gl"
 import { RLayer, RMap, RMarker, RNavigationControl, RSource, useMap } from "maplibre-react-components"
@@ -21,7 +21,7 @@ export default function Map() {
 }
 
 function UserLocation() {
-  const userLocation = useLocation()
+  const userLocation = useLastOwnLocation()
   const [firstUserPositionFetched, setFirstUserPositionFetched] = useState(false)
   const map: MaplibreGLMap = useMap()
   if (userLocation != null && !firstUserPositionFetched) {