Géolocalisation en arrière-plan

client/app.json

@@ -1,7 +1,7 @@
 {
   "expo": {
     "name": "Traintrape-moi",
-    "slug": "traintrape-moi",
+    "slug": "traintrape-moi-client",
     "version": "1.0.0",
     "orientation": "portrait",
     "icon": "./assets/images/icon.png",
@@ -34,9 +34,7 @@
           "backgroundColor": "#ffffff"
         }
       ],
-      [
+      "@maplibre/maplibre-react-native",
-        "@maplibre/maplibre-react-native"
-      ],
       [
         "expo-location",
         {
@@ -44,7 +42,8 @@
           "isIosBackgroundLocationEnabled": true,
           "locationAlwaysAndWhenInUsePermission": "Allow $(PRODUCT_NAME) to use your location."
         }
-      ]
+      ],
+      "expo-task-manager"
     ],
     "experiments": {
       "typedRoutes": true

client/app/(tabs)/_layout.tsx

@@ -6,7 +6,7 @@ import { useColorScheme } from '@/hooks/useColorScheme'
 import { FontAwesome6, MaterialIcons } from '@expo/vector-icons'
 
 export default function TabLayout() {
-  const colorScheme = useColorScheme();
+  const colorScheme = useColorScheme()
 
   return (
     <Tabs
@@ -46,5 +46,5 @@ export default function TabLayout() {
         }}
       />
     </Tabs>
-  );
+  )
 }

client/app/(tabs)/index.tsx

@@ -11,19 +11,7 @@ export default function MapScreen() {
   const [location, setLocation] = useState<Location.LocationObject | null>(null)
   const [locationAccessGranted, setLocationAccessGranted] = useState(false)
 
-  useEffect(() => {
+  
-    async function watchPosition() { 
-      let { status } = await Location.requestForegroundPermissionsAsync()
-      if (status !== 'granted') {
-        setLocationAccessGranted(false)
-        alert("Vous devez activer votre géolocalisation pour utiliser l'application.")
-        return
-      }
-      setLocationAccessGranted(true)
-      await Location.watchPositionAsync({accuracy: Location.Accuracy.BestForNavigation}, location => setLocation(location))
-    }
-    watchPosition()
-  }, [])
 
   return (
     <ThemedView style={styles.page}>

client/app/_layout.tsx

@@ -1,10 +1,69 @@
+import { Dispatch, useEffect, useState } from 'react'
 import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native'
 import { Stack } from "expo-router"
 import { useColorScheme } from '@/hooks/useColorScheme'
 import { StatusBar } from 'expo-status-bar'
+import * as Location from 'expo-location'
+import * as TaskManager from 'expo-task-manager'
+import { Platform } from 'react-native'
+
+TaskManager.defineTask("fetch-geolocation", async ({ data, error }: any) => {
+  if (error) {
+    console.error(error)
+    return
+  }
+  const { locations } = data
+  for (let location of locations) {
+    console.log(location)
+  }
+ })
+
+async function manageGelocation(setLocation: Dispatch<Location.LocationObject | null>) {
+  await Location.enableNetworkProviderAsync().catch(error => alert(error))
+  const { status: foregroundStatus } = await Location.requestForegroundPermissionsAsync()
+  if (foregroundStatus === 'granted') {
+    setLocation(await Location.getLastKnownPositionAsync())
+    const { status: backgroundStatus } = await Location.requestBackgroundPermissionsAsync()
+    if (backgroundStatus === 'granted') {
+      if (Platform.OS !== "web") {
+        if (!await Location.hasStartedLocationUpdatesAsync("fetch-geolocation")) {
+          await Location.startLocationUpdatesAsync("fetch-geolocation", {
+            accuracy: Location.Accuracy.BestForNavigation,
+            activityType: Location.ActivityType.OtherNavigation,
+            deferredUpdatesInterval: 100,
+            foregroundService: {
+              killServiceOnDestroy: false,
+              notificationBody: "Géolocalisation activée pour « Traintrape-moi »",
+              notificationTitle: "Traintrape-moi",
+              notificationColor: "#FFFF00",
+            }
+          })
+        }
+      }
+      else {
+        await Location.watchPositionAsync({accuracy: Location.Accuracy.BestForNavigation}, location_nouveau => setLocation(location_nouveau))
+      }
+    }
+    else {
+      alert("Vous devez activer votre géolocalisation en arrière-plan pour utiliser l'application.")
+    }
+  }
+  else {
+    alert("Vous devez activer votre géolocalisation pour utiliser l'application.")
+  }
+}
 
 export default function RootLayout() {
+  const [location, setLocation] = useState<Location.LocationObject | null>(null)
+  useEffect(() => {
+    manageGelocation(setLocation)
+    return () => {
+      Location.stopLocationUpdatesAsync("fetch-geolocation")
+    }
+  }, [])
+
   const colorScheme = useColorScheme()
+
   return <ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
     <Stack>
       <Stack.Screen name="(tabs)" options={{ headerShown: false }} />

client/package-lock.json

@@ -26,6 +26,7 @@
         "expo-status-bar": "~2.0.0",
         "expo-symbols": "~0.2.0",
         "expo-system-ui": "~4.0.4",
+        "expo-task-manager": "^12.0.3",
         "expo-web-browser": "~14.0.1",
         "maplibre-gl": "^4.7.1",
         "maplibre-react-components": "^0.1.9",
@@ -7838,6 +7839,19 @@
         }
       }
     },
+    "node_modules/expo-task-manager": {
+      "version": "12.0.3",
+      "resolved": "https://registry.npmjs.org/expo-task-manager/-/expo-task-manager-12.0.3.tgz",
+      "integrity": "sha512-XNbDWPqBJw9kuWrYFhpcjRBbuxMUlgiFdEUHpm7VmMqGmm86UAZTO20zSGkM0U25yIcmQgsHiEbfV9B2S84dqA==",
+      "license": "MIT",
+      "dependencies": {
+        "unimodules-app-loader": "~5.0.0"
+      },
+      "peerDependencies": {
+        "expo": "*",
+        "react-native": "*"
+      }
+    },
     "node_modules/expo-updates-interface": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/expo-updates-interface/-/expo-updates-interface-1.0.0.tgz",
@@ -15348,6 +15362,12 @@
         "node": ">=4"
       }
     },
+    "node_modules/unimodules-app-loader": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/unimodules-app-loader/-/unimodules-app-loader-5.0.0.tgz",
+      "integrity": "sha512-0Zc3u344NmlvyQBmcgnxHcQhrLeFV4hn80U6S4YwAfaexXCWmiHOzMe4+P+YhgHiRWb5lJgadr08hLbee3XTHg==",
+      "license": "MIT"
+    },
     "node_modules/union-value": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.1.tgz",

client/package.json

@@ -32,6 +32,7 @@
     "expo-status-bar": "~2.0.0",
     "expo-symbols": "~0.2.0",
     "expo-system-ui": "~4.0.4",
+    "expo-task-manager": "^12.0.3",
     "expo-web-browser": "~14.0.1",
     "maplibre-gl": "^4.7.1",
     "maplibre-react-components": "^0.1.9",