feat(ui): Extract <ProviderIcon /> component
#7633
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
🦋 Changeset detectedLatest commit: fe0801e The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
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 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
📝 WalkthroughWalkthroughAdds a new 🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
@clerk/agent-toolkit
@clerk/astro
@clerk/backend
@clerk/chrome-extension
@clerk/clerk-js
@clerk/dev-cli
@clerk/expo
@clerk/expo-passkeys
@clerk/express
@clerk/fastify
@clerk/localizations
@clerk/nextjs
@clerk/nuxt
@clerk/react
@clerk/react-router
@clerk/shared
@clerk/tanstack-react-start
@clerk/testing
@clerk/ui
@clerk/upgrade
@clerk/vue
commit: |
![coderabbitai[bot]](https://d.iamgay.cn/https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx`:
- Around line 156-170: The component dereferences
providerToDisplayData[account.provider] in multiple places but only guards it
inside ImageOrInitial, causing a runtime crash when provider data is missing;
centralize retrieval by creating a single providerData variable from
providerToDisplayData[account.provider] at the top of the render (used by
ImageOrInitial, label rendering, and descriptors), then use safe fallbacks
(e.g., a generic icon URL or a fallback name like account.provider or "Unknown
provider") wherever providerData is undefined; update ImageOrInitial, the label
text usage, and any
descriptors.socialButtonsProviderIcon.setId(account.provider) usage to reference
this providerData/fallback so no direct dereference of
providerToDisplayData[account.provider].name remains.
packages/ui/src/components/UserProfile/ConnectedAccountsSection.tsx
Outdated
Show resolved
Hide resolved
alexcarpenter
commented
Jan 21, 2026
| isDisabled={card.isLoading} | ||
| src={strategyToDisplayData[strategy].iconUrl} | ||
| alt={`Connect ${strategyToDisplayData[strategy].name}`} | ||
| sx={theme => ({ width: theme.sizes.$5 })} |
Member
Author
There was a problem hiding this comment.
Unsure why we'd increase the size of the web3 icons here. I removed, so its consistent with the SSO icons, but let me know if this was intentional.
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@packages/ui/src/common/__tests__/ProviderIcon.test.tsx`:
- Line 49: Remove the unused "container" variable from the render()
destructuring in the ProviderIcon.test.tsx test cases; locate the render(...)
calls that currently do "const { container, ... } = render(...)" and delete
"container" from the destructured list (or simply use "render(...)" without
destructuring if nothing else is needed) so ESLint's no-unused-vars is not
triggered — apply this change for all test cases that currently destructure
container (the occurrences noted in the review).
alexcarpenter
force-pushed
the
alexcarpenter/consolidate-provider-icon-component
branch
from
855c0b4 to
0c61521
Compare
alexcarpenter
commented
Jan 21, 2026
alexcarpenter
commented
Jan 21, 2026
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Follow up to #7560
Extract
<ProviderIcon />component to ensure consistency across the usages. Ensures icons are inverted properly, not just within sign-in or sign-up components.Checklist
pnpm testruns as expected.pnpm buildruns as expected.Type of change
Summary by CodeRabbit
New Features
Refactor
Tests
✏️ Tip: You can customize this high-level summary in your review settings.