updates

frontend/src/components/Maps/PropertyMap.js

@@ -61,6 +61,8 @@ const PropertyMap = ({
   onSectionUpdate,
   onSectionDelete,
   onPropertyUpdate,
+  onSectionClick,
+  selectedSections = [],
   editable = false,
   className = "h-96 w-full"
 }) => {
@@ -136,7 +138,13 @@ const PropertyMap = ({
 
   // Handle section click
   const handleSectionClick = (section) => {
-    setSelectedSection(selectedSection?.id === section.id ? null : section);
+    if (onSectionClick) {
+      // For application planning mode - use the provided callback
+      onSectionClick(section);
+    } else {
+      // For editing mode - use the internal state
+      setSelectedSection(selectedSection?.id === section.id ? null : section);
+    }
   };
 
   // Delete selected section
@@ -350,18 +358,20 @@ const PropertyMap = ({
           if (!section.polygonData?.coordinates?.[0]) return null;
           
           const coordinates = section.polygonData.coordinates[0].map(([lng, lat]) => [lat, lng]);
-          const isSelected = selectedSection?.id === section.id;
+          const isInternallySelected = selectedSection?.id === section.id;
+          const isExternallySelected = selectedSections.includes(section.id);
+          const isSelected = isInternallySelected || isExternallySelected;
           
           return (
             <Polygon
               key={section.id}
               positions={coordinates}
               pathOptions={{
-                fillColor: getSectionColor(section),
-                fillOpacity: isSelected ? 0.6 : 0.4,
-                color: getSectionColor(section),
-                weight: isSelected ? 3 : 2,
-                opacity: isSelected ? 1 : 0.8,
+                fillColor: isExternallySelected ? '#10b981' : getSectionColor(section),
+                fillOpacity: isSelected ? 0.7 : 0.4,
+                color: isExternallySelected ? '#059669' : getSectionColor(section),
+                weight: isSelected ? 4 : 2,
+                opacity: 1,
               }}
               eventHandlers={{
                 click: () => handleSectionClick(section)