@defra/interactive-map 0.0.30-alpha → 0.0.32-alpha

package/plugins/beta/datasets/src/initialise/initialiseDatasets.test.js

@@ -0,0 +1,273 @@
+import { initialiseDatasets } from './initialiseDatasets.js'
+import { createDynamicSource } from '../fetch/createDynamicSource.js'
+import { datasetRegistry } from '../registry/datasetRegistry.js'
+
+jest.mock('../fetch/createDynamicSource.js')
+jest.mock('../registry/datasetRegistry.js', () => ({
+  datasetRegistry: {
+    attach: jest.fn(),
+    attachCreateDataset: jest.fn(),
+    forEachDataset: jest.fn(),
+    _invalidateCache: jest.fn()
+  }
+}))
+
+// ─── helpers ─────────────────────────────────────────────────────────────────
+
+const makeAdapter = (overrides = {}) => ({
+  init: jest.fn().mockResolvedValue(undefined),
+  onMapStyleChange: jest.fn(),
+  onMapSizeChange: jest.fn(),
+  setData: jest.fn(),
+  destroy: jest.fn(),
+  createDataset: jest.fn(),
+  ...overrides
+})
+
+const makeEventBus = () => {
+  const handlers = {}
+  return {
+    on: jest.fn((event, handler) => { handlers[event] = handler }),
+    off: jest.fn(),
+    emit: jest.fn(),
+    _handlers: handlers
+  }
+}
+
+const makeArgs = (overrides = {}) => {
+  const eventBus = makeEventBus()
+  return {
+    adapter: makeAdapter(),
+    pluginConfig: { datasets: [{ id: 'roads', label: 'Roads' }] },
+    pluginStateRef: {},
+    mapStyle: { layers: [] },
+    mapProvider: { map: {} },
+    events: { MAP_SET_STYLE: 'map:setStyle', MAP_SIZE_CHANGE: 'map:sizeChange' },
+    dispatch: jest.fn(),
+    eventBus,
+    ...overrides
+  }
+}
+
+beforeEach(() => {
+  jest.clearAllMocks()
+  datasetRegistry.forEachDataset.mockImplementation(() => {})
+})
+
+// ─── initialisation ──────────────────────────────────────────────────────────
+
+describe('initialiseDatasets', () => {
+  it('calls adapter.init with mapStyle', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    expect(args.adapter.init).toHaveBeenCalledWith(args.mapStyle)
+  })
+
+  it('attaches mappedDatasets to datasetRegistry', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    expect(datasetRegistry.attach).toHaveBeenCalled()
+  })
+
+  it('attaches adapter.createDataset to datasetRegistry when provided', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    expect(datasetRegistry.attachCreateDataset).toHaveBeenCalledWith(args.adapter.createDataset)
+  })
+
+  it('does not call attachCreateDataset when adapter has no createDataset', () => {
+    const args = makeArgs({ adapter: makeAdapter({ createDataset: undefined }) })
+    initialiseDatasets(args)
+    expect(datasetRegistry.attachCreateDataset).not.toHaveBeenCalled()
+  })
+
+  it('dispatches SET_GLOBAL_STATE when pluginConfig.globals is provided', () => {
+    const globals = { opacity: 0.8 }
+    const args = makeArgs({ pluginConfig: { datasets: [], globals } })
+    initialiseDatasets(args)
+    expect(args.dispatch).toHaveBeenCalledWith({ type: 'SET_GLOBAL_STATE', payload: globals })
+  })
+
+  it('does not dispatch SET_GLOBAL_STATE when pluginConfig.globals is absent', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    expect(args.dispatch).not.toHaveBeenCalledWith(expect.objectContaining({ type: 'SET_GLOBAL_STATE' }))
+  })
+
+  it('registers MAP_SET_STYLE and MAP_SIZE_CHANGE event listeners', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    expect(args.eventBus.on).toHaveBeenCalledWith('map:setStyle', expect.any(Function))
+    expect(args.eventBus.on).toHaveBeenCalledWith('map:sizeChange', expect.any(Function))
+  })
+
+  describe('after adapter.init resolves', () => {
+    it('dispatches SET_DATASETS', async () => {
+      const args = makeArgs()
+      initialiseDatasets(args)
+      await Promise.resolve() // flush microtask
+      expect(args.dispatch).toHaveBeenCalledWith(expect.objectContaining({ type: 'SET_DATASETS' }))
+    })
+
+    it('emits datasets:ready', async () => {
+      const args = makeArgs()
+      initialiseDatasets(args)
+      await Promise.resolve()
+      expect(args.eventBus.emit).toHaveBeenCalledWith('datasets:ready')
+    })
+
+    it('creates dynamic sources for datasets with dynamicGeoJSON', async () => {
+      const mockDynamicSource = { destroy: jest.fn(), refresh: jest.fn(), clear: jest.fn(), getFeatureCount: jest.fn() }
+      createDynamicSource.mockReturnValue(mockDynamicSource)
+
+      const dynamicDataset = {
+        id: 'parcels',
+        hasDynamicGeoJSON: true,
+        dynamicGeoJSON: { url: 'http://example.com/geojson', idProperty: 'id' }
+      }
+      datasetRegistry.forEachDataset.mockImplementation(cb => cb(dynamicDataset))
+
+      const args = makeArgs()
+      initialiseDatasets(args)
+      await Promise.resolve()
+
+      expect(createDynamicSource).toHaveBeenCalledWith(expect.objectContaining({
+        dynamicGeoJSON: dynamicDataset.dynamicGeoJSON,
+        map: args.mapProvider.map
+      }))
+    })
+
+    it('does not create dynamic sources for datasets without dynamicGeoJSON', async () => {
+      const nonDynamicDataset = { id: 'roads', hasDynamicGeoJSON: false }
+      datasetRegistry.forEachDataset.mockImplementation(cb => cb(nonDynamicDataset))
+
+      const args = makeArgs()
+      initialiseDatasets(args)
+      await Promise.resolve()
+
+      expect(createDynamicSource).not.toHaveBeenCalled()
+    })
+  })
+})
+
+// ─── event handlers ───────────────────────────────────────────────────────────
+
+describe('event handlers', () => {
+  it('delegates MAP_SET_STYLE to adapter.onMapStyleChange', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    const newStyle = { layers: [{ id: 'new' }] }
+    args.eventBus._handlers['map:setStyle'](newStyle)
+    expect(args.adapter.onMapStyleChange).toHaveBeenCalledWith(newStyle, expect.any(Map))
+  })
+
+  it('delegates MAP_SIZE_CHANGE to adapter.onMapSizeChange with current mapStyle', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    args.eventBus._handlers['map:sizeChange']()
+    expect(args.adapter.onMapSizeChange).toHaveBeenCalledWith(args.mapStyle)
+  })
+
+  it('uses the updated mapStyle after MAP_SET_STYLE', () => {
+    const args = makeArgs()
+    initialiseDatasets(args)
+    const newStyle = { layers: [{ id: 'updated' }] }
+    args.eventBus._handlers['map:setStyle'](newStyle)
+    args.eventBus._handlers['map:sizeChange']()
+    expect(args.adapter.onMapSizeChange).toHaveBeenCalledWith(newStyle)
+  })
+})
+
+// ─── returned API ─────────────────────────────────────────────────────────────
+
+describe('returned API', () => {
+  it('remove() unregisters event listeners and destroys adapter', () => {
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    instance.remove()
+    expect(args.eventBus.off).toHaveBeenCalledWith('map:setStyle', expect.any(Function))
+    expect(args.eventBus.off).toHaveBeenCalledWith('map:sizeChange', expect.any(Function))
+    expect(args.adapter.destroy).toHaveBeenCalled()
+  })
+
+  it('remove() destroys all dynamic sources', async () => {
+    const mockSource = { destroy: jest.fn(), refresh: jest.fn(), clear: jest.fn(), getFeatureCount: jest.fn() }
+    createDynamicSource.mockReturnValue(mockSource)
+    const mockDataset = { id: 'parcels', hasDynamicGeoJSON: true, dynamicGeoJSON: { url: 'http://x.com', idProperty: 'id' } }
+    datasetRegistry.forEachDataset.mockImplementation(cb =>
+      cb(mockDataset)
+    )
+
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    await Promise.resolve()
+    instance.remove()
+
+    expect(mockSource.destroy).toHaveBeenCalled()
+  })
+
+  it('refreshDataset() calls refresh on the matching dynamic source', async () => {
+    const mockSource = { destroy: jest.fn(), refresh: jest.fn(), clear: jest.fn(), getFeatureCount: jest.fn() }
+    createDynamicSource.mockReturnValue(mockSource)
+    const mockDataset = { id: 'parcels', hasDynamicGeoJSON: true, dynamicGeoJSON: { url: 'http://x.com', idProperty: 'id' } }
+    datasetRegistry.forEachDataset.mockImplementation(cb =>
+      cb(mockDataset)
+    )
+
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    await Promise.resolve()
+    instance.refreshDataset('parcels')
+
+    expect(mockSource.refresh).toHaveBeenCalled()
+  })
+
+  it('clearDatasetCache() calls clear on the matching dynamic source', async () => {
+    const mockSource = { destroy: jest.fn(), refresh: jest.fn(), clear: jest.fn(), getFeatureCount: jest.fn() }
+    createDynamicSource.mockReturnValue(mockSource)
+    const mockDataset = { id: 'parcels', hasDynamicGeoJSON: true, dynamicGeoJSON: { url: 'http://x.com', idProperty: 'id' } }
+    datasetRegistry.forEachDataset.mockImplementation(cb =>
+      cb(mockDataset)
+    )
+
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    await Promise.resolve()
+    instance.clearDatasetCache('parcels')
+
+    expect(mockSource.clear).toHaveBeenCalled()
+  })
+
+  it('getFeatureCount() returns the count from the matching dynamic source', async () => {
+    const mockSource = { destroy: jest.fn(), refresh: jest.fn(), clear: jest.fn(), getFeatureCount: jest.fn().mockReturnValue(42) }
+    createDynamicSource.mockReturnValue(mockSource)
+    const mockDataset = { id: 'parcels', hasDynamicGeoJSON: true, dynamicGeoJSON: { url: 'http://x.com', idProperty: 'id' } }
+    datasetRegistry.forEachDataset.mockImplementation(cb =>
+      cb(mockDataset)
+    )
+
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    await Promise.resolve()
+
+    expect(instance.getFeatureCount('parcels')).toBe(42)
+  })
+
+  it('getFeatureCount() returns null for a non-dynamic dataset', () => {
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    expect(instance.getFeatureCount('unknown')).toBeNull()
+  })
+
+  it('refreshDataset() does nothing for a non-dynamic dataset', () => {
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    expect(() => instance.refreshDataset('unknown')).not.toThrow()
+  })
+
+  it('clearDatasetCache() does nothing for a non-dynamic dataset', () => {
+    const args = makeArgs()
+    const instance = initialiseDatasets(args)
+    expect(() => instance.clearDatasetCache('unknown')).not.toThrow()
+  })
+})

