@dhis2-ui/transfer 10.16.2 → 10.16.3

package/src/__tests__/helper/move-highlighted-picked-option-to-bottom.test.js

@@ -0,0 +1,101 @@
+import { moveHighlightedPickedOptionToBottom } from '../../transfer/move-highlighted-picked-option-to-bottom.js'
+
+describe('Transfer - moveHighlightedPickedOptionToBottom', () => {
+    const onChange = jest.fn()
+
+    afterEach(() => {
+        onChange.mockClear()
+    })
+
+    it('should move a single highlighted option to the bottom', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'd', 'b'],
+        })
+    })
+
+    it('should move a contiguous block to the bottom as a group', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['b', 'c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'd', 'e', 'b', 'c'],
+        })
+    })
+
+    it('should collapse a non-contiguous selection to the bottom preserving relative order', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['b', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'e', 'b', 'd'],
+        })
+    })
+
+    it('should preserve relative order regardless of highlight input order', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['d', 'b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'e', 'b', 'd'],
+        })
+    })
+
+    it('should do nothing when the highlighted block is already flush to the bottom', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['c', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should still run when the selection includes the bottom item but has a gap', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['b', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'b', 'd'],
+        })
+    })
+
+    it('should do nothing when no highlighted options exist in selected', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['ghost'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should ignore highlighted values that do not exist in selected', () => {
+        moveHighlightedPickedOptionToBottom({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['ghost', 'a'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['b', 'c', 'a'],
+        })
+    })
+})

package/src/__tests__/helper/move-highlighted-picked-option-to-top.test.js

@@ -0,0 +1,101 @@
+import { moveHighlightedPickedOptionToTop } from '../../transfer/move-highlighted-picked-option-to-top.js'
+
+describe('Transfer - moveHighlightedPickedOptionToTop', () => {
+    const onChange = jest.fn()
+
+    afterEach(() => {
+        onChange.mockClear()
+    })
+
+    it('should move a single highlighted option to the top', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['c', 'a', 'b', 'd'],
+        })
+    })
+
+    it('should move a contiguous block to the top as a group', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['c', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['c', 'd', 'a', 'b', 'e'],
+        })
+    })
+
+    it('should collapse a non-contiguous selection to the top preserving relative order', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['b', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['b', 'd', 'a', 'c', 'e'],
+        })
+    })
+
+    it('should preserve relative order regardless of highlight input order', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['d', 'b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['b', 'd', 'a', 'c', 'e'],
+        })
+    })
+
+    it('should do nothing when the highlighted block is already flush to the top', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['a', 'b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should still run when the selection includes the top item but has a gap', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['a', 'c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'b', 'd'],
+        })
+    })
+
+    it('should do nothing when no highlighted options exist in selected', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['ghost'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should ignore highlighted values that do not exist in selected', () => {
+        moveHighlightedPickedOptionToTop({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['ghost', 'c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['c', 'a', 'b'],
+        })
+    })
+})

package/src/__tests__/helper/move-highlighted-picked-option-up.test.js

@@ -0,0 +1,111 @@
+import { moveHighlightedPickedOptionUp } from '../../transfer/move-highlighted-picked-option-up.js'
+
+describe('Transfer - moveHighlightedPickedOptionUp', () => {
+    const onChange = jest.fn()
+
+    afterEach(() => {
+        onChange.mockClear()
+    })
+
+    it('should move a single highlighted option up', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['foo', 'bar', 'baz'],
+            highlightedPickedOptions: ['bar'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['bar', 'foo', 'baz'],
+        })
+    })
+
+    it('should do nothing when trying to move up the first option', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['foo', 'bar', 'baz'],
+            highlightedPickedOptions: ['foo'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should do nothing when trying to move up a non-existing option', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['foo', 'bar', 'baz'],
+            highlightedPickedOptions: ['ghost'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should shift a contiguous block of highlighted options up as a group', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['c', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'd', 'b', 'e'],
+        })
+    })
+
+    it('should collapse and shift a non-contiguous selection up in one call', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['b', 'd'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['b', 'd', 'a', 'c', 'e'],
+        })
+    })
+
+    it('should preserve the relative order of highlighted items regardless of input order', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c', 'd', 'e'],
+            highlightedPickedOptions: ['d', 'b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['b', 'd', 'a', 'c', 'e'],
+        })
+    })
+
+    it('should collapse a non-contiguous selection containing the first item without shifting past index 0', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['a', 'c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'b'],
+        })
+    })
+
+    it('should do nothing when the highlighted block is already flush to the top', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c', 'd'],
+            highlightedPickedOptions: ['a', 'b'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should ignore highlighted values that do not exist in selected', () => {
+        moveHighlightedPickedOptionUp({
+            selected: ['a', 'b', 'c'],
+            highlightedPickedOptions: ['ghost', 'c'],
+            onChange,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['a', 'c', 'b'],
+        })
+    })
+})

