Fix picker value issue (#1425)

* Fix how we handle internal picker value change for custom picker in multi mode

* Fix issues with picker value updates

Author: ethanshar

src/components/picker/index.js

@@ -182,20 +182,22 @@ class Picker extends Component {
   }
 
   static getDerivedStateFromProps(nextProps, prevState) {
-    if (!_.isEmpty(nextProps.value) && prevState.value !== nextProps.value) {
-      if (prevState.prevValue !== prevState.value) {
-        // for this.setState() updates to 'value'
-        // NOTE: this.setState() already updated the 'value' so here we only updating the 'prevValue'
-        return {
-          prevValue: prevState.value
-        };
-      } else {
-        // for prop update to 'value'
-        return {
-          value: nextProps.value
-        };
-      }
-    } else if (_.isFunction(nextProps.renderPicker) && prevState.value !== nextProps.value) {
+    const hasNextValue = !_.isEmpty(nextProps.value) || _.isNumber(nextProps.value);
+    /* Relevant for keeping the value prop controlled - react when user change value prop */
+    const externalValueChanged = hasNextValue && prevState.value !== nextProps.value;
+    /* Relevant for multi select mode when we keep an internal value state */
+    const internalValueChanged = prevState.value !== prevState.prevValue;
+    if (internalValueChanged && nextProps.mode === Picker.modes.MULTI) {
+      /* for this.setState() updates to 'value'
+      NOTE: this.setState() already updated the 'value' so here we only updating the 'prevValue' */
+      return {
+        prevValue: prevState.value
+      };
+    } else if (externalValueChanged) {
+      return {
+        value: nextProps.value
+      };
+    } else if (_.isFunction(nextProps.renderPicker) && externalValueChanged) {
       return {
         prevValue: prevState.value,
         value: nextProps.value