From 60cfddabe71df4e6c0b7c20c55d68703e52defb3 Mon Sep 17 00:00:00 2001
From: Kelani Tolulope <kelanik8@gmail.com>
Date: Wed, 14 Jun 2023 20:38:25 +0100
Subject: [PATCH] Fix geometry module field map if one coordinate is missing

---
 client/web/admin/src/components/CLocation.vue |  7 ++-
 .../ModuleFields/Editor/Geometry.vue          | 12 +++--
 .../ModuleFields/Viewer/Geometry.vue          |  3 +-
 .../components/PageBlocks/GeometryBase.vue    | 44 +++++++++++--------
 .../GeometryConfigurator/Configurator.vue     |  9 ----
 client/web/discovery/package.json             |  1 +
 .../discovery/src/components/DiscoveryMap.vue |  7 ++-
 client/web/privacy/package.json               |  1 +
 .../privacy/src/components/ConnectionMap.vue  |  7 ++-
 9 files changed, 56 insertions(+), 35 deletions(-)

diff --git a/client/web/admin/src/components/CLocation.vue b/client/web/admin/src/components/CLocation.vue
index 16f8b7fd8..92bd88187 100644
--- a/client/web/admin/src/components/CLocation.vue
+++ b/client/web/admin/src/components/CLocation.vue
@@ -43,6 +43,7 @@
 
 <script>
 import { latLng } from 'leaflet'
