Skip to content

feat(settings): add passwordless otp ui#20104

Draft
StaberindeZA wants to merge 2 commits intomainfrom
fxa-13017-frontend-otp
Draft

feat(settings): add passwordless otp ui#20104
StaberindeZA wants to merge 2 commits intomainfrom
fxa-13017-frontend-otp

Conversation

@StaberindeZA
Copy link
Contributor

Because

  • The passwordless otp signup/signin needs its own pages that vary slightly from existing signin flows.

This pull request

  • Adds signin and signup pages, containers and components

Issue that this pull request solves

Closes: #FXA-13017

Checklist

Put an x in the boxes that apply

  • My commit is GPG signed.
  • If applicable, I have modified or added tests which pass locally.
  • I have added necessary documentation (if appropriate).
  • I have verified that my changes render correctly in RTL (if appropriate).

Screenshots (Optional)

Please attach the screenshots of the changes made in case of change in user interface.

Other information (Optional)

Any other information that is important to this pull request.

@StaberindeZA StaberindeZA force-pushed the fxa-13017-frontend-otp branch 2 times, most recently from 11bd7a8 to 9f206b5 Compare February 26, 2026 18:01
Comment on lines +40 to +42
getClientId(): string | undefined {
return this.opts?.clientId || undefined;
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Reason for this change is so that a clientId can be sent to the passwordless routes in auth-server, which check if passwordless OTP is enabled for specific clientIds.

return;
}

if (isSignup) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I noticed different behavior depending on whether its sign up or sign in, so I mostly copied the logic from Signin/index.tsx and Signup/index.tsx

default: /^$/,
env: 'PASSWORDLESS_FORCED_EMAIL_REGEX',
},
allowedClientIds: {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ross mentioned that they wanted to roll this out to settings first, so we might need to update this to support that, not sure how but we can file a follow up.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

My intention with the change to the web-integration, mentioned in this comment, was to enable this.

My assumption is that clientId is undefined for fxa-settings, so the change to web-integration updates that logic, so that it returns the FxA Settings clientId instead. Would this work?

const wantsKeys = integration.wantsKeys();
const isOAuth = isOAuthWebIntegration(integration);

// Passwordless eligibility:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍🏽

}
} else {
const isFullyVerified =
result.verified && result.verified;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Typo?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, this was temporary. I copied this from the password signin page which had sessionVerified and I wasn't sure what that was exactly. I had a quick look and doesn't seem its applicable to passwordless otp?

@StaberindeZA StaberindeZA force-pushed the fxa-13017-frontend-otp branch from 1b1e561 to f73a849 Compare February 27, 2026 21:08
Because:

- The passwordless otp signup/signin needs its own pages that vary
  slightly from existing signin flows.

This commit:

- Adds signin and signup pages, containers and components

Closes #FXA-13017
@StaberindeZA StaberindeZA force-pushed the fxa-13017-frontend-otp branch from f73a849 to b759e8e Compare March 2, 2026 21:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants