onDidFinishLoadingStyle added

src/screens/InAppScreens/MapScreen/index.tsx

@@ -426,6 +426,8 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
   const isSmallScreen = Dimensions.get('window').width < 383;
   const processedImages = useRef(new Set<string>());
 
+  const [didFinishLoadingStyle, setDidFinishLoadingStyle] = useState(false);
+
   useEffect(() => {
     if (netInfo && netInfo.isConnected !== null) {
       setIsConnected(netInfo.isConnected);
@@ -479,11 +481,11 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
       }
     };
 
-    loadCachedIcons();
-  }, []);
+    didFinishLoadingStyle && loadCachedIcons();
+  }, [didFinishLoadingStyle]);
 
   useEffect(() => {
-    if (!seriesIcons) return;
+    if (!seriesIcons || !didFinishLoadingStyle) return;
 
     const updateCacheFromAPI = async () => {
       const loadedImages: Record<string, { uri: string }> = {};
@@ -532,7 +534,7 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
     };
 
     updateCacheFromAPI();
-  }, [seriesIcons]);
+  }, [seriesIcons, didFinishLoadingStyle]);
 
   useEffect(() => {
     const loadDatabases = async () => {
@@ -1322,6 +1324,7 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
         onRegionDidChange={handleRegionDidChange}
         onRegionIsChanging={handleMapChange}
         onRegionWillChange={_.debounce(handleMapChange, 200)}
+        onDidFinishLoadingStyle={() => setDidFinishLoadingStyle(true)}
       >
         <MapLibreRN.Images
           images={{