Merge pull request #85 from Element84/mparks/leaflet-editable

Adds Leaflet.Editable to Map component

package.json

@@ -1,7 +1,7 @@
 {
   "name": "fogg",
   "description": "Gatsby theme for mapping!",
-  "version": "0.5.0",
+  "version": "0.5.1-0",
   "author": "Element 84, Inc.",
   "publishConfig": {
     "registry": "https://registry.npmjs.com/"
@@ -27,6 +27,7 @@
     "gatsby-source-filesystem": "^4.21.0",
     "leaflet-active-area": "^1.2.1",
     "leaflet-draw": "^1.0.4",
+    "leaflet-editable": "^1.2.0",
     "memoizee": "^0.4.15",
     "mkdirp": "^1.0.4",
     "moment": "^2.29.1",

src/components/Map/Map.js

@@ -6,6 +6,7 @@ import { Map as BaseMap, LayersControl, ZoomControl } from 'react-leaflet';
 import 'proj4';
 import 'proj4leaflet';
 import 'leaflet-active-area';
+import 'leaflet-editable';
 
 import MapService from '../../models/map-service';
 import { LayersContext } from '../../context';
@@ -125,7 +126,8 @@ const Map = (props) => {
     maxZoom: maxZoom || baseMaxZoom,
     minZoom: minZoom || baseMinZoom,
     maxNativeZoom: baseMaxNativeZoom,
-    zoomControl: false
+    zoomControl: false,
+    editable: true
   };
 
   // Only set up a new CRS if one is provided, otherwise fallback to the leaflet defaults (3857)

src/components/MapPreviewDraw/MapPreviewDraw.js

@@ -92,7 +92,7 @@ const MapPreviewDraw = ({
    */
 
   function handleOnEdited ({ target } = {}) {
-    if (typeof onCreated === 'function') {
+    if (typeof onEdited === 'function') {
       onEdited(target, forwardedRef);
     }
   }
@@ -109,6 +109,7 @@ const MapPreviewDraw = ({
             onEdited={handleOnEdited}
             draw={drawOptions}
             edit={{
+              featureGroup: featureRef,
               edit: !disableEditControls,
               remove: false
             }}