@defra/interactive-map 0.0.47-alpha → 0.0.48-fmp-1

package/plugins/map-key/src/manifest.js

@@ -1,8 +1,11 @@
 import { MapKey } from './components/Key/MapKey.jsx'
 import { MapKeyInit } from './initialise/MapKeyInit.jsx'
+import { initialState, actions } from './reducers/pluginState.js'
+import { api } from './api/index.js'
 
 export const manifest = {
   InitComponent: MapKeyInit,
+  reducer: { initialState, actions },
   panels: [
     {
       id: 'mapKey',
@@ -26,5 +29,6 @@ export const manifest = {
   icons: [{
     id: 'key',
     svgContent: '<path d="M3 5h.01"/><path d="M3 12h.01"/><path d="M3 19h.01"/><path d="M8 5h13"/><path d="M8 12h13"/><path d="M8 19h13"/>'
-  }]
+  }],
+  api
 }

package/plugins/map-key/src/reducers/mergeKeyGroupItems.js

@@ -0,0 +1,68 @@
+let _pluginStateRef = {}
+export const attachPluginStateRef = (pluginStateRef) => { _pluginStateRef = pluginStateRef }
+
+let previousRef = null
+let addedKeyGroups = []
+
+const getStateKeyGroups = () => {
+  if (!_pluginStateRef?.current) {
+    return []
+  }
+  if (previousRef === _pluginStateRef.current) {
+    return addedKeyGroups
+  }
+  previousRef = _pluginStateRef.current
+  const { groups = [], keyDefinitions = [] } = _pluginStateRef.current
+
+  addedKeyGroups = groups.map(group => {
+    if (group.type === 'flat') {
+      return {
+        ...group,
+        keyDefinition: keyDefinitions.find(item => item.id === group.id)
+      }
+    }
+
+    return {
+      ...group,
+      keyDefinitions: keyDefinitions.filter(item => item.groupId === group.id)
+    }
+  })
+  return addedKeyGroups
+}
+
+// Merges the state key group items with items provided by another plugin,
+// specifically the datasets plugin
+export const mergeKeyGroupItems = (keyGroupItemsToMerge = []) => {
+  // Clone the current state key groups from the plugin state reference
+  // to avoid mutating the original array
+  const stateKeyGroups = [...getStateKeyGroups()]
+  if (stateKeyGroups.length === 0) {
+    // if there is nothing in the state key groups, just return the items that were passed in
+    return keyGroupItemsToMerge
+  }
+
+  const mergedItems = keyGroupItemsToMerge.map((keyGroupItem) => {
+    const groupIndex = stateKeyGroups.findIndex((_group) => _group.id === keyGroupItem.id)
+    if (groupIndex === -1) {
+      return keyGroupItem
+    }
+    // Splice the matched group from the stateKeyGroups and merge it with the item
+    const group = stateKeyGroups.splice(groupIndex, 1)[0]
+    return {
+      ...keyGroupItem,
+      ...group,
+      keyDefinitions: [
+        ...(group.keyDefinitions || []),
+        ...(keyGroupItem.keyDefinitions || [])
+      ]
+    }
+  })
+
+  // Append any remaining pluginConfigGroups that were not matched with datasetItems
+  // and filter out any groups that have no key definitions
+  const finalMergedItems = [...mergedItems, ...stateKeyGroups]
+    .filter(item =>
+      ((item.type === 'flat' && item.keyDefinition) ||
+      (item.type === 'group' && item.keyDefinitions?.length)))
+  return finalMergedItems
+}

package/plugins/map-key/src/reducers/mergeKeyGroupItems.test.js

@@ -0,0 +1,91 @@
+import { attachPluginStateRef, mergeKeyGroupItems } from './mergeKeyGroupItems.js'
+
+describe('mergeKeyGroupItems', () => {
+  afterEach(() => {
+    attachPluginStateRef({ current: null })
+  })
+
+  it('returns the incoming items unchanged when no plugin state is attached', () => {
+    attachPluginStateRef({ current: null })
+    const items = [{ id: 'dataset-1', keyDefinitions: [{ id: 'k1' }] }]
+
+    expect(mergeKeyGroupItems(items)).toBe(items)
+  })
+
+  it('returns dataset items unchanged when plugin state groups are empty', () => {
+    attachPluginStateRef({ current: { groups: [], keyDefinitions: [] } })
+    const items = [{ id: 'dataset-1', keyDefinitions: [{ id: 'k1' }] }]
+
+    expect(mergeKeyGroupItems(items)).toEqual(items)
+  })
+
+  it('uses default empty state values and empty arguments when no groups or items are supplied', () => {
+    attachPluginStateRef({ current: {} })
+
+    expect(mergeKeyGroupItems()).toEqual([])
+  })
+
+  it('merges a matched group even when the state group has no keyDefinitions array', () => {
+    attachPluginStateRef({
+      current: {
+        groups: [{ id: 'dataset-1', type: 'group', groupLabel: 'Dataset 1' }],
+        keyDefinitions: []
+      }
+    })
+
+    const items = [{ id: 'dataset-1', keyDefinitions: [{ id: 'd1' }] }]
+
+    expect(mergeKeyGroupItems(items)).toEqual([
+      { id: 'dataset-1', type: 'group', groupLabel: 'Dataset 1', keyDefinitions: [{ id: 'd1' }] }
+    ])
+  })
+
+  it('reuses the cached plugin-state groups when the ref object is unchanged', () => {
+    const ref = { current: { groups: [{ id: 'group-1', type: 'group', groupLabel: 'Group 1' }], keyDefinitions: [{ id: 'k1', groupId: 'group-1' }] } }
+    attachPluginStateRef(ref)
+
+    const first = mergeKeyGroupItems([{ id: 'dataset-1', keyDefinitions: [{ id: 'd1' }] }])
+    const second = mergeKeyGroupItems([{ id: 'dataset-1', keyDefinitions: [{ id: 'd2' }] }])
+
+    expect(first).toEqual([{ id: 'group-1', type: 'group', groupLabel: 'Group 1', keyDefinitions: [{ id: 'k1', groupId: 'group-1' }] }])
+    expect(second).toEqual(first)
+  })
+
+  it('merges a matching flat group into the dataset item when the key definition matches the same id', () => {
+    attachPluginStateRef({
+      current: {
+        groups: [{ id: 'dataset-1', type: 'flat' }],
+        keyDefinitions: [{ id: 'dataset-1' }]
+      }
+    })
+
+    const items = [{ id: 'dataset-1', keyDefinitions: [{ id: 'dataset-1' }] }]
+
+    expect(mergeKeyGroupItems(items)).toEqual([
+      {
+        id: 'dataset-1',
+        type: 'flat',
+        keyDefinition: { id: 'dataset-1' },
+        keyDefinitions: [{ id: 'dataset-1' }]
+      }
+    ])
+  })
+
+  it('keeps only unmatched state groups that still have key definitions', () => {
+    attachPluginStateRef({
+      current: {
+        groups: [
+          { id: 'group-1', type: 'group', groupLabel: 'Group 1' },
+          { id: 'group-2', type: 'group', groupLabel: 'Group 2' }
+        ],
+        keyDefinitions: [{ id: 'k1', groupId: 'group-1' }]
+      }
+    })
+
+    const items = [{ id: 'dataset-1', keyDefinitions: [{ id: 'd1' }] }]
+
+    expect(mergeKeyGroupItems(items)).toEqual([
+      { id: 'group-1', type: 'group', groupLabel: 'Group 1', keyDefinitions: [{ id: 'k1', groupId: 'group-1' }] }
+    ])
+  })
+})

package/plugins/map-key/src/reducers/pluginState.js

@@ -0,0 +1,68 @@
+const initialState = {
+  keyDefinitions: [],
+  groups: []
+}
+
+const labelToId = (label) => label ? label.toLowerCase().replace(/\s+/g, '-') : null
+const createNewGroup = (id, groupId, groupLabel) => {
+  return groupId
+    ? { id: groupId, type: 'group', groupLabel }
+    : { id, type: 'flat' }
+}
+
+const findGroup = (state, id, groupId) => {
+  return state.groups.find(group => {
+    return (group.type === 'group' && group.id === groupId) ||
+    (group.type === 'flat' && group.id === id)
+  })
+}
+
+const addKeyItem = (state, keyDefinition) => {
+  const { id, groupLabel } = keyDefinition
+  const groupId = keyDefinition.groupId || labelToId(groupLabel)
+  // Check for an existingGroup
+  const existingGroup = findGroup(state, id, groupId)
+  // If no existing group is found, create a new one
+  const newGroup = existingGroup ? null : createNewGroup(id, groupId, groupLabel)
+  // Add the new group to the state if it was created
+  const groups = newGroup ? [...state.groups, newGroup] : state.groups
+  // Add the key definition to the state
+  const keyDefinitions = [...state.keyDefinitions, {
+    ...keyDefinition,
+    type: 'manual',
+    ...(groupId ? { groupId } : {})
+  }]
+
+  // Return the updated state with the new key definitions and groups
+  return {
+    ...state,
+    keyDefinitions,
+    groups
+  }
+}
+
+const removeKeyItem = (state, keyDefinition) => {
+  const { id } = keyDefinition
+  return {
+    ...state,
+    keyDefinitions: state.keyDefinitions.filter(key => key.id !== id)
+  }
+}
+
+const addKeyGroups = (state, groups) => {
+  return {
+    ...state,
+    groups: [...state.groups, ...groups]
+  }
+}
+
+const actions = {
+  ADD_KEY_ITEM: addKeyItem,
+  REMOVE_KEY_ITEM: removeKeyItem,
+  ADD_KEY_GROUPS: addKeyGroups
+}
+
+export {
+  initialState,
+  actions
+}

package/plugins/map-key/src/reducers/pluginState.test.js

@@ -0,0 +1,82 @@
+import { actions, initialState } from './pluginState.js'
+
+describe('pluginState reducer helpers', () => {
+  it('returns the initial state', () => {
+    expect(initialState).toEqual({ keyDefinitions: [], groups: [] })
+  })
+
+  it('adds a flat key item and creates a flat group when needed', () => {
+    const nextState = actions.ADD_KEY_ITEM(initialState, { id: 'flat-key', label: 'Flat key' })
+
+    expect(nextState).toEqual({
+      keyDefinitions: [{ id: 'flat-key', label: 'Flat key', type: 'manual' }],
+      groups: [{ id: 'flat-key', type: 'flat' }]
+    })
+  })
+
+  it('adds a grouped key item when the label can be converted to a group id', () => {
+    const nextState = actions.ADD_KEY_ITEM(initialState, { id: 'group-key', groupLabel: 'Group Label', label: 'Group key' })
+
+    expect(nextState).toEqual({
+      keyDefinitions: [{
+        id: 'group-key',
+        groupId: 'group-label',
+        groupLabel: 'Group Label',
+        label: 'Group key',
+        type: 'manual'
+      }],
+      groups: [{ id: 'group-label', type: 'group', groupLabel: 'Group Label' }]
+    })
+  })
+
+  it('reuses an existing group when the key item matches a flat group already in state', () => {
+    const state = {
+      keyDefinitions: [{ id: 'existing-item' }],
+      groups: [{ id: 'existing-item', type: 'flat' }]
+    }
+
+    expect(actions.ADD_KEY_ITEM(state, { id: 'existing-item', label: 'Existing item' })).toEqual({
+      keyDefinitions: [
+        { id: 'existing-item' },
+        { id: 'existing-item', label: 'Existing item', type: 'manual' }
+      ],
+      groups: [{ id: 'existing-item', type: 'flat' }]
+    })
+  })
+
+  it('reuses an existing grouped definition when the same group id is already present', () => {
+    const state = {
+      keyDefinitions: [{ id: 'existing-group-item', groupId: 'group-1' }],
+      groups: [{ id: 'group-1', type: 'group', groupLabel: 'Group 1' }]
+    }
+
+    expect(actions.ADD_KEY_ITEM(state, { id: 'new-item', groupId: 'group-1', groupLabel: 'Group 1', label: 'New item' })).toEqual({
+      keyDefinitions: [
+        { id: 'existing-group-item', groupId: 'group-1' },
+        { id: 'new-item', groupId: 'group-1', groupLabel: 'Group 1', label: 'New item', type: 'manual' }
+      ],
+      groups: [{ id: 'group-1', type: 'group', groupLabel: 'Group 1' }]
+    })
+  })
+
+  it('removes a key definition by id', () => {
+    const state = {
+      keyDefinitions: [{ id: 'a' }, { id: 'b' }],
+      groups: [{ id: 'a', type: 'flat' }]
+    }
+
+    expect(actions.REMOVE_KEY_ITEM(state, { id: 'a' })).toEqual({
+      keyDefinitions: [{ id: 'b' }],
+      groups: [{ id: 'a', type: 'flat' }]
+    })
+  })
+
+  it('adds configured groups to state without mutating the source array', () => {
+    const groups = [{ id: 'g1', type: 'group', groupLabel: 'G1' }]
+
+    expect(actions.ADD_KEY_GROUPS(initialState, groups)).toEqual({
+      keyDefinitions: [],
+      groups: [{ id: 'g1', type: 'group', groupLabel: 'G1' }]
+    })
+  })
+})

package/plugins/map-key/src/utils/mergeKeyGroupItems.js

@@ -1,12 +0,0 @@
-export const mergeKeyGroupItems = (groups, items) => {
-  if (!groups) {
-    return items
-  }
-  return items.map((item) => {
-    const { id } = item
-    if (groups[id]) {
-      return { ...item, ...groups[id] }
-    }
-    return item
-  })
-}

package/plugins/map-key/src/utils/mergeKeyGroupItems.test.js

@@ -1,53 +0,0 @@
-import { mergeKeyGroupItems } from './mergeKeyGroupItems'
-
-describe('mergeKeyGroupItems', () => {
-  it('returns items unchanged when groups is not provided', () => {
-    const items = [{ id: 'a', label: 'A' }, { id: 'b', label: 'B' }]
-
-    expect(mergeKeyGroupItems(undefined, items)).toBe(items)
-  })
-
-  it('returns items unchanged when groups is null', () => {
-    const items = [{ id: 'a', label: 'A' }]
-
-    expect(mergeKeyGroupItems(null, items)).toBe(items)
-  })
-
-  it('merges matching group data into an item', () => {
-    const items = [{ id: 'a', label: 'A' }]
-    const groups = { a: { group: 'Group 1' } }
-
-    expect(mergeKeyGroupItems(groups, items)).toEqual([
-      { id: 'a', label: 'A', group: 'Group 1' }
-    ])
-  })
-
-  it('overrides item properties with matching group properties', () => {
-    const items = [{ id: 'a', label: 'A' }]
-    const groups = { a: { label: 'Overridden' } }
-
-    expect(mergeKeyGroupItems(groups, items)).toEqual([
-      { id: 'a', label: 'Overridden' }
-    ])
-  })
-
-  it('leaves items without a matching group unchanged', () => {
-    const items = [{ id: 'a', label: 'A' }, { id: 'b', label: 'B' }]
-    const groups = { a: { group: 'Group 1' } }
-
-    expect(mergeKeyGroupItems(groups, items)).toEqual([
-      { id: 'a', label: 'A', group: 'Group 1' },
-      { id: 'b', label: 'B' }
-    ])
-  })
-
-  it('returns an empty array when items is empty', () => {
-    expect(mergeKeyGroupItems({ a: { group: 'Group 1' } }, [])).toEqual([])
-  })
-
-  it('handles an empty groups object as no matches', () => {
-    const items = [{ id: 'a', label: 'A' }]
-
-    expect(mergeKeyGroupItems({}, items)).toEqual(items)
-  })
-})