Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris
, 'i'); if (__m === '*' || __re.test(location.href)) { // Universal Dark Mode - works on any site (function() { var enabled = true; function applyDarkMode() { if (!enabled) return; // Create style element if it doesn't exist var style = document.getElementById('universal-dark-mode-style'); if (!style) { style = document.createElement('style'); style.id = 'universal-dark-mode-style'; document.head.appendChild(style); } // Dark mode CSS - inverts colors but preserves images/video style.textContent = ' /* Invert everything except media */ html { filter: invert(1) hue-rotate(180deg) !important; background: #1a1a2e !important; } /* Restore images, videos, iframes, canvas */ img, video, iframe, canvas, svg, picture, [style*="background-image"] { filter: invert(1) hue-rotate(180deg) !important; } /* Preserve specific elements that should not be inverted */ .no-dark-mode, .no-dark-mode *, [data-theme="light"], [data-theme="light"], .ace_editor, .ace_editor *, .CodeMirror, .CodeMirror *, .monaco-editor, .monaco-editor *, .markdown-body pre, .markdown-body pre *, .highlight, .highlight *, pre code, pre code * { filter: none !important; } /* Fix common UI elements */ .modal, .popup, .dropdown-menu, .tooltip, .popover { filter: invert(1) hue-rotate(180deg) !important; background: #2d2d44 !important; border-color: #444 !important; } /* Scrollbars */ ::-webkit-scrollbar { background: #1a1a2e !important; } ::-webkit-scrollbar-thumb { background: #444 !important; } ::-webkit-scrollbar-thumb:hover { background: #555 !important; } /* Selection */ ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; } ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; } '; } function removeDarkMode() { var style = document.getElementById('universal-dark-mode-style'); if (style) style.remove(); } // Toggle with Alt+Shift+D document.addEventListener('keydown', function(e) { if (e.altKey && e.shiftKey && e.key === 'D') { e.preventDefault(); enabled = !enabled; if (enabled) { applyDarkMode(); console.log('[Universal Dark Mode] Enabled'); } else { removeDarkMode(); console.log('[Universal Dark Mode] Disabled'); } } }); // Apply on load applyDarkMode(); // Re-apply on dynamic content var observer = new MutationObserver(function(mutations) { if (enabled && !document.getElementById('universal-dark-mode-style')) { applyDarkMode(); } }); observer.observe(document.head, { childList: true }); console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle'); })(); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })(); fix(ui): keep ConfigureSSO wizard mounted while security page data refetches by iagodahlem · Pull Request #8999 · clerk/javascript · GitHub
Skip to content

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches - #8999

Merged
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount
Jun 25, 2026
Merged

fix(ui): keep ConfigureSSO wizard mounted while security page data refetches#8999
iagodahlem merged 2 commits into
mainfrom
iago/sso-wizard-loading-unmount

Conversation

@iagodahlem

@iagodahlemiagodahlem commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

What

Fixes the self-serve SSO configuration wizard jumping back to an earlier step after you submit a step's configuration.

On <OrganizationProfile /> → Security, OrganizationSecurityPage returns a page-level loading overview whenever isLoading is true, and that early-return sits above the overview-vs-wizard branch. So a background refetch that flips isLoading true while the wizard is open unmounts the open <ConfigureSSO /> wizard and re-mounts it at its seed step (the first step, or the furthest-reachable step) — losing the user's place.

isLoading includes (hadInitialConnection && isLoadingTestRuns). Submitting a configure step (e.g. saving an identity provider's metadata) marks the connection configured, which activates the test-runs query; the first time it cold-loads, isLoading flips and the open wizard is torn down. Reported during GA testing on Google Workspace and Okta — intermittent, because a second attempt finds the test-runs already cached.

Fix

Scope the page-level loading overview to the overview view only (isLoading && view === 'overview'), so a background refetch can no longer unmount an open wizard. The wizard is only ever opened from the overview after the initial load has settled, the connection data stays warm via keepPreviousData, and each wizard step owns its own loading UI — so the page-level skeleton is unnecessary once the wizard is open.

Test

Adds a regression test that drives the wizard to a non-initial step, toggles isLoading true → false, and asserts the wizard stays on its current step. It fails on the previous behavior (the wizard reseats to the first step) and passes with this change.

Follow-up (separate)

The test-runs query should be made strictly table-level so it never feeds the page-level isLoading after the initial page load (also flagged in the wizard-refactor review for the pagination path). Out of scope here to keep this fix minimal for GA.

ORGS-1694

Summary by CodeRabbit

  • Bug Fixes
    • Fixed the self-serve SSO configuration wizard to stay on the current step during background loading, instead of resetting to an earlier step.
    • Prevented the security page overview loading UI from interrupting an in-progress configuration flow.
  • Tests
    • Added a regression test to verify the wizard remains mounted and stable when loading status changes mid-process.

@changeset-bot

changeset-botBot commented Jun 25, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 062fab0

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

This PR includes changesets to release 3 packages
NameType
@clerk/uiPatch
@clerk/chrome-extensionPatch
@clerk/swingsetPatch

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

@vercel

vercelBot commented Jun 25, 2026

Copy link
Copy Markdown

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

ProjectDeploymentActionsUpdated (UTC)
clerk-js-sandboxReadyReadyPreview, CommentJun 25, 2026 5:58pm
swingsetReadyReadyPreview, CommentJun 25, 2026 5:58pm

Request Review

@coderabbitai

coderabbitaiBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

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 Plus

Run ID: 3bd0717f-b4b0-43fe-bb3c-d01d70cce37a

📥 Commits

Reviewing files that changed from the base of the PR and between 67ba152 and 062fab0.

📒 Files selected for processing (3)
  • .changeset/old-dancers-judge.md
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
✅ Files skipped from review due to trivial changes (1)
  • .changeset/old-dancers-judge.md
🚧 Files skipped from review as they are similar to previous changes (2)
  • packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx
  • packages/ui/src/components/OrganizationProfile/tests/OrganizationSecurityPageWizardLoading.test.tsx

📝 Walkthrough

Walkthrough

Updates OrganizationSecurityPage so the loading overview only renders from the overview view, preventing the wizard from being replaced during mid-flow refetches. Adds a patch changeset note and a regression test that flips loading state while the wizard stays on the Activate step.

Changes

Organization security wizard loading

Layer / File(s)Summary
Loading gate and release note
packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, .changeset/old-dancers-judge.md
OrganizationSecurityPageContent now shows the loading overview only when isLoading is true on the overview view, and the changeset records the patch release note for the wizard step-retention fix.
Wizard loading regression test
packages/ui/src/components/OrganizationProfile/__tests__/OrganizationSecurityPageWizardLoading.test.tsx
Adds a controlled loading-store mock, enterprise SSO fixtures, and a regression test that opens the wizard, moves to Activate, toggles loading, and verifies the wizard stays on that step.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

  • clerk/javascript#8799 — Adjusts the same OrganizationSecurityPage wizard/loading gating path that this PR further narrows when loading changes after the wizard opens.
  • clerk/javascript#8813 — Also changes overview-to-wizard rendering in packages/ui/src/components/OrganizationProfile/OrganizationSecurityPage.tsx, including related loading-state behavior.

Suggested reviewers

  • LauraBeatris

Poem

🐰 The wizard kept its step today,
While loading hopped the other way.
No reset glitch, no start-again sigh,
The Activate path stayed nearby.
A soft little thump for SSO cheer,
And bunny ears say: “All is clear!”

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly describes the main fix: keeping the ConfigureSSO wizard mounted during security page refetches.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck 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.

@pkg-pr-new

pkg-pr-newBot commented Jun 25, 2026

Copy link
Copy Markdown

Open in StackBlitz

@clerk/astro

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

@clerk/backend

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

@clerk/chrome-extension

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

@clerk/clerk-js

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

@clerk/electron

npm i https://pkg.pr.new/@clerk/electron@8999

@clerk/electron-passkeys

npm i https://pkg.pr.new/@clerk/electron-passkeys@8999

@clerk/eslint-plugin

npm i https://pkg.pr.new/@clerk/eslint-plugin@8999

@clerk/expo

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

@clerk/expo-passkeys

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

@clerk/express

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

@clerk/fastify

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

@clerk/hono

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

@clerk/localizations

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

@clerk/nextjs

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

@clerk/nuxt

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

@clerk/react

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

@clerk/react-router

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

@clerk/shared

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

@clerk/tanstack-react-start

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

@clerk/testing

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

@clerk/ui

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

@clerk/upgrade

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

@clerk/vue

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

commit: 062fab0

@github-actions

github-actionsBot commented Jun 25, 2026

Copy link
Copy Markdown
Contributor

API Changes Report

Generated by Break Check on 2026-06-25T18:01:06.298Z

Summary

MetricCount
Packages analyzed19
Packages with changes0
🔴 Breaking changes0
🟡 Non-breaking changes0
🟢 Additions0

No API Changes Detected

All packages have stable APIs with no detected changes.


Report generated by Break Check

Last ran on 062fab0.

…fetches
The organization Security page short-circuited to a page-level loading
overview whenever its enterprise-connection data was loading, regardless of
whether the SSO configuration wizard was open. When a background refetch
flipped the loading flag mid-configuration (for example the test-runs query
cold-loading right after the connection is configured), the open wizard
unmounted and, on remount, reseated to its initial step — dropping the user
back to the Domains or Test step and losing their place.
Scope the loading overview to the overview view only. Once the wizard is open
the connection data is already present and stays warm, and each wizard step
renders its own loading state, so a transient refetch no longer tears the
wizard down. Adds a regression test that drives the wizard to a later step and
asserts it stays put across a loading toggle.
@iagodahlem
iagodahlemforce-pushed the iago/sso-wizard-loading-unmount branch from 67ba152 to 062fab0CompareJune 25, 2026 17:54
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@iagodahlem@LauraBeatris