Remove custom map styles.

Author: alexsegura

src/components/TasksMapView.tsx

@@ -5,7 +5,7 @@ import React, {
   useRef,
   useState,
 } from 'react';
-import { View, useColorScheme } from 'react-native';
+import { View } from 'react-native';
 import MapView, { Marker, Region } from 'react-native-maps';
 import { connect, useSelector } from 'react-redux';
 import { withTranslation } from 'react-i18next';
@@ -25,7 +25,6 @@ import {
   BottomSheetContext,
 } from '@/components/ui/bottomsheet';
 import TasksBottomSheetContent from './TasksBottomSheetContent';
-import { darkMapStyle, lightMapStyle } from "../styles/mapStyles"
 import TaskListPolylines from './TaskListPolylines';
 
 function TasksMapView(props) {
@@ -37,7 +36,6 @@ function TasksMapView(props) {
     uiFilters,
     tasksEntities,
     isHideUnassignedFromMap,
-    mode = 'system',
   } = props;
 
   const [marginBottom, setMarginBottom] = useState(1);
@@ -51,15 +49,6 @@ function TasksMapView(props) {
   const { handleOpen } = useContext(BottomSheetContext || {});
   const [modalMarkers, setModalMarkers] = useState([]);
 
-
-  const colorScheme = useColorScheme();
-
-  const activeMode = mode === 'system' ? colorScheme : mode;
-
-  const mapStyle = useMemo(() => {
-    return activeMode === 'dark' ? darkMapStyle : lightMapStyle;
-  }, [activeMode]);
-
   const onMarkerPress = useCallback(
     (tasksAtLocation) => {
       setModalMarkers(tasksAtLocation);
@@ -155,7 +144,6 @@ function TasksMapView(props) {
             // We use a key prop to force the map to re-render, and cleanup markers/polylines.
             key={mapKey}
             onRegionChangeComplete={onRegionChangeComplete}
-            customMapStyle={mapStyle}
             ref={mapRef}
             style={{ flex: 1, marginBottom }}
             initialRegion={mapRegion || {

src/navigation/task/components/MiniMap.tsx

@@ -1,11 +1,10 @@
-import React, { useMemo } from 'react';
-import { LayoutChangeEvent, StyleSheet, useColorScheme } from 'react-native';
+import React from 'react';
+import { LayoutChangeEvent, StyleSheet } from 'react-native';
 import MapView, { Marker, Polyline } from 'react-native-maps';
 import TaskMarker from '../../../components/TaskMarker';
 import { getCoordinates, getRegionForTasks } from './mapUtils';
 import Task from '../../../types/task';
 import Tasks from '../../../types/tasks';
-import { darkMapStyle, lightMapStyle } from "../../../styles/mapStyles"
 
 const zoomLevel = 15;
 
@@ -21,20 +20,9 @@ const MiniMap: React.FC<MiniMapProps> = ({
   tasks,
   onLayout,
   aspectRatio,
-  mode = 'system',
 }) => {
-  // @see https://stackoverflow.com/questions/46568465/convert-a-region-latitudedelta-longitudedelta-into-an-approximate-zoomlevel/
-  const systemScheme = useColorScheme();
-
-  const activeMode = useMemo(() => {
-    if (mode === 'system') return systemScheme ?? 'light';
-    return mode;
-  }, [mode, systemScheme]);
-
-  const mapStyle = useMemo(() => {
-    return activeMode === 'dark' ? darkMapStyle : lightMapStyle;
-  }, [activeMode]);
 
+  // @see https://stackoverflow.com/questions/46568465/convert-a-region-latitudedelta-longitudedelta-into-an-approximate-zoomlevel/
   const region = getRegionForTasks(
     task ? [task] : tasks,
     zoomLevel,
@@ -64,7 +52,6 @@ const MiniMap: React.FC<MiniMapProps> = ({
 
   return (
     <MapView
-      customMapStyle={mapStyle}
       style={styles.map}
       zoomEnabled
       showsUserLocation