Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(ui): Render email or phone number during verification step #3694

Conversation

alexcarpenter
Copy link
Member

@alexcarpenter alexcarpenter commented Jul 11, 2024

Description

  • Add <SignUpIdentifier /> component to render either the formatted phone number or email address.
  • Render email address during email_code verification step
  • Render formatted phone number during phone_code verification step
  • Fixes phone number rendering when returning to the start step

https://linear.app/clerk/issue/SDK-1830/add-signup-elements-for-accessing-email-address-and-phone-number

Checklist

  • npm test runs as expected.
  • npm run build runs as expected.
  • (If applicable) JSDoc comments have been added or updated for any package exports
  • (If applicable) Documentation has been updated

Type of change

  • 🐛 Bug fix
  • 🌟 New feature
  • 🔨 Breaking change
  • 📖 Refactoring / dependency upgrade / documentation
  • other:

Copy link

changeset-bot bot commented Jul 11, 2024

🦋 Changeset detected

Latest commit: ca02d78

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 0 packages

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@alexcarpenter alexcarpenter changed the title feat(ui): render email and phone number during verification step feat(ui): Render email and phone number during verification step Jul 11, 2024
@alexcarpenter alexcarpenter changed the title feat(ui): Render email and phone number during verification step feat(ui): Render email or phone number during verification step Jul 11, 2024
@alexcarpenter alexcarpenter requested a review from joe-bell July 11, 2024 21:34
Copy link
Member

@octoper octoper left a comment

Choose a reason for hiding this comment

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

💯

export function SignUpIdentifier({ emailAddress, phoneNumber }: Identifier) {
const { client } = useClerk();
const signUpEmailAddress = client.signUp.emailAddress;
const { formattedNumberWithCode: signUpPhoneNumber } = parsePhoneString(client.signUp.phoneNumber || '');
Copy link
Member

Choose a reason for hiding this comment

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

❔ Minor thing feel free to ignore, should we consider moving the parsing here inside the if statement below to avoid calling parsePhoneString when there is no phone number?

Copy link
Member Author

Choose a reason for hiding this comment

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

Good idea ca02d78

@alexcarpenter alexcarpenter enabled auto-merge (squash) July 11, 2024 23:35
@alexcarpenter alexcarpenter merged commit e2782ed into main Jul 11, 2024
16 checks passed
@alexcarpenter alexcarpenter deleted the alexcarpenter/sdk-1830-add-signup-elements-for-accessing-email-address-and-phone-2 branch July 11, 2024 23:56
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