Skip to content

Commit

Permalink
rename android_errorMessage to errorMessageAndroid
Browse files Browse the repository at this point in the history
Following same implementation used with underlineColorAndroid
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/TextInput.js#L470
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js#L203

While with other components (for example prop android_ripple), we use
the android_ prefix to denote platform specific props.
facebook#29157 (comment)
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/Pressable/Pressable.js#L177

In the case of TextInput we already have Platform Logic that detects
Android/iOS platform.
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/TextInput.js#L1268

For this reason TextInput component does not use android_ props and
instead uses this naming convention underlineColorAndroid.

To be noted that the prop underlineColorAndroid is passed to both iOS
and Android version, while other props have platform specific logic for
android and iOS.
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/TextInput.js#L1334
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/TextInput.js#L1293

Example of a prop that have a specific value on Android and is different
from iOS
https://github.com/fabriziobertoglio1987/react-native/blob/15810e96d90e18dbd424666338fdec0127d403ed/Libraries/Components/TextInput/TextInput.js#L1271

I decided to follow the same solution used in underlineColorAndroid.
  • Loading branch information
fabOnReact committed Mar 23, 2022
1 parent 15810e9 commit cad239b
Show file tree
Hide file tree
Showing 5 changed files with 14 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,14 @@ export type NativeProps = $ReadOnly<{|
'off',
>,

/**
* String to be read by screenreaders to indicate an error state. If this value is
* not null, an error will be announced. You can use onChangeText or onBlur to
* detect an error and set this prop. Once the error is gone, set this to null
* to clear the error
*/
errorMessageAndroid?: ?Stringish,

/**
* Sets the return key to the label. Use it instead of `returnKeyType`.
* @platform android
Expand Down Expand Up @@ -698,7 +706,7 @@ export const __INTERNAL_VIEW_CONFIG: PartialViewConfig = {
inlineImageLeft: true,
editable: true,
fontVariant: true,
android_errorMessage: true,
errorMessageAndroid: true,
borderBottomRightRadius: true,
borderBottomColor: {process: require('../../StyleSheet/processColor')},
borderRadius: true,
Expand Down
2 changes: 1 addition & 1 deletion Libraries/Components/TextInput/TextInput.js
Original file line number Diff line number Diff line change
Expand Up @@ -408,7 +408,7 @@ type AndroidProps = $ReadOnly<{|
* detect an error and set this prop. Once the error is gone, set this to null
* to clear the error
*/
android_errorMessage?: ?Stringish,
errorMessageAndroid?: ?Stringish,

importantForAutofill?: ?(
| 'auto'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,6 @@ public class ViewProps {
public static final String BACKGROUND_COLOR = "backgroundColor";
public static final String FOREGROUND_COLOR = "foregroundColor";
public static final String COLOR = "color";
public static final String ANDROID_ERROR_MESSAGE = "android_errorMessage";
public static final String FONT_SIZE = "fontSize";
public static final String FONT_WEIGHT = "fontWeight";
public static final String FONT_STYLE = "fontStyle";
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -373,8 +373,8 @@ public void updateExtraData(ReactEditText view, Object extraData) {
}
}

@ReactProp(name = ViewProps.ANDROID_ERROR_MESSAGE)
public void setErrorMessage(ReactEditText view, String error) {
@ReactProp(name = "errorMessageAndroid")
public void setErrorMessage(ReactEditText view, @Nullable String error) {
view.setError(error);
}

Expand Down Expand Up @@ -1328,9 +1328,7 @@ public Object updateState(

@Nullable
String errorMessage =
props.hasKey(ViewProps.ANDROID_ERROR_MESSAGE)
? props.getString(ViewProps.ANDROID_ERROR_MESSAGE)
: null;
props.hasKey("errorMessageAndroid") ? props.getString("errorMessageAndroid") : null;

return ReactTextUpdate.buildReactTextUpdateFromState(
spanned,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -483,7 +483,7 @@ function ErrorExample(): React.Node {
Type error in the below TextInput to display an error message.
</Text>
<TextInput
android_errorMessage={error}
errorMessageAndroid={error}
onBlur={() => setError('onBlur')}
onEndEditing={() => setError('onEndEditing')}
onChangeText={newText => {
Expand Down

0 comments on commit cad239b

Please sign in to comment.