Attempt n°2 to solve the problem of markers not being updated on the map as data is entered.

src/app/components/map/OpenStreetMap.js

@@ -39,6 +39,7 @@ export default function OpenStreetMap({
   markersList,
   clickListener,
   moveEndListener,
+  focusChanged,
 }) {
   const [mapRef, setMapRef] = useState(null);
   const webviewContent = html_content;
@@ -59,7 +60,7 @@ export default function OpenStreetMap({
       markersList.forEach((val, key) => {
         insertMarker(mapRef, val.ID, val.coordinate, val.image);
       });
-  }, [markersList])
+  }, [markersList, focusChanged])
 
   return (
     <View flex={1}>

src/app/screens/MapFeedScreen.js

@@ -1,33 +1,20 @@
-import React, { useState, useEffect, useContext } from "react";
-import { StyleSheet, Text, View } from "react-native";
+import React, { useEffect, useContext } from "react";
+import { StyleSheet, View } from "react-native";
 import OpenStreetMap from "../components/map/OpenStreetMap";
 import { CurrentLocationContext } from "../context/CurrentLocationContext";
 import attachFocusToQuery from "../hooks/useFocus";
 import {MapMarkerList} from "../components/MapMarkerList";
 
 export default function MapFeedScreen() {
-  const [position, setPosition] = useState(null);
-
-  const context = useContext(CurrentLocationContext);
-  const location = context.currentCoordinates;
   const focusChanged = attachFocusToQuery();
 
 
-  useEffect(() => {
-    setPosition({
-      lat: location["latitude"],
-      long: location["longitude"],
-      zoom: 16.5,
-    });
-  }, [location]);
-
-
   return (
     <View style={styles.container}>
       <OpenStreetMap
         markersList={MapMarkerList({reload:focusChanged, renderRain:true})}
-        // animateToPosition={position}
         centerUserLocation={true}
+        focusChanged={focusChanged}
       />
 
     </View>