From f19aa88d43ac489f1247c4faad527355266b346d Mon Sep 17 00:00:00 2001
From: Melloware <mellowaredev@gmail.com>
Date: Mon, 15 Aug 2022 07:42:49 -0400
Subject: [PATCH] Fix #3147: Picklist errors with onSelectionChange (#3157)

---
 components/lib/picklist/PickList.js         | 32 ++++++++++++---------
 components/lib/picklist/PickListControls.js |  4 +--
 2 files changed, 20 insertions(+), 16 deletions(-)

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];