diff --git a/components/lib/picklist/PickList.js b/components/lib/picklist/PickList.js index 2fa3512138..988c5d30a8 100644 --- a/components/lib/picklist/PickList.js +++ b/components/lib/picklist/PickList.js @@ -16,8 +16,8 @@ export const PickList = React.memo(React.forwardRef((props, ref) => { const targetListElementRef = React.useRef(null); const reorderedListElementRef = React.useRef(null); const reorderDirection = React.useRef(null); - const sourceSelection = props.onSourceSelectionChange ? props.sourceSelection : sourceSelectionState; - const targetSelection = props.onTargetSelectionChange ? props.targetSelection : targetSelectionState; + const sourceSelection = props.sourceSelection ? props.sourceSelection : sourceSelectionState; + const targetSelection = props.targetSelection ? props.targetSelection : targetSelectionState; const sourceFilteredValue = props.onSourceFilterChange ? props.sourceFilterValue : sourceFilterValueState; const targetFilteredValue = props.onTargetFilterChange ? props.targetFilterValue : targetFilterValueState; const hasFilterBy = ObjectUtils.isNotEmpty(props.filterBy); @@ -77,39 +77,44 @@ export const PickList = React.memo(React.forwardRef((props, ref) => { const onTransfer = (event) => { const { originalEvent, source, target, direction } = event; + let selectedValue = []; switch (direction) { case 'toTarget': + selectedValue = sourceSelection; if (props.onMoveToTarget) { props.onMoveToTarget({ originalEvent, - value: sourceSelection + value: selectedValue }) } break; case 'allToTarget': + selectedValue = props.source; if (props.onMoveAllToTarget) { props.onMoveAllToTarget({ originalEvent, - value: props.source + value: selectedValue }) } break; case 'toSource': + selectedValue = targetSelection; if (props.onMoveToSource) { props.onMoveToSource({ originalEvent, - value: targetSelection + value: selectedValue }) } break; case 'allToSource': + selectedValue = props.target; if (props.onMoveAllToSource) { props.onMoveAllToSource({ originalEvent, - value: props.target + value: selectedValue }) } break; @@ -118,8 +123,8 @@ export const PickList = React.memo(React.forwardRef((props, ref) => { break; } - onSelectionChange({ originalEvent, value: [] }, 'sourceSelection', props.onSourceSelectionChange); - onSelectionChange({ originalEvent, value: [] }, 'targetSelection', props.onTargetSelectionChange); + onSelectionChange({ originalEvent, value: selectedValue }, 'sourceSelection', props.onSourceSelectionChange); + onSelectionChange({ originalEvent, value: selectedValue }, 'targetSelection', props.onTargetSelectionChange); handleChange(event, source, target); } @@ -131,15 +136,14 @@ export const PickList = React.memo(React.forwardRef((props, ref) => { } const onSelectionChange = (e, stateKey, callback) => { + if (stateKey === 'sourceSelection') + setSourceSelectionState(e.value); + else + setTargetSelectionState(e.value); + if (callback) { callback(e); } - else { - if (stateKey === 'sourceSelection') - setSourceSelectionState(e.value); - else - setTargetSelectionState(e.value); - } if (ObjectUtils.isNotEmpty(sourceSelection) && stateKey === 'targetSelection') { setSourceSelectionState([]); diff --git a/components/lib/picklist/PickListControls.js b/components/lib/picklist/PickListControls.js index 7d42456987..022894a1b8 100644 --- a/components/lib/picklist/PickListControls.js +++ b/components/lib/picklist/PickListControls.js @@ -3,10 +3,10 @@ import { Button } from '../button/Button'; import { classNames, ObjectUtils } from '../utils/Utils'; export const PickListControls = React.memo((props) => { - const moveDisabled = !props.selection.length; + const moveDisabled = !props.selection || !props.selection.length; const moveUp = (event) => { - let selectedItems = props.selection; + const selectedItems = props.selection; if (selectedItems && selectedItems.length) { let list = [...props.list];