aws-amplify / aws-amplify/amplify-ui

Better text customization - Ability to customize Create Account button Text

Open
#3,347 4 comments 0 reactions 0 assignees View on GitHub
Authenticator feature-request
Dominant language
TypeScript
Stars
1.1k
Forks
347
Avg merge
18h 29m
Merged PRs (30d)
9

Description

### On which framework/platform would you like to see this feature implemented?

React

### Which UI component is this feature-request for?

Authenticator

### Please describe your feature-request in detail.

We would like to be able to customize the text for sign up button using I18n.putVocabulariesForLanguage(). Thank you.

Currently getCreateAccountText() is being used for the sign up button in the SignUp.tsx
`
{getCreateAccountText()}
`

It seems that SIGN_UP_BUTTON is defined in [defaultTexts.ts](https://github.com/aws-amplify/amplify-ui/blob/68c0a0e1c89ede36b4b0bdd7aad8f82f8c5b23b7/packages/ui/src/i18n/dictionaries/authenticator/defaultTexts.ts#L56) which may intentionally create for customization purpose, but it is not being used.

References:
1. [textUtils.tx](https://github.com/aws-amplify/amplify-ui/blob/68c0a0e1c89ede36b4b0bdd7aad8f82f8c5b23b7/packages/ui/src/helpers/authenticator/textUtil.ts#L120)
2. [SignUp.tsx](https://github.com/aws-amplify/amplify-ui/blob/68c0a0e1c89ede36b4b0bdd7aad8f82f8c5b23b7/packages/react/src/components/Authenticator/SignUp/SignUp.tsx#L53)

### Please describe a solution you'd like.

_No response_

### We love contributors! Is this something you'd be interested in working on?

- [ ] 👋 I may be able to implement this feature request.
- [ ] ⚠️ This feature might incur a breaking change.

Contributor guide

Open the contributing guide

Research direction

Start with packages/react/src/components/Authenticator/SignUp/SignUp.tsx and packages/ui/src/helpers/authenticator/textUtil.ts, then inspect SIGN_UP_BUTTON in packages/ui/src/i18n/dictionaries/authenticator/defaultTexts.ts. Confirm how I18n.putVocabulariesForLanguage() supplies the vocabulary, and verify that the Create Account button displays the customized text.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend, internationalization
Issue type
Feature
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.