+import { isNumber } from 'lodash'
 
 export default {
   props: {
@@ -79,7 +80,11 @@ export default {
     },
 
     getLatLng (coordinates = [0, 0]) {
-      return latLng(coordinates[0], coordinates[1])
+      const [lat, lng] = coordinates
+
+      if (isNumber(lat) && isNumber(lng)) {
+        return latLng(lat, lng)
+      }
     },
 
     placeMarker ({ latlng = {} }) {
diff --git a/client/web/compose/src/components/ModuleFields/Editor/Geometry.vue b/client/web/compose/src/components/ModuleFields/Editor/Geometry.vue
index 3476b67b4..e3a985ec6 100644
--- a/client/web/compose/src/components/ModuleFields/Editor/Geometry.vue
+++ b/client/web/compose/src/components/ModuleFields/Editor/Geometry.vue
@@ -220,6 +220,7 @@ import { latLng } from 'leaflet'
 import { LControl } from 'vue2-leaflet'
 import { OpenStreetMapProvider } from 'leaflet-geosearch'
 import { components } from '@cortezaproject/corteza-vue'
+import { isNumber } from 'lodash'
 const { CInputSearch } = components
 
 export default {
@@ -294,8 +295,13 @@ export default {
   methods: {
     openMap (index) {
       this.localValueIndex = index
-      const firstCoordinates = (index ? this.localValue[index] : (this.field.isMulti ? this.localValue[0] : this.localValue)) || {}
-      this.map.center = firstCoordinates.coordinates && firstCoordinates.coordinates.length ? firstCoordinates.coordinates : this.field.options.center
+      const firstCoordinates = (index >= 0 ? this.localValue[index] : this.localValue) || {}
+      firstCoordinates.coordinates = [...firstCoordinates.coordinates]
+
+      this.map.center = firstCoordinates.coordinates &&
+                        firstCoordinates.coordinates.length === 2 &&
+                        firstCoordinates.coordinates.every(isNumber) ? firstCoordinates.coordinates : this.field.options.center
+
       this.map.zoom = index >= 0 ? 13 : this.field.options.zoom
       this.map.show = true
 
@@ -307,7 +313,7 @@ export default {
     getLatLng (coordinates = [undefined, undefined]) {
       const [lat, lng] = coordinates
 
-      if (lat && lng) {
+      if (isNumber(lat) && isNumber(lng)) {
         return latLng(lat, lng)
       }
     },
diff --git a/client/web/compose/src/components/ModuleFields/Viewer/Geometry.vue b/client/web/compose/src/components/ModuleFields/Viewer/Geometry.vue
index 58f92d7cd..f1c69cb8b 100644
--- a/client/web/compose/src/components/ModuleFields/Viewer/Geometry.vue
+++ b/client/web/compose/src/components/ModuleFields/Viewer/Geometry.vue
@@ -91,6 +91,7 @@ import { latLng } from 'leaflet'
 import { LControl } from 'vue2-leaflet'
 import { OpenStreetMapProvider } from 'leaflet-geosearch'
 import { components } from '@cortezaproject/corteza-vue'
+import { isNumber } from 'lodash'
 const { CInputSearch } = components
 
 export default {
@@ -152,7 +153,7 @@ export default {
     getLatLng (coordinates = [undefined, undefined]) {
       const [lat, lng] = coordinates
 
-      if (lat && lng) {
+      if (isNumber(lat) && isNumber(lng)) {
         return latLng(lat, lng)
       }
     },
diff --git a/client/web/compose/src/components/PageBlocks/GeometryBase.vue b/client/web/compose/src/components/PageBlocks/GeometryBase.vue
index 0b638e242..c0fc7d5ac 100644
--- a/client/web/compose/src/components/PageBlocks/GeometryBase.vue
+++ b/client/web/compose/src/components/PageBlocks/GeometryBase.vue
@@ -70,7 +70,8 @@ import { LPolygon, LControl } from 'vue2-leaflet'
 import { compose, NoID } from '@cortezaproject/corteza-js'
 import { mapGetters, mapActions } from 'vuex'
 import { evaluatePrefilter } from 'corteza-webapp-compose/src/lib/record-filter'
-import { throttle } from 'lodash'
+import { throttle, isNumber } from 'lodash'
+
 import base from './base'
 
 export default {
@@ -111,12 +112,14 @@ export default {
         geo.forEach((value) => {
           if (value.displayMarker) {
             value.markers.map(subValue => {
-              values.push({
-                value: this.getLatLng(subValue),
-                color: value.color,
-                recordID: value.recordID,
-                moduleID: value.moduleID,
-              })
+              if (this.getLatLng(subValue)) {
+                values.push({
+                  value: this.getLatLng(subValue) || {},
+                  color: value.color,
+                  recordID: value.recordID,
+                  moduleID: value.moduleID,
+                })
+              }
             })
           }
         })
@@ -208,16 +211,18 @@ export default {
                       markers = [geometry]
                     }
 
-                    return ({
-                      title: record.values[feed.titleField],
-                      geometry: feed.displayPolygon ? geometry : [],
-                      markers,
-                      color: feed.options.color,
-                      displayMarker: feed.displayMarker,
-                      recordID: record.recordID,
-                      moduleID: record.moduleID,
-                    })
-                  })
+                    if (geometry.length && geometry.length === 2) {
+                      return ({
+                        title: record.values[feed.titleField],
+                        geometry: feed.displayPolygon ? geometry : [],
+                        markers,
+                        color: feed.options.color,
+                        displayMarker: feed.displayMarker,
+                        recordID: record.recordID,
+                        moduleID: record.moduleID,
+                      })
+                    }
+                  }).filter(g => g)
                 }
               })
           })
@@ -248,13 +253,14 @@ export default {
     },
 
     parseGeometryField (value) {
-      return JSON.parse(value || '{"coordinates":[]}').coordinates || []
+      value = JSON.parse(value || '{"coordinates":[]}').coordinates || []
+      return value.every(isNumber) ? value : []
     },
 
     getLatLng (coordinates = [undefined, undefined]) {
       const [lat, lng] = coordinates
 
-      if (lat && lng) {
+      if (isNumber(lat) && isNumber(lng)) {
         return latLng(lat, lng)
       }
     },
diff --git a/client/web/compose/src/components/PageBlocks/GeometryConfigurator/Configurator.vue b/client/web/compose/src/components/PageBlocks/GeometryConfigurator/Configurator.vue
index 9d3df2ebc..287a56e21 100644
--- a/client/web/compose/src/components/PageBlocks/GeometryConfigurator/Configurator.vue
+++ b/client/web/compose/src/components/PageBlocks/GeometryConfigurator/Configurator.vue
@@ -135,7 +135,6 @@
 
 <script>
 import base from '../base'
-import { latLng } from 'leaflet'
 import { LControl } from 'vue2-leaflet'
 
 export default {
@@ -176,14 +175,6 @@ export default {
   },
 
   methods: {
-    getLatLng (coordinates = [undefined, undefined]) {
-      const [lat, lng] = coordinates
-
-      if (lat && lng) {
-        return latLng(lat, lng)
-      }
-    },
-
     updateCenter (coordinates) {
       let { lat = 0, lng = 0 } = coordinates || {}
 
diff --git a/client/web/discovery/package.json b/client/web/discovery/package.json
index 55c0982bf..64513fcd4 100644
--- a/client/web/discovery/package.json
+++ b/client/web/discovery/package.json
@@ -28,6 +28,7 @@
     "i18next": "^17.0.9",
     "i18next-browser-languagedetector": "^3.0.2",
     "leaflet": "^1.7.1",
+    "lodash": "^4.17.21",
     "portal-vue": "^2.1.7",
     "vue": "2.6.14",
     "vue-router": "^3.4.9",
diff --git a/client/web/discovery/src/components/DiscoveryMap.vue b/client/web/discovery/src/components/DiscoveryMap.vue
index 93a547559..092105bcd 100644
--- a/client/web/discovery/src/components/DiscoveryMap.vue
+++ b/client/web/discovery/src/components/DiscoveryMap.vue
@@ -20,6 +20,7 @@
 </template>
 
 <script>
+import { isNumber } from 'lodash'
 import { latLng } from 'leaflet'
 
 export default {
@@ -69,7 +70,11 @@ export default {
 
   methods: {
     getLatLng (coordinates = [0, 0]) {
-      return latLng(coordinates[0], coordinates[1])
+      const [lat, lng] = coordinates
+
+      if (isNumber(lat) && isNumber(lng)) {
+        return latLng(lat, lng)
+      }
     },
 
     onMarkerClick (ID) {
diff --git a/client/web/privacy/package.json b/client/web/privacy/package.json
index cc720fd2b..6b8637e8b 100644
--- a/client/web/privacy/package.json
+++ b/client/web/privacy/package.json
@@ -26,6 +26,7 @@
     "i18next": "^17.0.9",
     "i18next-browser-languagedetector": "^3.0.2",
     "leaflet": "^1.7.1",
+    "lodash": "^4.17.21",
     "portal-vue": "^2.1.7",
     "vue": "2.6.14",
     "vue-grid-layout": "^2.3.12",
diff --git a/client/web/privacy/src/components/ConnectionMap.vue b/client/web/privacy/src/components/ConnectionMap.vue
index e37f888b0..5dff94cbe 100644
--- a/client/web/privacy/src/components/ConnectionMap.vue
+++ b/client/web/privacy/src/components/ConnectionMap.vue
@@ -43,6 +43,7 @@
 
 <script>
 import { latLng } from 'leaflet'
+import { isNumber } from 'lodash'
 import { LMap, LTileLayer, LMarker, LTooltip } from 'vue2-leaflet'
 
 export default {
@@ -97,7 +98,11 @@ export default {
     },
 
     getLatLng (coordinates = [0, 0]) {
-      return latLng(coordinates[0], coordinates[1])
+      const [lat, lng] = coordinates
+
+      if (isNumber(lat) && isNumber(lng)) {
+        return latLng(lat, lng)
+      }
     },
   },
 }