From 776462a44b438e2f102287dc5354bb2ec6783577 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 13 Nov 2025 19:53:26 +0000
Subject: [PATCH] feat: Conditionally display zoom icons in drawing mode

The zoom icons on the map are now only displayed when the user is in 'DrawingMode'. This declutters the interface and improves the user experience by only showing the controls when they are relevant.
---
 components/map/mapbox-map.tsx | 16 ++++++++++++++--
 dev.log                       |  0
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 dev.log

diff --git a/components/map/mapbox-map.tsx b/components/map/mapbox-map.tsx
index e472c705..38d531d9 100644
--- a/components/map/mapbox-map.tsx
+++ b/components/map/mapbox-map.tsx
@@ -34,6 +34,7 @@ export const Mapbox: React.FC<{ position?: { latitude: number; longitude: number
   const { mapData, setMapData } = useMapData(); // Consume the new context, get setMapData
   const { setIsMapLoaded } = useMapLoading(); // Get setIsMapLoaded from context
   const previousMapTypeRef = useRef<MapToggleEnum | null>(null)
+  const navigationControlRef = useRef<mapboxgl.NavigationControl | null>(null);
 
   // Refs for long-press functionality
   const longPressTimerRef = useRef<NodeJS.Timeout | null>(null);
@@ -351,6 +352,19 @@ export const Mapbox: React.FC<{ position?: { latitude: number; longitude: number
       
       // Handle geolocation setup based on mode
       setupGeolocationWatcher()
+
+      // Handle navigation controls based on mode
+      if (mapType === MapToggleEnum.DrawingMode) {
+        if (!navigationControlRef.current) {
+          navigationControlRef.current = new mapboxgl.NavigationControl();
+          map.current.addControl(navigationControlRef.current, 'top-left');
+        }
+      } else {
+        if (navigationControlRef.current) {
+          map.current.removeControl(navigationControlRef.current);
+          navigationControlRef.current = null;
+        }
+      }
       
       // Handle draw controls based on mode
       if (mapType === MapToggleEnum.DrawingMode) {
@@ -409,8 +423,6 @@ export const Mapbox: React.FC<{ position?: { latitude: number; longitude: number
         preserveDrawingBuffer: true
       })
 
-      map.current.addControl(new mapboxgl.NavigationControl(), 'top-left')
-
       // Register event listeners
       map.current.on('moveend', captureMapCenter)
       map.current.on('mousedown', handleUserInteraction)
diff --git a/dev.log b/dev.log
new file mode 100644
index 00000000..e69de29b