Create a single map dataset plugin

src/client/javascripts/geospatial-map.js

@@ -172,45 +172,47 @@ export function processGeospatial(config, geospatial, index) {
   const bounds = geojson.features.length ? getBoundingBox(geojson) : undefined
   const drawPlugin = createDrawPlugin()
   const plugins = [drawPlugin]
+  const datasets = []
   const country = geospatial.dataset.country
   const mapLayers = getMapLayers(geospatial.dataset.maplayers)
 
   if (country) {
-    // Add the country bounds as a dataset plugin to show the valid area on the map
+    // Add the country bounds to the datasets array to show the valid area on the map
     // and provide feedback to the user when they add features outside of the bounds.
-    const countriesDatasetPlugin = createDatasetsPlugin({
-      datasets: [
-        {
-          id: 'invalid-area',
-          label: 'Invalid areas',
-          geojson: `${config.apiPath}/maps/countries.geojson?omit=${country}`,
-          showInKey: false,
-          showInMenu: false,
-          style: {
-            stroke: 'gray',
-            strokeWidth: 1,
-            fill: 'rgba(211,211,211,0.8)'
-          }
-        },
-        {
-          id: 'valid-area',
-          label: 'Valid areas',
-          geojson: `${config.apiPath}/maps/countries.geojson?only=${country}`,
-          showInKey: false,
-          showInMenu: false,
-          style: {
-            stroke: 'rgba(0,112,60,1)',
-            strokeWidth: 1
-          }
+    datasets.push(
+      {
+        id: 'invalid-area',
+        label: 'Invalid areas',
+        geojson: `${config.apiPath}/maps/countries.geojson?omit=${country}`,
+        showInKey: false,
+        showInMenu: false,
+        style: {
+          stroke: 'gray',
+          strokeWidth: 1,
+          fill: 'rgba(211,211,211,0.8)'
         }
-      ]
-    })
-
-    plugins.push(countriesDatasetPlugin)
+      },
+      {
+        id: 'valid-area',
+        label: 'Valid areas',
+        geojson: `${config.apiPath}/maps/countries.geojson?only=${country}`,
+        showInKey: false,
+        showInMenu: false,
+        style: {
+          stroke: 'rgba(0,112,60,1)',
+          strokeWidth: 1
+        }
+      }
+    )
   }
 
   if (mapLayers.includes('sssi')) {
-    plugins.push(createDatasetsPlugin(sssiDataset))
+    datasets.push(...sssiDataset)
+  }
+
+  // Create a map dataset plugin if there are any present
+  if (datasets.length) {
+    plugins.push(createDatasetsPlugin({ datasets }))
   }
 
   const initConfig = {

src/client/javascripts/location-map.js

@@ -423,10 +423,16 @@ export function processLocation(config, location, index) {
 
   locationInputs.after(mapContainer)
 
+  const datasets = []
   const mapLayers = getMapLayers(location.dataset.maplayers)
 
   if (mapLayers.includes('sssi')) {
-    initConfig.plugins = [createDatasetsPlugin(sssiDataset)]
+    datasets.push(...sssiDataset)
+  }
+
+  // Create a map dataset plugin if there are any present
+  if (datasets.length) {
+    initConfig.plugins = [createDatasetsPlugin({ datasets })]
   }
 
   const { map, interactPlugin } = createMap(mapId, initConfig, config)

src/client/javascripts/sssi-dataset.js

@@ -49,50 +49,47 @@ export function sssiScotlandRequestTransformer(url, { bbox }) {
   }
 }
 
-export default {
-  datasets: [
-    {
-      id: 'sssi-england',
-      label: 'Sites of Special Scientific Interest',
-      dynamicGeoJSON: {
-        url: englandWFS,
-        idProperty: 'ref_code',
-        transformRequest: sssiEnglandRequestTransformer
-      },
-      minZoom,
-      style,
-      showInKey: true,
-      showInMenu: false
+export default [
+  {
+    id: 'sssi-england',
+    label: 'Sites of Special Scientific Interest',
+    dynamicGeoJSON: {
+      url: englandWFS,
+      idProperty: 'ref_code',
+      transformRequest: sssiEnglandRequestTransformer
     },
-    {
-      id: 'sssi-wales',
-      label: 'SSSI Wales',
-      dynamicGeoJSON: {
-        url: walesWFS,
-        idProperty: 'id',
-        transformRequest: sssiWalesRequestTransformer
-      },
-      minZoom,
-      style,
-      showInKey: false,
-      showInMenu: false
+    minZoom,
+    style,
+    showInKey: true,
+    showInMenu: false
+  },
+  {
+    id: 'sssi-wales',
+    label: 'SSSI Wales',
+    dynamicGeoJSON: {
+      url: walesWFS,
+      idProperty: 'id',
+      transformRequest: sssiWalesRequestTransformer
     },
-    {
-      id: 'sssi-scotland',
-      label: 'SSSI Scotland',
-      dynamicGeoJSON: {
-        url: scotlandWFS,
-        idProperty: 'OBJECTID',
-        transformRequest: sssiScotlandRequestTransformer
-      },
-      minZoom,
-      style,
-      showInKey: false,
-      showInMenu: false
-    }
-  ]
-}
-
+    minZoom,
+    style,
+    showInKey: false,
+    showInMenu: false
+  },
+  {
+    id: 'sssi-scotland',
+    label: 'SSSI Scotland',
+    dynamicGeoJSON: {
+      url: scotlandWFS,
+      idProperty: 'OBJECTID',
+      transformRequest: sssiScotlandRequestTransformer
+    },
+    minZoom,
+    style,
+    showInKey: false,
+    showInMenu: false
+  }
+]
 /**
  * @typedef {object} TransformRequestOptions
  * @property {string[]} bbox - the bounding box coordinates