Merge pull request #11673 from rushatgabhane/rm-setNativeProps-option…

…sSelector OptionsSelector - remove setNativeProps
Expensify · Oct 12, 2022 · 9b15fbc · 9b15fbc
2 parents 84aca7d + b8cee28
commit 9b15fbc
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 7 deletions.
diff --git a/src/components/OptionsSelector/BaseOptionsSelector.js b/src/components/OptionsSelector/BaseOptionsSelector.js
@@ -14,6 +14,7 @@ import ArrowKeyFocusManager from '../ArrowKeyFocusManager';
 import KeyboardShortcut from '../../libs/KeyboardShortcut';
 import FullScreenLoadingIndicator from '../FullscreenLoadingIndicator';
 import {propTypes as optionsSelectorPropTypes, defaultProps as optionsSelectorDefaultProps} from './optionsSelectorPropTypes';
+import setSelection from '../../libs/setSelection';
 
 const propTypes = {
     /** Whether we should wait before focusing the TextInput, useful when using transitions on Android */
@@ -202,7 +203,7 @@ class BaseOptionsSelector extends Component {
     selectRow(option, ref) {
         if (this.props.shouldFocusOnSelectRow) {
             // Input is permanently focused on native platforms, so we always highlight the text inside of it
-            this.textInput.setNativeProps({selection: {start: 0, end: this.props.value.length}});
+            setSelection(this.textInput, 0, this.props.value.length);
             if (this.relatedTarget && ref === this.relatedTarget) {
                 this.textInput.focus();
             }
@@ -232,12 +233,7 @@ class BaseOptionsSelector extends Component {
                 ref={el => this.textInput = el}
                 value={this.props.value}
                 label={this.props.textInputLabel}
-                onChangeText={(text) => {
-                    if (this.props.shouldFocusOnSelectRow) {
-                        this.textInput.setNativeProps({selection: null});
-                    }
-                    this.props.onChangeText(text);
-                }}
+                onChangeText={this.props.onChangeText}
                 placeholder={this.props.placeholderText || this.props.translate('optionsSelector.nameEmailOrPhoneNumber')}
                 onBlur={(e) => {
                     if (!this.props.shouldFocusOnSelectRow) {

diff --git a/src/libs/setSelection/index.js b/src/libs/setSelection/index.js
@@ -0,0 +1,7 @@
+export default function setSelection(textInput, start, end) {
+    if (!textInput) {
+        return;
+    }
+
+    textInput.setSelectionRange(start, end);
+}
diff --git a/src/libs/setSelection/index.native.js b/src/libs/setSelection/index.native.js
@@ -0,0 +1,7 @@
+export default function setSelection(textInput, start, end) {
+    if (!textInput) {
+        return;
+    }
+
+    textInput.setSelection(start, end);
+}