aws-amplify / aws-amplify/amplify-ui

FR (Authenticator): Password requirement hints in ConfirmResetPassword & ForceNewPassword

Open
#2,422 4 comments 8 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.

Right now, in ConfirmResetPassword and ForceNewPassword, a validation about both PasswordField matching is being made but what about adding an option for additional requirements such as Length, Numbers, Special Characters, Capital and Lowercase letter, etc.

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

Right now our team is using the package react-password-checklist (https://www.npmjs.com/package/react-password-checklist) in the Footer section of ConfirmResetPassword but this method requires adding eventListeners. Also we cannot use the same method for now in ForceNewPassword as it only supports FormFields instead of Footer like most of the components from Authenticator.

So the solution would be to simply add a props to the FormFields of each component with PasswordField like this :
```
ForceNewPassword: {
PasswordRequirement: () => {
'match': true,
'minLength': 8,
'number': true,
'specialChar': true,
'capital': true,
'lowercase': true
}
};
```

### 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 by locating the React Authenticator implementations for ConfirmResetPassword and ForceNewPassword, especially their PasswordField and FormFields handling. Review the existing matching validation and determine how the requested configurable requirements should work in both components; done means the requirements are supported consistently without the external event-listener workaround.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
authentication, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.