feat(ui): add OIDC ConfigureSSO wizard skeleton#9200
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
🦋 Changeset detectedLatest commit: 09cfbe7 The changes in this PR will be included in the next version bump. This PR includes changesets to release 0 packagesWhen 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 |
@clerk/astro
@clerk/backend
@clerk/chrome-extension
@clerk/clerk-js
@clerk/electron
@clerk/electron-passkeys
@clerk/eslint-plugin
@clerk/expo
@clerk/expo-passkeys
@clerk/express
@clerk/fastify
@clerk/hono
@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: |
API Changes Report
Summary
@clerk/sharedCurrent version: 4.25.5 Subpath
|
📝 WalkthroughWalkthroughAdds OIDC provider type definitions and provider-specific enterprise connection validation. The SSO provider selector now conditionally displays and normalizes OIDC providers behind a feature flag. Provider routing recognizes backend-derived OIDC identifiers and renders an unsupported state for unknown providers. A four-step OIDC configuration wizard was added with localized labels and navigation controls, alongside expanded domain, selector, routing, and hook tests and two changeset entries. Estimated code review effort: 3 (Moderate) | ~25 minutes Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@packages/ui/src/components/ConfigureSSO/domain/organizationEnterpriseConnection.ts`:
- Line 16: Update isOidcProvider to require the `oidc_` prefix, matching the
OidcProviderType contract and excluding bare or malformed values such as `oidc`
and `oidcfoo`; add a regression test covering these unsupported inputs and
preserving valid OIDC values.
In `@packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/index.tsx`:
- Around line 90-96: Localize the unsupported-provider fallback in the
ConfigureStep component by adding typed
configureSSO.configureStep.unsupportedProvider resource keys for the title and
description, then render both through localizationKeys. Follow the existing OIDC
localization contract and keep the terminal UI on the same localization path
instead of using English literals.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Organization UI (inherited)
Review profile: CHILL
Plan: Pro Plus
Run ID: 7c43c83d-8790-40f9-a66e-d611f185371a
📒 Files selected for processing (14)
.changeset/cool-dragons-march.md.changeset/spotty-items-dream.mdpackages/localizations/src/en-US.tspackages/shared/src/types/localization.tspackages/ui/src/components/ConfigureSSO/domain/__tests__/organizationEnterpriseConnection.test.tspackages/ui/src/components/ConfigureSSO/domain/organizationEnterpriseConnection.tspackages/ui/src/components/ConfigureSSO/hooks/__tests__/useOrganizationEnterpriseConnection.test.tsxpackages/ui/src/components/ConfigureSSO/steps/ConfigureStep/__tests__/ConfigureStep.test.tsxpackages/ui/src/components/ConfigureSSO/steps/ConfigureStep/index.tsxpackages/ui/src/components/ConfigureSSO/steps/ConfigureStep/oidc/OidcCustomConfigureSteps.tsxpackages/ui/src/components/ConfigureSSO/steps/ConfigureStep/oidc/index.tsxpackages/ui/src/components/ConfigureSSO/steps/SelectProviderStep.tsxpackages/ui/src/components/ConfigureSSO/steps/__tests__/SelectProviderStep.test.tsxpackages/ui/src/components/ConfigureSSO/types.ts
🔗 Linked repositories identified
CodeRabbit considers these linked repositories for cross-repo context during reviews:
clerk/clerk_go(manual)clerk/dashboard(manual)clerk/accounts(manual)clerk/backoffice(manual)clerk/clerk(manual)clerk/clerk-docs(manual)clerk/cloudflare-workers(manual)
| * not a fixed enum. SAML providers stay exact literals. Single source of the | ||
| * prefix notion — dispatch and configuration checks both read it from here. | ||
| */ | ||
| export const isOidcProvider = (provider: string): provider is OidcProviderType => provider.startsWith('oidc'); |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Match the guard to the OIDC key contract.
Line 16 classifies oidc and oidcfoo as OIDC even though they do not match OidcProviderType (oidc_${string}). This can route malformed backend values into the OIDC wizard instead of the unsupported-provider fallback. Require the underscore delimiter and add a regression test.
Proposed fix
-export const isOidcProvider = (provider: string): provider is OidcProviderType => provider.startsWith('oidc');
+export const isOidcProvider = (provider: string): provider is OidcProviderType => provider.startsWith('oidc_');📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export const isOidcProvider = (provider: string): provider is OidcProviderType => provider.startsWith('oidc'); | |
| export const isOidcProvider = (provider: string): provider is OidcProviderType => provider.startsWith('oidc_'); |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In
`@packages/ui/src/components/ConfigureSSO/domain/organizationEnterpriseConnection.ts`
at line 16, Update isOidcProvider to require the `oidc_` prefix, matching the
OidcProviderType contract and excluding bare or malformed values such as `oidc`
and `oidcfoo`; add a regression test covering these unsupported inputs and
preserving valid OIDC values.
| // A provider the SDK doesn't recognize (e.g. a newer backend family) | ||
| // degrades to a terminal state instead of white-screening the wizard. | ||
| <> | ||
| <Step.Header | ||
| title='Unsupported provider' | ||
| description='This identity provider isn’t supported in this version of Clerk. Update to the latest version to finish setting it up.' | ||
| /> |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Localize the unsupported-provider fallback.
These literals bypass the localization resource, so non-English installations always receive English. Add typed configureSSO.configureStep.unsupportedProvider keys and render them through localizationKeys.
Based on the existing OIDC localization contract, keep this terminal UI in the same localization path.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/ui/src/components/ConfigureSSO/steps/ConfigureStep/index.tsx` around
lines 90 - 96, Localize the unsupported-provider fallback in the ConfigureStep
component by adding typed configureSSO.configureStep.unsupportedProvider
resource keys for the title and description, then render both through
localizationKeys. Follow the existing OIDC localization contract and keep the
terminal UI on the same localization path instead of using English literals.
1 participant
Summary
Testing
CleanShot.2026-07-20.at.17.28.42.mp4