From 89a8eab148bc67b0d908d431e68464eb65e7b572 Mon Sep 17 00:00:00 2001
From: Carlos Martins <cmartins@expensify.com>
Date: Fri, 20 May 2022 15:49:09 -0600
Subject: [PATCH 1/3] rm state, expose setNativeProps, pass correct props

---
 src/components/Picker/BasePicker/index.js | 24 +++++++++++++++++------
 src/components/StatePicker.js             |  3 ++-
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/src/components/Picker/BasePicker/index.js b/src/components/Picker/BasePicker/index.js
index bdd5def02ec3..d8c0025995be 100644
--- a/src/components/Picker/BasePicker/index.js
+++ b/src/components/Picker/BasePicker/index.js
@@ -10,17 +10,20 @@ class BasePicker extends React.Component {
     constructor(props) {
         super(props);
 
-        this.state = {
-            selectedValue: this.props.defaultValue,
-        };
+        this.pickerValue = this.props.defaultValue;
 
         this.updateSelectedValueAndExecuteOnChange = this.updateSelectedValueAndExecuteOnChange.bind(this);
         this.executeOnCloseAndOnBlur = this.executeOnCloseAndOnBlur.bind(this);
+        this.setNativeProps = this.setNativeProps.bind(this);
+    }
+
+    setNativeProps({value}) {
+        this.pickerValue = value;
     }
 
     updateSelectedValueAndExecuteOnChange(value) {
         this.props.onInputChange(value);
-        this.setState({selectedValue: value});
+        this.pickerValue = value;
     }
 
     executeOnCloseAndOnBlur() {
@@ -38,7 +41,7 @@ class BasePicker extends React.Component {
                 style={this.props.size === 'normal' ? basePickerStyles(this.props.disabled, hasError, this.props.focused) : styles.pickerSmall}
                 useNativeAndroidPickerStyle={false}
                 placeholder={this.props.placeholder}
-                value={this.props.value || this.state.selectedValue}
+                value={this.props.value || this.pickerValue}
                 Icon={() => this.props.icon(this.props.size)}
                 disabled={this.props.disabled}
                 fixAndroidTouchableBug
@@ -47,7 +50,16 @@ class BasePicker extends React.Component {
                 pickerProps={{
                     onFocus: this.props.onOpen,
                     onBlur: this.executeOnCloseAndOnBlur,
-                    ref: this.props.innerRef,
+                }}
+                ref={(node) => {
+                    if (!node || !_.isFunction(this.props.innerRef)) {
+                        return;
+                    }
+
+                    this.props.innerRef(node);
+
+                    // eslint-disable-next-line no-param-reassign
+                    node.setNativeProps = this.setNativeProps;
                 }}
             />
         );
diff --git a/src/components/StatePicker.js b/src/components/StatePicker.js
index 0ae82af6baee..a76fd7ba0197 100644
--- a/src/components/StatePicker.js
+++ b/src/components/StatePicker.js
@@ -55,7 +55,8 @@ const StatePicker = forwardRef((props, ref) => (
         placeholder={{value: '', label: '-'}}
         items={STATES}
         onInputChange={props.onInputChange}
-        value={props.value ? props.value : props.defaultValue}
+        value={props.value}
+        defaultValue={props.defaultValue}
         label={props.label || props.translate('common.state')}
         errorText={props.errorText}
         onBlur={props.onBlur}

From 6d724f6226cdb0892fddf9a51512e7fcf3f992b0 Mon Sep 17 00:00:00 2001
From: Carlos Martins <cmartins@expensify.com>
Date: Tue, 24 May 2022 09:47:55 -0600
Subject: [PATCH 2/3] add jsdocs for setNativeProps

---
 src/components/Picker/BasePicker/index.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/Picker/BasePicker/index.js b/src/components/Picker/BasePicker/index.js
index d8c0025995be..0d671fbd18d9 100644
--- a/src/components/Picker/BasePicker/index.js
+++ b/src/components/Picker/BasePicker/index.js
@@ -17,6 +17,12 @@ class BasePicker extends React.Component {
         this.setNativeProps = this.setNativeProps.bind(this);
     }
 
+    /**
+     * This method mimicks RN's setNativeProps method. It's exposed to Picker's ref and can be used by other components 
+     * to directly manipulate Picker's value when Picker is used as an uncontrolled input.
+     *
+     * @param {*} value 
+     */
     setNativeProps({value}) {
         this.pickerValue = value;
     }

From c620eb0512570969d4161d547cfd8bbacc0d7b47 Mon Sep 17 00:00:00 2001
From: Carlos Martins <cmartins@expensify.com>
Date: Tue, 24 May 2022 09:48:27 -0600
Subject: [PATCH 3/3] fix style

---
 src/components/Picker/BasePicker/index.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Picker/BasePicker/index.js b/src/components/Picker/BasePicker/index.js
index 0d671fbd18d9..eb3021ab54a9 100644
--- a/src/components/Picker/BasePicker/index.js
+++ b/src/components/Picker/BasePicker/index.js
@@ -18,10 +18,10 @@ class BasePicker extends React.Component {
     }
 
     /**
-     * This method mimicks RN's setNativeProps method. It's exposed to Picker's ref and can be used by other components 
+     * This method mimicks RN's setNativeProps method. It's exposed to Picker's ref and can be used by other components
      * to directly manipulate Picker's value when Picker is used as an uncontrolled input.
      *
-     * @param {*} value 
+     * @param {*} value
      */
     setNativeProps({value}) {
         this.pickerValue = value;