Merge pull request #4593 from parasharrajat/newInput

Fix ExpensiInput autoFocus & tab Focus
Expensify · Aug 12, 2021 · ff62078 · ff62078
2 parents b9b23e1 + 84a9a10
commit ff62078
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/components/ExpensiTextInput/BaseExpensiTextInput.js b/src/components/ExpensiTextInput/BaseExpensiTextInput.js
@@ -34,6 +34,13 @@ class BaseExpensiTextInput extends Component {
         this.onBlur = this.onBlur.bind(this);
     }
 
+    componentDidMount() {
+        // We are manually managing focus to prevent this issue: https://github.com/Expensify/App/issues/4514
+        if (this.props.autoFocus && this.input) {
+            this.input.focus();
+        }
+    }
+
     onFocus() {
         if (this.props.onFocus) { this.props.onFocus(); }
         this.setState({isFocused: true});
@@ -84,13 +91,14 @@ class BaseExpensiTextInput extends Component {
             inputStyle,
             ignoreLabelTranslateX,
             innerRef,
+            autoFocus,
             ...inputProps
         } = this.props;
 
         const hasLabel = Boolean(label.length);
         return (
             <View style={[styles.componentHeightLarge, ...containerStyles]}>
-                <TouchableWithoutFeedback onPress={() => this.input.focus()}>
+                <TouchableWithoutFeedback onPress={() => this.input.focus()} focusable={false}>
                     <View
                         style={[
                             styles.expensiTextInputContainer,