package/plugins/beta/datasets/src/manifest.js

@@ -1,8 +1,8 @@
 // /plugins/datasets/manifest.js
-import { initialState, actions } from './reducer.js'
-import { DatasetsInit } from './DatasetsInit.jsx'
-import { Layers } from './panels/Layers.jsx'
-import { Key } from './panels/Key.jsx'
+import { initialState, actions } from './reducers/pluginState.js'
+import { DatasetsInit } from './initialise/DatasetsInit.jsx'
+import { LayersMenu } from './components/LayersMenu/LayersMenu.jsx'
+import { Key } from './components/Key/Key.jsx'
 import { addDataset } from './api/addDataset.js'
 import { removeDataset } from './api/removeDataset.js'
 import { setDatasetVisibility } from './api/setDatasetVisibility.js'
@@ -12,6 +12,7 @@ import { getStyle } from './api/getStyle.js'
 import { setOpacity } from './api/setOpacity.js'
 import { getOpacity } from './api/getOpacity.js'
 import { setData } from './api/setData.js'
+import { setGlobals } from './api/setGlobals.js'
 
 export const manifest = {
   InitComponent: DatasetsInit,
@@ -42,7 +43,7 @@ export const manifest = {
       exclusive: true,
       width: '280px'
     },
-    render: Layers
+    render: LayersMenu
   }, {
     id: 'datasetsKey',
     label: 'Key',
@@ -118,6 +119,7 @@ export const manifest = {
     getStyle,
     setOpacity,
     getOpacity,
-    setData
+    setData,
+    setGlobals
   }
 }

