fix(ui): UserProfile should show attributes enabled for sign in by dmoerner · Pull Request #8042 · clerk/javascript

dmoerner · 2026-03-11T17:35:04Z

Description

Our Dashboard supports instance configurations with email, phone, or username used for sign in, but not used for sign up. This can be useful in cases where accounts are pre-provisioned by the backend, or where users can only add identifiers after sign up. Internally, we represent this as {"enabled": false, "used_for_first_factor": true}.

The UserProfile currently guards the display of these identifiers behind enabled, which actually maps on to "enabled for sign up". Correct these guards to check for whether the attribute is used for first or second factor sign in as well.

This allows users to both add and also verify these identifications. Email link verification has an additional guard which also requires adjustment.

Fixes USER-4904.

This is an instance with username, email, and phone enabled only for sign in. The user can still add and change them.

Checklist

pnpm test runs as expected.
pnpm 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

Summary by CodeRabbit

Bug Fixes
- Fixed UserProfile to display sign-in enabled attributes (email, phone, username) correctly, regardless of sign-up settings

…ributes-enabled-for-sign-in

vercel · 2026-03-11T17:35:10Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	Jun 11, 2026 2:39am
swingset	Ready	Preview, Comment	Jun 11, 2026 2:39am

changeset-bot · 2026-03-11T17:35:11Z

🦋 Changeset detected

Latest commit: af31b7f

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

This PR includes changesets to release 3 packages

Name	Type
@clerk/ui	Patch
@clerk/chrome-extension	Patch
@clerk/swingset	Patch

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

…ributes-enabled-for-sign-in

coderabbitai · 2026-04-16T17:43:37Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository YAML (base), Repository UI (inherited)

Review profile: CHILL

Plan: Pro

Run ID: 8f5d93a2-3e0d-4bb1-887a-bb16fab935b0

📥 Commits

Reviewing files that changed from the base of the PR and between 4584aa1 and af31b7f.

📒 Files selected for processing (3)

packages/ui/src/components/UserProfile/AccountPage.tsx
packages/ui/src/components/UserProfile/EmailForm.tsx
packages/ui/src/components/UserProfile/utils.ts

📝 Walkthrough

Walkthrough

This PR modifies UserProfile components to display disabled user attributes when they are configured as first or second factor authentication requirements, by introducing an isAttributeAvailable predicate that checks both the enabled flag and authentication factor usage.

Changes

Display disabled attributes used for sign-in

Layer / File(s)	Summary
isAttributeAvailable predicate in utils `packages/ui/src/components/UserProfile/utils.ts`	New `isAttributeAvailable(attr)` export determines whether an attribute is enabled or used for first/second-factor authentication, enabling visibility for disabled attributes required for sign-in.
AccountPage attribute visibility `packages/ui/src/components/UserProfile/AccountPage.tsx`	Updates `showUsername`, `showEmail`, and `showPhone` flags to use `isAttributeAvailable()` instead of checking the `enabled` property directly, allowing disabled but sign-in-required attributes to render their sections.
EmailForm email-link enablement `packages/ui/src/components/UserProfile/EmailForm.tsx`	Updates email-link verification condition to call `isAttributeAvailable(email_address)` alongside the `verifications` check, replacing the prior `enabled` dependency.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested reviewers

alexcarpenter

Poem

🐰 A user's sign-in needs were long hidden away,
But now disabled attributes shine in the fray,
With factors required, they show their true face,
Availability checks grant them their place,
No more shall authentication lose the race!

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: updating UserProfile to display attributes that are enabled for sign-in, even if disabled for sign-up.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

jacekradko · 2026-04-17T17:54:01Z

-  const showUsername = attributes.username?.enabled;
-  const showEmail = attributes.email_address?.enabled;
-  const showPhone = attributes.phone_number?.enabled;
+  const showUsername = isAttributeAvailable(attributes.username);


What do you think about moving this availability logic to a computed property on AttributeData objects rather than a standalone utility function. UserSettings already has getters for pre-computed properties so it's an established pattern and it keeps the responsibility close to the data object

Reasonable suggestion. I did this in 8f1e53b :). Thanks!

Coming back to this after a closer look, I have to walk back my suggestion: your original version was right, and moving it onto UserSettings creates a cross-bundle hazard I missed. ui.browser.js and clerk.browser.js load independently (both float on their major tags, and apps can pin clerkJSVersion), so a new ui can run against a clerk-js that doesn't have the getter yet. In that pairing userSettings.availableAttributes is undefined, the .includes() calls throw on first render, and since all components share one React root, the whole Clerk UI unmounts. The attribute data is safe to read across bundles (it comes from FAPI and older clerk-js copies it as-is); prototype getters are not.

To keep this moving I pushed af31b7f, which reverts 8f1e53b and the prettier follow-up, restoring your isAttributeAvailable helper. All tests pass unchanged and the changeset is right as-is (so disregard my comment there too). Your JSDoc on the helper also answered "available for what?" better than a getter on the public UserSettings contract could, and it keeps password off that surface, which USER-4904 explicitly warns about.

I filed SDK-115 to track the skew problem generally, since this pattern turned out to be very easy to fall into. Sorry for the round trip!

vercel · 2026-04-20T19:27:58Z

Deployment failed with the following error:

You must set up Two-Factor Authentication before accessing this team.

View Documentation: https://vercel.com/docs/two-factor-authentication

pkg-pr-new · 2026-04-20T19:32:17Z

Open in StackBlitz

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@8042

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@8042

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@8042

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@8042

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@8042

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@8042

