Add support for Polygon type (#759)

* Add support for Polygon type

* Edit empty cell, add support for ‘Add a new column’

* Check for edits

Author: madsb

src/components/BrowserCell/BrowserCell.react.js

@@ -75,6 +75,8 @@ let BrowserCell = ({ type, value, hidden, width, current, onSelect, onEditChange
     content = pieces.join(', ');
   } else if (type === 'GeoPoint') {
     content = `(${value.latitude}, ${value.longitude})`;
+  } else if (type === 'Polygon') {
+    content = value.coordinates.map(coord => `(${coord})`)
   } else if (type === 'Relation') {
     content = (
       <div style={{ textAlign: 'center', cursor: 'pointer' }}>

src/dashboard/Data/Browser/Editor.react.js

@@ -43,6 +43,40 @@ let Editor = ({ top, left, type, targetClass, value, readonly, width, onCommit }
         width={width}
         onCommit={encodeCommit} />
     );
+  } else if (type === 'Polygon') {
+    let encodeCommit = (json) => {
+      try {
+        let coordinates = JSON.parse(json);
+        if (coordinates.length < 3) {
+          throw 'Polygon must have at least 3 coordinates';
+        }
+        if (value && value.coordinates && value.coordinates.length === coordinates.length) {
+          let dirty = coordinates.some((coord, index) => {
+            if (value.coordinates[index][0] !== coord[0] || value.coordinates[index][1] !== coord[1]) {
+              return true;
+            }
+          });
+          if (!dirty) {
+            throw 'No change in coordinates';
+          }
+        }
+        let obj = {
+          '__type': 'Polygon',
+          coordinates
+        }
+        onCommit(obj);
+      } catch (e) {
+        onCommit(value);
+      }
+    }
+    content = (
+      <StringEditor
+        value={JSON.stringify(value && value.coordinates || [['lat', 'lon']], null, 2)}
+        resizable={true}
+        multiline={true}
+        width={width}
+        onCommit={encodeCommit} />
+    );
   } else if (type === 'Date') {
     if (readonly) {
       content = (

src/lib/Constants.js

@@ -71,6 +71,7 @@ export const DataTypes = [
   'Object',
   'Array',
   'GeoPoint',
+  'Polygon',
   'File',
   'Pointer',
   'Relation',