package/plugins/beta/datasets/src/reducers/__data__/demoDatasets.js

@@ -0,0 +1,253 @@
+const pointData = {
+  type: 'FeatureCollection',
+  features: [{
+    type: 'Feature',
+    properties: { category: 'prehistoric' },
+    geometry: { coordinates: [-2.4558622, 54.5617135], type: 'Point' }
+  }, {
+    type: 'Feature',
+    properties: { category: 'roman' },
+    geometry: { coordinates: [-2.439823, 54.5525437], type: 'Point' }
+  },
+  {
+    type: 'Feature',
+    properties: { category: 'medieval' },
+    geometry: { coordinates: [-2.4481939, 54.5575261], type: 'Point' }
+  }]
+}
+export const datasets = [
+  {
+    id: 'land-covers',
+    label: 'Land covers',
+    dynamicGeoJSON: {
+      idProperty: 'id', // required - the ID that identifies individual features
+      url: `${process.env.FARMING_API_URL}/api/collections/parcels/items?sbi=106325052`, // required
+      transformRequest: (url) => url + 'TRANSFORMED', // Required
+      maxFeatures: 50000 // Optional: evict distant features when exceeded
+    },
+    hiddenFeatures: [42],
+    query: {},
+    maxFeatures: 50000, // Optional: evict distant features when exceeded
+    minZoom: 10,
+    maxZoom: 24,
+    showInKey: true,
+    showInMenu: true,
+    visible: true,
+    sublayers: [{
+      id: '130-131',
+      label: 'Permanent grassland',
+      filter: ['in', ['get', 'dominant_land_cover'], ['literal', ['130', '131']]], // 'dominant_land_cover = "130"'
+      showInMenu: true,
+      visible: true,
+      style: {
+        stroke: { outdoor: '#00897B', dark: '#ffffff' },
+        fillPattern: 'diagonal-cross-hatch',
+        fillPatternForegroundColor: { outdoor: '#00897B', dark: '#ffffff' },
+        fillPatternBackgroundColor: 'transparent'
+      }
+    }, {
+      id: '332',
+      label: 'Woodland',
+      filter: ['==', ['get', 'dominant_land_cover'], '332'],
+      showInMenu: true,
+      visible: true,
+      style: {
+        stroke: { outdoor: '#2E7D32', dark: '#ffffff' },
+        fillPattern: 'dot',
+        fillPatternForegroundColor: { outdoor: '#2E7D32', dark: '#ffffff' },
+        fillPatternBackgroundColor: 'transparent'
+      }
+    }, {
+      id: '110',
+      label: 'Arable',
+      filter: ['==', ['get', 'dominant_land_cover'], '110'],
+      showInMenu: true,
+      visible: true,
+      style: {
+        stroke: { outdoor: '#6D4C41', dark: '#ffffff' },
+        fillPattern: 'horizontal-hatch',
+        fillPatternForegroundColor: { outdoor: '#6D4C41', dark: '#ffffff' },
+        fillPatternBackgroundColor: 'transparent'
+      }
+    }, {
+      id: '379',
+      label: 'Farmyards',
+      visibility: 'hidden',
+      visible: false,
+      filter: ['==', ['get', 'dominant_land_cover'], '379'],
+      showInMenu: true,
+      style: {
+        stroke: { outdoor: '#6A1B9A', dark: '#ffffff' },
+        fillPattern: 'forward-diagonal-hatch',
+        fillPatternForegroundColor: { outdoor: '#6A1B9A', dark: '#ffffff' },
+        fillPatternBackgroundColor: 'transparent'
+      }
+    }, {
+      id: 'other',
+      label: 'Others',
+      filter: ['!', ['in', ['get', 'dominant_land_cover'], ['literal', ['110', '130', '131', '332', '379']]]],
+      showInMenu: true,
+      visible: true,
+      style: {
+        stroke: { outdoor: '#1565C0', dark: '#ffffff' },
+        fill: 'rgba(0,0,255,0.1)',
+        fillPattern: 'vertical-hatch',
+        fillPatternForegroundColor: { outdoor: '#1565C0', dark: '#ffffff' }
+        // fillPatternBackgroundColor: 'transparent'
+      }
+    }]
+  },
+  {
+    id: 'existing-fields',
+    label: 'Existing fields',
+    // groupLabel: 'Test group',
+    filter: ['all', ['==', ['get', 'sbi'], '106223377'], ['==', ['get', 'is_dominant_land_cover'], true]],
+    tiles: 'https://farming-tiles-702a60f45633.herokuapp.com/field_parcels_with_hedges/{z}/{x}/{y}',
+    sourceLayer: 'field_parcels_filtered',
+    minZoom: 10,
+    maxZoom: 24,
+    showInKey: true,
+    showInMenu: true,
+    visible: true,
+    style: {
+      stroke: { outdoor: '#1565C0', dark: '#ffffff' },
+      strokeWidth: 2,
+      fill: 'rgba(21,101,192,0.1)',
+      symbolDescription: { outdoor: 'blue outline', dark: 'white outline' }
+    }
+  }, {
+    id: 'historic-monuments',
+    label: 'Historic monuments',
+    geojson: pointData,
+    minZoom: 10,
+    maxZoom: 24,
+    showInKey: true,
+    showInMenu: true,
+    visible: true,
+    style: {
+      symbol: 'square',
+      symbolGraphic: 'M3 15H1V1h2v2h2V1h2v5h2V4h2v2h2V4h2v11H6V9H3v6z' // Historic monument
+    },
+    sublayers: [{
+      id: 'prehistoric',
+      label: 'Prehistoric',
+      filter: ['in', ['get', 'category'], 'prehistoric'],
+      showInMenu: true,
+      visible: true,
+      style: {
+        symbolBackgroundColor: '#00897B'
+      }
+    }, {
+      id: 'roman',
+      label: 'Roman',
+      filter: ['in', ['get', 'category'], 'roman'],
+      showInMenu: true,
+      visible: true,
+      style: {
+        symbolBackgroundColor: '#ca3535'
+      }
+    }, {
+      id: 'medieval',
+      label: 'Medieval',
+      filter: ['in', ['get', 'category'], 'medieval'],
+      showInMenu: true,
+      visible: true,
+      style: {
+        symbolBackgroundColor: '#1565C0'
+      }
+    }]
+  }, {
+    id: 'hedge-control',
+    label: 'Hedge control',
+    // groupLabel: 'Test group',
+    tiles: ['https://farming-tiles-702a60f45633.herokuapp.com/field_parcels_with_hedges/{z}/{x}/{y}'],
+    sourceLayer: 'hedge_control',
+    minZoom: 10,
+    maxZoom: 24,
+    showInKey: true,
+    showInMenu: true,
+    visibility: 'hidden',
+    visible: false,
+    style: {
+      stroke: '#b58840',
+      fill: 'transparent',
+      strokeWidth: 4,
+      symbolDescription: { outdoor: 'blue outline' },
+      keySymbolShape: 'line'
+    }
+  }
+]
+
+export const expectedDatasetsMenuConfig = [
+  {
+    id: 'land-covers',
+    groupLabel: 'Land covers',
+    visibleWhen: true,
+    type: 'checkbox',
+    items: [
+      { id: 'land-covers-130-131', label: 'Permanent grassland' },
+      { id: 'land-covers-332', label: 'Woodland' },
+      { id: 'land-covers-110', label: 'Arable' },
+      { id: 'land-covers-379', label: 'Farmyards' },
+      { id: 'land-covers-other', label: 'Others' }
+    ]
+  },
+  {
+    visibleWhen: true,
+    type: 'checkbox',
+    id: 'existing-fields',
+    items: [
+      { id: 'existing-fields', label: 'Existing fields' }
+    ]
+  },
+  {
+    id: 'historic-monuments',
+    groupLabel: 'Historic monuments',
+    visibleWhen: true,
+    type: 'checkbox',
+    items: [
+      { id: 'historic-monuments-prehistoric', label: 'Prehistoric' },
+      { id: 'historic-monuments-roman', label: 'Roman' },
+      { id: 'historic-monuments-medieval', label: 'Medieval' }
+    ]
+  },
+  {
+    visibleWhen: true,
+    type: 'checkbox',
+    id: 'hedge-control',
+    items: [
+      { id: 'hedge-control', label: 'Hedge control' }
+    ]
+  }
+]
+
+const landCovers = datasets[0]
+const existingFields = datasets[1]
+const historicMonuments = datasets[2]
+const hedgeControl = datasets[3]
+const landCoversMenuItem = expectedDatasetsMenuConfig[0]
+const existingFieldsMenuItem = expectedDatasetsMenuConfig[1]
+const historicMonumentsMenuItem = expectedDatasetsMenuConfig[2]
+const hedgeControlMenuItem = expectedDatasetsMenuConfig[3]
+
+export const datasetsWithGroups = [
+  { ...landCovers },
+  { ...existingFields, groupLabel: 'Test group' },
+  { ...historicMonuments },
+  { ...hedgeControl, groupLabel: 'Test group', visible: true }
+]
+
+export const expectedDatasetsMenuConfigWithGroups = [
+  { ...landCoversMenuItem },
+  {
+    visibleWhen: true,
+    type: 'checkbox',
+    groupLabel: 'Test group',
+    id: 'Test group',
+    items: [
+      ...existingFieldsMenuItem.items,
+      ...hedgeControlMenuItem.items
+    ]
+  },
+  { ...historicMonumentsMenuItem }
+]