@clerk/express

npm i https://pkg.pr.new/@clerk/express@8042

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@8042

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@8042

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@8042

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@8042

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@8042

@clerk/react

npm i https://pkg.pr.new/@clerk/react@8042

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@8042

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@8042

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@8042

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@8042

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@8042

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@8042

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@8042

commit: af31b7f

…ributes-enabled-for-sign-in

github-actions · 2026-06-10T00:24:52Z

Hello 👋

We currently close PRs after 60 days of inactivity. It's been 50 days since the last update here. If we missed this PR, please reply here. Otherwise, we'll close this PR in 10 days.

Thanks for being a part of the Clerk community! 🙏

…ributes-enabled-for-sign-in

github-actions · 2026-06-10T22:02:05Z

API Changes Report

Generated by Break Check on 2026-06-11T02:41:37.451Z

Summary

Metric	Count
Packages analyzed	19
Packages with changes	0
🔴 Breaking changes	0
🟡 Non-breaking changes	0
🟢 Additions	0

Note
Break Check could not snapshot 3 subpaths; the diff below excludes them.

@clerk/astro ./env: Internal Error: Unable to determine module for: /home/runner/_work/javascript/javascript/packages/astro/env.d.ts You have encountered a software defect. Please consider reporting the issue to the maintainers of this application.

@clerk/shared ./cookie: Internal Error: Unable to follow symbol for "Cookies" You have encountered a software defect. Please consider reporting the issue to the maintainers of this application.

@clerk/testing ./cypress: Symbol not found for identifier: Cypress

No API Changes Detected

All packages have stable APIs with no detected changes.

Report generated by Break Check

_{Last ran on af31b7f.}

…ings getter Reverts 8f1e53b and e848ffc, restoring the original isAttributeAvailable helper in the UserProfile utils. ui.browser.js and clerk.browser.js are loaded independently (floating major tags, pinnable clerkJSVersion), so @clerk/ui can run against a clerk-js that does not have the availableAttributes getter; the unguarded .includes() calls would then crash every mounted Clerk component. The attribute data itself is FAPI-provided and safe to read across bundle versions. See SDK-115.

dmoerner added 4 commits March 9, 2026 21:25

fix(ui): Display attributes enabled for sign in

39ac1ee

Merge branch 'main' into daniel/user-4904-userprofile-should-show-att…

a91df64

…ributes-enabled-for-sign-in

chore: changeset

a389214

chore: Add unit tests for email and phone verification

abe963c

github-actions Bot added the ui label Mar 11, 2026

vercel Bot deployed to Preview March 11, 2026 17:35 View deployment

Merge branch 'main' into daniel/user-4904-userprofile-should-show-att…

ae81c5a

…ributes-enabled-for-sign-in

vercel Bot deployed to Preview April 16, 2026 17:33 View deployment

dmoerner marked this pull request as ready for review April 16, 2026 17:40

jacekradko reviewed Apr 17, 2026

View reviewed changes

fix: Precalculate available attributes on usersettings object

8f1e53b

github-actions Bot added the clerk-js label Apr 20, 2026

Merge branch 'main' into daniel/user-4904-userprofile-should-show-att…

b17a9c5

…ributes-enabled-for-sign-in

vercel Bot deployed to Preview April 20, 2026 19:50 View deployment

prettier

e848ffc

vercel Bot deployed to Preview April 20, 2026 21:05 View deployment

github-actions Bot added the Stale label Jun 10, 2026

Merge branch 'main' into daniel/user-4904-userprofile-should-show-att…

4584aa1

…ributes-enabled-for-sign-in

vercel Bot deployed to Preview – clerk-js-sandbox June 10, 2026 21:59 View deployment

vercel Bot deployed to Preview – swingset June 10, 2026 22:00 View deployment

github-actions Bot removed the Stale label Jun 11, 2026

jacekradko reviewed Jun 11, 2026

View reviewed changes

Comment thread packages/ui/src/components/UserProfile/AccountPage.tsx Outdated

vercel Bot deployed to Preview – clerk-js-sandbox June 11, 2026 02:39 View deployment

vercel Bot deployed to Preview – swingset June 11, 2026 02:39 View deployment

jacekradko approved these changes Jun 11, 2026

View reviewed changes

Conversation

dmoerner commented Mar 11, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Checklist

Type of change

Summary by CodeRabbit

Uh oh!

vercel Bot commented Mar 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

changeset-bot Bot commented Mar 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

coderabbitai Bot commented Apr 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

Estimated code review effort

Suggested reviewers

Poem

❌ Failed checks (1 warning)

Uh oh!

jacekradko Apr 17, 2026

Choose a reason for hiding this comment

Uh oh!

dmoerner Apr 20, 2026

Choose a reason for hiding this comment

Uh oh!

jacekradko Jun 11, 2026

Choose a reason for hiding this comment

Uh oh!

vercel Bot commented Apr 20, 2026

Uh oh!

pkg-pr-new Bot commented Apr 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jun 10, 2026

Uh oh!

github-actions Bot commented Jun 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

API Changes Report

Summary

No API Changes Detected

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

dmoerner commented Mar 11, 2026 •

edited by coderabbitai Bot

Loading

vercel Bot commented Mar 11, 2026 •

edited

Loading

changeset-bot Bot commented Mar 11, 2026 •

edited

Loading

coderabbitai Bot commented Apr 16, 2026 •

edited

Loading

pkg-pr-new Bot commented Apr 20, 2026 •

edited

Loading

github-actions Bot commented Jun 10, 2026 •

edited

Loading