package/src/__tests__/helper/remove-all-picked-options.test.js

@@ -0,0 +1,29 @@
+import { removeAllPickedOptions } from '../../transfer/remove-all-picked-options.js'
+
+describe('Transfer - removeAllPickedOptions', () => {
+    const onChange = jest.fn()
+    const setHighlightedPickedOptions = jest.fn()
+
+    afterEach(() => {
+        onChange.mockClear()
+        setHighlightedPickedOptions.mockClear()
+    })
+
+    it('should reset the selected array', () => {
+        removeAllPickedOptions({
+            onChange,
+            setHighlightedPickedOptions,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({ selected: [] })
+    })
+
+    it('should reset the highlighted picked options', () => {
+        removeAllPickedOptions({
+            onChange,
+            setHighlightedPickedOptions,
+        })
+
+        expect(setHighlightedPickedOptions).toHaveBeenCalledWith([])
+    })
+})

package/src/__tests__/helper/remove-individual-picked-options.test.js

@@ -0,0 +1,38 @@
+import { removeIndividualPickedOptions } from '../../transfer/remove-individual-picked-options.js'
+
+describe('Transfer - removeIndividualPickedOptions', () => {
+    const onChange = jest.fn()
+    const setHighlightedPickedOptions = jest.fn()
+
+    afterEach(() => {
+        onChange.mockClear()
+        setHighlightedPickedOptions.mockClear()
+    })
+
+    const selected = ['foo', 'bar', 'baz']
+    const highlightedPickedOptions = ['bar', 'baz']
+
+    it('should remove the highlighted picked options', () => {
+        removeIndividualPickedOptions({
+            highlightedPickedOptions,
+            selected,
+            onChange,
+            setHighlightedPickedOptions,
+        })
+
+        expect(onChange).toHaveBeenCalledWith({
+            selected: ['foo'],
+        })
+    })
+
+    it('should reset the highlighted picked options', () => {
+        removeIndividualPickedOptions({
+            highlightedPickedOptions,
+            selected,
+            onChange,
+            setHighlightedPickedOptions,
+        })
+
+        expect(setHighlightedPickedOptions).toHaveBeenCalledWith([])
+    })
+})

package/src/__tests__/helper/use-highlighted-option/create-toggle-highlighted-option.test.js

@@ -0,0 +1,104 @@
+import { ADD_MODE, RANGE_MODE, REPLACE_MODE } from '../../../common/index.js'
+import { createToggleHighlightedOption } from '../../../transfer/use-highlighted-options/create-toggle-highlighted-option.js'
+import { toggleAdd } from '../../../transfer/use-highlighted-options/toggle-add.js'
+import { toggleRange } from '../../../transfer/use-highlighted-options/toggle-range.js'
+import { toggleReplace } from '../../../transfer/use-highlighted-options/toggle-replace.js'
+
+jest.mock('../../../transfer/use-highlighted-options/toggle-add.js', () => ({
+    toggleAdd: jest.fn(),
+}))
+
+jest.mock('../../../transfer/use-highlighted-options/toggle-range.js', () => ({
+    toggleRange: jest.fn(),
+}))
+
+jest.mock(
+    '../../../transfer/use-highlighted-options/toggle-replace.js',
+    () => ({ toggleReplace: jest.fn() })
+)
+
+describe('Transfer- useHighlightedOptions - createToggleHighlightedOption', () => {
+    let toggleHighlightedOption
+    const disabled = false
+    const lastClicked = null
+    const setLastClicked = jest.fn()
+    const highlightedOptions = []
+    const maxSelections = Infinity
+    const setHighlightedOptions = jest.fn()
+    const options = []
+    const option = { value: 'foo', label: 'Foo' }
+    const createToggleHighlightedOptionDefaultPayload = {
+        options,
+        disabled,
+        highlightedOptions,
+        lastClicked,
+        maxSelections,
+        setHighlightedOptions,
+        setLastClicked,
+    }
+
+    beforeEach(() => {
+        toggleHighlightedOption = createToggleHighlightedOption(
+            createToggleHighlightedOptionDefaultPayload
+        )
+    })
+
+    afterEach(() => {
+        setLastClicked.mockClear()
+        toggleAdd.mockClear()
+        toggleRange.mockClear()
+        toggleReplace.mockClear()
+    })
+
+    it('should set the lastClicked to the clicked option when mode is ADD_MODE', () => {
+        toggleHighlightedOption({ option, mode: ADD_MODE })
+        expect(setLastClicked).toHaveBeenCalledWith(option.value)
+    })
+
+    it('should set the lastClicked to the clicked option when mode is REPLACE_MODE', () => {
+        toggleHighlightedOption({ option, mode: REPLACE_MODE })
+        expect(setLastClicked).toHaveBeenCalledWith(option.value)
+    })
+
+    it('should not overwrite the lastClicked to the clicked option when mode is RANGE_MODE', () => {
+        toggleHighlightedOption({ option, mode: RANGE_MODE })
+        expect(setLastClicked).toHaveBeenCalledTimes(0)
+    })
+
+    it('should use the toggleAdd function when mode is ADD_MODE', () => {
+        toggleHighlightedOption({ option, mode: ADD_MODE })
+        expect(toggleAdd).toHaveBeenCalledTimes(1)
+        expect(toggleRange).toHaveBeenCalledTimes(0)
+        expect(toggleReplace).toHaveBeenCalledTimes(0)
+    })
+
+    it('should use the toggleRange function when mode is RANGE_MODE', () => {
+        toggleHighlightedOption({ option, mode: RANGE_MODE })
+        expect(toggleRange).toHaveBeenCalledTimes(1)
+        expect(toggleAdd).toHaveBeenCalledTimes(0)
+        expect(toggleReplace).toHaveBeenCalledTimes(0)
+    })
+
+    it('should use the toggleReplace function when mode is REPLACE_MODE', () => {
+        toggleHighlightedOption({ option, mode: REPLACE_MODE })
+        expect(toggleReplace).toHaveBeenCalledTimes(1)
+        expect(toggleAdd).toHaveBeenCalledTimes(0)
+        expect(toggleRange).toHaveBeenCalledTimes(0)
+    })
+
+    it('should do nothing when disabled is true', () => {
+        toggleHighlightedOption = createToggleHighlightedOption({
+            ...createToggleHighlightedOptionDefaultPayload,
+            disabled: true,
+        })
+
+        toggleHighlightedOption({ option, mode: ADD_MODE })
+        toggleHighlightedOption({ option, mode: RANGE_MODE })
+        toggleHighlightedOption({ option, mode: REPLACE_MODE })
+
+        expect(toggleReplace).toHaveBeenCalledTimes(0)
+        expect(toggleAdd).toHaveBeenCalledTimes(0)
+        expect(toggleRange).toHaveBeenCalledTimes(0)
+        expect(setLastClicked).toHaveBeenCalledTimes(0)
+    })
+})

package/src/__tests__/helper/use-highlighted-option/toggle-add.test.js

@@ -0,0 +1,84 @@
+import { toggleAdd } from '../../../transfer/use-highlighted-options/toggle-add.js'
+
+describe('Transfer - useHighlightedOptions - toggleAdd', () => {
+    const setHighlightedOptions = jest.fn()
+
+    afterEach(() => {
+        setHighlightedOptions.mockClear()
+    })
+
+    describe('maxSelections=1', () => {
+        const maxSelections = 1
+
+        it('should replace the current highlighted option', () => {
+            const highlightedOptions = ['foo']
+            const option = { value: 'bar', label: 'Bar' }
+            const expected = [option.value]
+
+            toggleAdd({
+                maxSelections,
+                highlightedOptions,
+                option,
+                setHighlightedOptions,
+            })
+
+            expect(setHighlightedOptions).toHaveBeenCalledWith(expected)
+        })
+
+        it('should empty the highlighted options', () => {
+            const highlightedOptions = ['foo']
+            const option = { value: 'foo', label: 'Foo' }
+            const expected = []
+
+            toggleAdd({
+                maxSelections,
+                highlightedOptions,
+                option,
+                setHighlightedOptions,
+            })
+
+            expect(setHighlightedOptions).toHaveBeenCalledWith(expected)
+        })
+    })
+
+    describe('maxSelections=Infinity', () => {
+        const maxSelections = Infinity
+
+        it('should add the option to the highlighted options when maxSelections is Infinity', () => {
+            const highlightedOptions = ['foo']
+            const option = { value: 'bar', label: 'Bar' }
+            const expected = [...highlightedOptions, option.value]
+
+            toggleAdd({
+                maxSelections,
+                highlightedOptions,
+                option,
+                setHighlightedOptions,
+            })
+
+            expect(setHighlightedOptions).toHaveBeenCalledWith(expected)
+        })
+
+        it('should remove the option from the highlighted list', () => {
+            const optionOne = { value: 'foo', label: 'Foo' }
+            const optionTwo = { value: 'bar', label: 'Bar' }
+            const optionThree = { value: 'baz', label: 'Baz' }
+            const highlightedOptions = [
+                optionOne.value,
+                optionTwo.value,
+                optionThree.value,
+            ]
+            const expected = [optionOne, optionThree].map(({ value }) => value)
+            const option = optionTwo
+
+            toggleAdd({
+                maxSelections,
+                highlightedOptions,
+                option,
+                setHighlightedOptions,
+            })
+
+            expect(setHighlightedOptions).toHaveBeenCalledWith(expected)
+        })
+    })
+})