Question - How to change 'username' in login to 'email' when using withAuthenticator

[mjmostachetti]

Before opening, please confirm:

• [X] I have searched for duplicate or closed issues and discussions.
• [X] I have read the guide for submitting bug reports.
• [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

React Native

Amplify APIs

Authentication

Amplify Categories

No response

Environment information

System: OS: macOS 12.6.1 CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz Memory: 164.33 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 17.0.1 - /usr/local/bin/node Yarn: 1.22.17 - /usr/local/bin/yarn npm: 8.1.0 - /usr/local/bin/npm Watchman: 2021.11.15.00 - /usr/local/bin/watchman Browsers: Chrome: 109.0.5414.119 Firefox: 107.0 Safari: 16.1 npmPackages: @aws-sdk/client-cognito-identity: ^3.128.0 => 3.128.0 (3.6.1) @aws-sdk/client-kinesis: ^3.128.0 => 3.128.0 (3.6.1) @aws-sdk/credential-provider-cognito-identity: ^3.128.0 => 3.128.0 (3.6.1) @azure/core-asynciterator-polyfill: ^1.0.2 => 1.0.2 @babel/core: ^7.12.9 => 7.17.5 (7.20.5) @babel/runtime: ^7.12.5 => 7.17.2 (7.18.3, 7.18.9) @craftzdog/react-native-buffer: ^6.0.4 => 6.0.4 @notifee/react-native: ^7.4.0 => 7.4.0 @react-native-async-storage/async-storage: ^1.17.7 => 1.17.7 @react-native-community/datetimepicker: ^6.3.2 => 6.3.2 @react-native-community/eslint-config: ^2.0.0 => 2.0.0 @react-native-community/netinfo: ^8.2.0 => 8.2.0 @react-native-picker/picker: ^2.4.1 => 2.4.1 @react-navigation/drawer: ^6.3.1 => 6.3.1 @react-navigation/native: ^6.0.8 => 6.0.8 @react-navigation/native-stack: ^6.5.0 => 6.5.0 @types/jest: ^26.0.23 => 26.0.24 @types/react-native: ^0.66.15 => 0.66.16 @types/react-test-renderer: ^17.0.1 => 17.0.1 @typescript-eslint/eslint-plugin: ^5.7.0 => 5.12.1 (3.10.1) @typescript-eslint/parser: ^5.7.0 => 5.12.1 (3.10.1) HelloWorld: 0.0.1 amazon-cognito-identity-js: ^5.2.8 => 5.2.8 (5.2.9) aws-amplify: 4.3.26 => 4.3.26 aws-amplify-react-native: 7.0.1 => 7.0.1 babel-jest: ^26.6.3 => 26.6.3 date-fns: ^2.29.3 => 2.29.3 eslint: ^7.14.0 => 7.32.0 eventemitter3: ^4.0.7 => 4.0.7 hermes-inspector-msggen: 1.0.0 jest: ^26.6.3 => 26.6.3 metro-config: ^0.72.0 => 0.72.0 (0.66.2) metro-react-native-babel-preset: ^0.66.2 => 0.66.2 (0.72.0) native-base: ^3.4.9 => 3.4.9 react: 17.0.2 => 17.0.2 react-native: 0.67.5 => 0.67.5 react-native-biometrics: ^2.2.0 => 2.2.0 react-native-bluetooth-state-manager: ^1.3.3 => 1.3.3 react-native-device-info: ^10.0.2 => 10.0.2 react-native-error-boundary: ^1.1.12 => 1.1.12 react-native-geolocation-service: ^5.3.0 => 5.3.0 react-native-gesture-handler: ^2.8.0 => 2.8.0 react-native-get-random-values: ^1.8.0 => 1.8.0 react-native-mask-input: ^1.2.2 => 1.2.2 react-native-notifications: ^4.3.1 => 4.3.3 react-native-reanimated: ^2.4.1 => 2.4.1 react-native-safe-area-context: ^4.3.1 => 4.3.1 react-native-screens: ^3.13.1 => 3.13.1 react-native-sensors: ^7.3.6 => 7.3.6 react-native-svg: ^13.6.0 => 13.6.0 react-native-svg-transformer: ^1.0.0 => 1.0.0 react-native-url-polyfill: ^1.3.0 => 1.3.0 react-native-version-info: ^1.1.1 => 1.1.1 react-test-renderer: 17.0.2 => 17.0.2 typescript: ^4.4.4 => 4.5.5 npmGlobalPackages: @aws-amplify/cli: 8.5.1 ember-cli: 3.7.1 expo-cli: 5.4.9 forever: 0.15.3 generator-keystone: 0.5.1 graphql-default-value-transformer: 2.0.1 jshint: 2.10.1 lighthouse: 4.0.0-alpha.2-3.2.1 npm: 8.1.0 sass-lint: 1.12.1 template-file: 6.0.1 yo: 2.0.5

Describe the bug

Not a bug, but a question. I can't find in the docs where/if I can change the 'username' label to 'email' since that's what the field is expecting. Thanks.

Expected behavior

A way to change the label in the sign up / sign in form

Reproduction steps

N/A

Code Snippet

// Put your code below this line.

Log output

``` // Put your logs below this line ```

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

[cwomack]

Hello, @mjmostachetti 👋. Have you seen the Form Field Customization and Login Mechanisms sections of the Amplify UI docs for React Native? You should be able to customize the fields as it shows, but I'll transfer this issue over the amplify-ui repo to ensure that team can give you further assistance tied the UI Components.

[mjmostachetti]

@cwomack Thanks for the tips.

[reesscot]

@mjmostachetti Please let us know if you have any more questions!

[reesscot]

Closing out since there were no further questions, but feel free to reopen if you have another question.