From a00bb64a042ef34cd3026392e25401af219d0060 Mon Sep 17 00:00:00 2001 From: Rajat Parashar Date: Fri, 28 Jan 2022 14:24:18 +0530 Subject: [PATCH 1/2] Merge TextInputWithName to our TextInput component --- src/components/TextInput/BaseTextInput.js | 6 +++--- src/components/TextInput/index.js | 8 +++++--- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js index 8be9566937ad..6091bbfbc8c0 100644 --- a/src/components/TextInput/BaseTextInput.js +++ b/src/components/TextInput/BaseTextInput.js @@ -2,6 +2,8 @@ import _ from 'underscore'; import React, {Component} from 'react'; import { Animated, View, TouchableWithoutFeedback, Pressable, AppState, Keyboard, + // eslint-disable-next-line no-restricted-imports + TextInput as RNTextInput, } from 'react-native'; import Str from 'expensify-common/lib/str'; import TextInputLabel from './TextInputLabel'; @@ -12,7 +14,6 @@ import Icon from '../Icon'; import * as Expensicons from '../Icon/Expensicons'; import InlineErrorText from '../InlineErrorText'; import * as styleConst from './styleConst'; -import TextInputWithName from '../TextInputWithName'; import Text from '../Text'; import * as StyleUtils from '../../styles/StyleUtils'; @@ -204,7 +205,7 @@ class BaseTextInput extends Component { ) : null} - { if (typeof this.props.innerRef === 'function') { this.props.innerRef(ref); } this.input = ref; @@ -227,7 +228,6 @@ class BaseTextInput extends Component { onChangeText={this.setValue} secureTextEntry={this.state.passwordHidden} onPressOut={this.props.onPress} - name={this.props.name} showSoftInputOnFocus={!this.props.disableKeyboard} /> {this.props.secureTextEntry && ( diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js index 7bb389dd0442..30a00e89b76d 100644 --- a/src/components/TextInput/index.js +++ b/src/components/TextInput/index.js @@ -6,11 +6,13 @@ import * as baseTextInputPropTypes from './baseTextInputPropTypes'; class TextInput extends React.Component { componentDidMount() { - if (!this.props.disableKeyboard) { - return; + if (this.props.disableKeyboard) { + this.textInput.setNativeProps({inputmode: 'none'}); } - this.textInput.setNativeProps({inputmode: 'none'}); + if (this.props.name) { + this.textInput.setNativeProps({name: this.props.name}); + } } render() { From 82ee3f6b4bada571cf49ab2024331a9d5c6ab777 Mon Sep 17 00:00:00 2001 From: Rajat Parashar Date: Fri, 28 Jan 2022 14:26:11 +0530 Subject: [PATCH 2/2] remove TextInputWithName component --- src/components/TextInputWithName/index.js | 41 ------------------- .../TextInputWithName/index.native.js | 21 ---------- .../textInputWithNamepropTypes.js | 19 --------- 3 files changed, 81 deletions(-) delete mode 100755 src/components/TextInputWithName/index.js delete mode 100644 src/components/TextInputWithName/index.native.js delete mode 100644 src/components/TextInputWithName/textInputWithNamepropTypes.js diff --git a/src/components/TextInputWithName/index.js b/src/components/TextInputWithName/index.js deleted file mode 100755 index 19cc05d44696..000000000000 --- a/src/components/TextInputWithName/index.js +++ /dev/null @@ -1,41 +0,0 @@ -import _ from 'underscore'; -import React from 'react'; -// eslint-disable-next-line no-restricted-imports -import {TextInput} from 'react-native'; -import textInputWithNamepropTypes from './textInputWithNamepropTypes'; - -/** - * On web we need to set the native attribute name for accessiblity. - */ -class TextInputWithName extends React.Component { - componentDidMount() { - if (!this.textInput) { - return; - } - if (_.isFunction(this.props.forwardedRef)) { - this.props.forwardedRef(this.textInput); - } - - if (this.props.name) { - this.textInput.setNativeProps({name: this.props.name}); - } - } - - render() { - return ( - this.textInput = el} - // eslint-disable-next-line react/jsx-props-no-spreading - {...this.props} - /> - ); - } -} - -TextInputWithName.propTypes = textInputWithNamepropTypes.propTypes; -TextInputWithName.defaultProps = textInputWithNamepropTypes.defaultProps; - -export default React.forwardRef((props, ref) => ( - /* eslint-disable-next-line react/jsx-props-no-spreading */ - -)); diff --git a/src/components/TextInputWithName/index.native.js b/src/components/TextInputWithName/index.native.js deleted file mode 100644 index e5f0163e446c..000000000000 --- a/src/components/TextInputWithName/index.native.js +++ /dev/null @@ -1,21 +0,0 @@ -import React from 'react'; -// eslint-disable-next-line no-restricted-imports -import {TextInput} from 'react-native'; -import textInputWithNamepropTypes from './textInputWithNamepropTypes'; - -const TextInputWithName = props => ( - -); - -TextInputWithName.propTypes = textInputWithNamepropTypes.propTypes; -TextInputWithName.defaultProps = textInputWithNamepropTypes.defaultProps; -TextInputWithName.displayName = 'TextInputWithName'; - -export default React.forwardRef((props, ref) => ( - /* eslint-disable-next-line react/jsx-props-no-spreading */ - -)); diff --git a/src/components/TextInputWithName/textInputWithNamepropTypes.js b/src/components/TextInputWithName/textInputWithNamepropTypes.js deleted file mode 100644 index 902ff2289d68..000000000000 --- a/src/components/TextInputWithName/textInputWithNamepropTypes.js +++ /dev/null @@ -1,19 +0,0 @@ -import PropTypes from 'prop-types'; - -const propTypes = { - /** Name attribute for the input */ - name: PropTypes.string, - - /** A ref to forward to the text input */ - forwardedRef: PropTypes.func, -}; - -const defaultProps = { - name: '', - forwardedRef: () => {}, -}; - -export default { - propTypes, - defaultProps, -};