package/plugins/beta/datasets/src/reducers/datasetsToMenu.js

@@ -0,0 +1,83 @@
+export const datasetsToMenu = (state) => {
+  const { datasets = [] } = state
+  const menu = []
+  const datasetsForMenu = datasets.filter(dataset =>
+    dataset.showInMenu || dataset.sublayers?.some(s => s.showInMenu)
+  )
+  const groups = new Map()
+  datasetsForMenu.forEach(dataset => {
+    if (dataset.sublayers?.length) {
+      const visibleSublayers = dataset.sublayers.filter(sublayer =>
+        dataset.showInMenu ? sublayer.showInMenu !== false : sublayer.showInMenu
+      )
+      if (!visibleSublayers.length) { return }
+      menu.push({
+        id: dataset.id,
+        groupLabel: dataset.label,
+        visibleWhen: true,
+        type: 'checkbox',
+        items: visibleSublayers.map(sublayer => ({
+          id: `${dataset.id}-${sublayer.id}`,
+          label: sublayer.label
+        }))
+      })
+    } else if (dataset.groupLabel) {
+      // Check for existing group object for this groupLabel, or create it if it doesn't exist,
+      // then add the dataset to its items and push it to the menu if it's new
+      const groupObject = groups.has(dataset.groupLabel)
+        ? groups.get(dataset.groupLabel)
+        : {
+            id: dataset.groupLabel,
+            groupLabel: dataset.groupLabel,
+            visibleWhen: true,
+            type: 'checkbox',
+            items: []
+          }
+      if (!groups.has(dataset.groupLabel)) {
+        groups.set(dataset.groupLabel, groupObject)
+        menu.push(groupObject)
+      }
+      // Then add this dataset to the groupObject's items
+      groupObject.items.push({
+        id: dataset.id,
+        label: dataset.label
+      })
+    } else {
+      menu.push({
+        visibleWhen: true,
+        type: 'checkbox',
+        id: dataset.id,
+        items: [
+          {
+            id: dataset.id,
+            label: dataset.label
+          }
+        ]
+      })
+    }
+  })
+  return menu
+}
+
+export const addDatasetToMenu = (state, dataset) => {
+  const menu = [...state.menu]
+  const datasetMenuEntry = datasetsToMenu({ datasets: [dataset] })
+  // For each entry in the new dataset menu, either add it to an existing group or add it as a new entry
+  const existingGroup = menu.find(entry => entry.groupLabel === datasetMenuEntry[0].groupLabel)
+  if (existingGroup) {
+    existingGroup.items.push(...datasetMenuEntry[0].items)
+  } else {
+    menu.push(...datasetMenuEntry)
+  }
+  return menu
+}
+
+export const removeDatasetsFromMenu = (menu, datasetsToRemove) => {
+  return menu.reduce((newMenu, menuGroup) => {
+    const filteredItems = menuGroup.items.filter(item => !datasetsToRemove.includes(item.id))
+    if (filteredItems.length) {
+      newMenu.push({ ...menuGroup, items: filteredItems })
+    }
+    return newMenu
+  }, [])
+}