Skip to content

feat(clerk-js): Introduce navigate for setActive #6486

New issue

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

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

Already on GitHub? Sign in to your account

Open
wants to merge 28 commits into
base: main
Choose a base branch
from

Conversation

LauraBeatris
Copy link
Member

@LauraBeatris LauraBeatris commented Aug 7, 2025

Description

This PR introduces a new API to navigate on setActive, that can be leveraged for after-auth flows to handle pending sessions, featuring a callback mechanism that enables developers to integrate their application logic, such as navigation.

Previously, our flows were mistakenly navigating after setActive, which could cause issues with session revalidation and re-render of pages.

From now on, we're proposing two options to deal with after-auth: taskUrls or navigate

navigate

A callback function that can be provided as an setActive option.

setActive({ 
  navigate: async ({ session }) => { 
     const currentTask = session.currentTask; 

     if (currentTask){ 
      // Developer has full control over navigation logic
      // (this also allows our AIO components to pass their navigation context such as modal routing)
       await router.push(`/onboarding/${currentTask.key}`)
       return 
     }

    await router.push('/dashboard')
  }
})

taskUrls (existing)

A map of URLs per session task key that can be provided as a Clerk option. On setActive, it'll be used for navigation.

<ClerkProvider 
   taskUrls={{'choose-organization': '/onboarding/choose-organization' }}
/>

AIOs behavior

CleanShot.2025-08-07.at.22.30.57.mp4

Checklist

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

Type of change

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

Summary by CodeRabbit

Summary by CodeRabbit

  • New Features

    • Improved handling and redirection for pending session tasks during sign-in and sign-up flows.
    • Added enhanced navigation logic to automatically guide users to required tasks after authentication.
    • Introduced new redirect wrappers for sign-in and sign-up components to streamline task-based navigation.
    • Added a customizable navigate callback to the session activation method to enable flexible navigation control.
  • Bug Fixes

    • Corrected lazy-loaded component references for session tasks.
    • Fixed navigation and redirect inconsistencies during authentication flows.
  • Refactor

    • Simplified and centralized session task navigation logic within the session activation process.
    • Removed deprecated and internal navigation components and methods, including the RedirectToTask component.
    • Updated context and hooks to provide more flexible navigation options via a new navigate callback.
    • Streamlined redirect URL handling in authentication components.
  • Chores

    • Enhanced and reorganized test coverage for session activation and redirect handling.
    • Cleaned up unused exports and internal APIs.

@LauraBeatris LauraBeatris self-assigned this Aug 7, 2025
Copy link

changeset-bot bot commented Aug 7, 2025

🦋 Changeset detected

Latest commit: ea2307e

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

This PR includes changesets to release 22 packages
Name Type
@clerk/clerk-js Minor
@clerk/types Minor
@clerk/tanstack-react-start Minor
@clerk/react-router Minor
@clerk/nextjs Minor
@clerk/clerk-react Minor
@clerk/remix Minor
@clerk/vue Minor
@clerk/chrome-extension Patch
@clerk/clerk-expo Patch
@clerk/agent-toolkit Patch
@clerk/astro Patch
@clerk/backend Patch
@clerk/elements Patch
@clerk/expo-passkeys Patch
@clerk/express Patch
@clerk/fastify Patch
@clerk/localizations Patch
@clerk/nuxt Patch
@clerk/shared Patch
@clerk/testing Patch
@clerk/themes Patch

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

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

Copy link

vercel bot commented Aug 7, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
clerk-js-sandbox ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 9, 2025 0:51am

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🔭 Outside diff range comments (1)
packages/clerk-js/src/ui/common/withRedirect.tsx (1)

31-41: Redirect effect never re-runs; navigation may not trigger when condition flips to true later

If shouldRedirect becomes true after mount (e.g., session transitions to pending), the effect won’t run due to [] deps, so you render null but never navigate. Also, prefer void navigate(...) instead of disabling the lint rule.

Refactor the effect to depend on shouldRedirect and guard repeat navigations with a ref:

-    const shouldRedirect = condition(clerk, environment, options);
-    React.useEffect(() => {
-      if (shouldRedirect) {
-        if (warning && isDevelopmentFromPublishableKey(clerk.publishableKey)) {
-          console.info(warning);
-        }
-        // TODO: Fix this properly
-        // eslint-disable-next-line @typescript-eslint/no-floating-promises
-        navigate(redirectUrl({ clerk, environment, options }));
-      }
-    }, []);
+    const shouldRedirect = condition(clerk, environment, options);
+    const didNavigateRef = React.useRef(false);
+    React.useEffect(() => {
+      if (!shouldRedirect || didNavigateRef.current) {
+        return;
+      }
+      didNavigateRef.current = true;
+      if (warning && isDevelopmentFromPublishableKey(clerk.publishableKey)) {
+        console.info(warning);
+      }
+      void navigate(redirectUrl({ clerk, environment, options }));
+    }, [shouldRedirect, clerk, environment, options, warning, navigate, redirectUrl]);
🧹 Nitpick comments (2)
packages/clerk-js/src/core/clerk.ts (2)

1197-1216: Document the new navigate param in setActive JSDoc

setActive is a public API. Add JSDoc for the new navigate callback, precedence vs taskUrls, and behavior when session is pending, to align with coding guidelines.

/**
 * Set the active session and/or organization.
 * When the session is pending:
 * - If `navigate` is provided, it takes precedence and is invoked with `{ session }`.
 * - Else, falls back to `options.taskUrls[currentTask.key]` if available.
 * - `redirectUrl` is preserved and appended to the navigation target.
 */

1197-1361: Add tests for new behavior

Cover the following:

  • Precedence: when both navigate and taskUrls are provided, navigate is used.
  • redirectUrl is preserved for both hash and non-hash taskUrls.
  • Pending sessions do not trigger onBeforeSetActive/onAfterSetActive or transitive state.
  • warnMissingPendingTaskHandlers does not log when global taskUrls are set.

I can draft Jest tests for these scenarios if helpful.

Also applies to: 1827-1941

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 070cb91 and 3a2faca.

⛔ Files ignored due to path filters (3)
  • packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
  • packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
  • packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
📒 Files selected for processing (41)
  • .changeset/rich-donuts-agree.md (1 hunks)
  • .changeset/warm-rocks-flow.md (1 hunks)
  • packages/clerk-js/src/core/__tests__/clerk.test.ts (5 hunks)
  • packages/clerk-js/src/core/clerk.ts (17 hunks)
  • packages/clerk-js/src/core/sessionTasks.ts (1 hunks)
  • packages/clerk-js/src/ui/common/redirects.ts (0 hunks)
  • packages/clerk-js/src/ui/common/withRedirect.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInAccountSwitcher.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOne.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwo.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInSSOCallback.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignIn/index.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignIn/shared.ts (3 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpSSOCallback.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/index.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/UserButton/useMultisessionActions.tsx (3 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts (4 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts (4 hunks)
  • packages/clerk-js/src/ui/lazyModules/components.ts (1 hunks)
  • packages/clerk-js/src/ui/types.ts (2 hunks)
  • packages/clerk-js/src/utils/componentGuards.ts (1 hunks)
  • packages/nextjs/src/client-boundary/controlComponents.ts (1 hunks)
  • packages/nextjs/src/index.ts (0 hunks)
  • packages/react/src/components/controlComponents.tsx (0 hunks)
  • packages/react/src/components/index.ts (0 hunks)
  • packages/react/src/isomorphicClerk.ts (0 hunks)
  • packages/types/src/clerk.ts (3 hunks)
  • packages/vue/src/components/controlComponents.ts (0 hunks)
💤 Files with no reviewable changes (6)
  • packages/nextjs/src/index.ts
  • packages/react/src/components/index.ts
  • packages/vue/src/components/controlComponents.ts
  • packages/react/src/components/controlComponents.tsx
  • packages/react/src/isomorphicClerk.ts
  • packages/clerk-js/src/ui/common/redirects.ts
🚧 Files skipped from review as they are similar to previous changes (32)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx
  • packages/clerk-js/src/utils/componentGuards.ts
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx
  • .changeset/warm-rocks-flow.md
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/clerk-js/src/ui/lazyModules/components.ts
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx
  • packages/clerk-js/src/ui/components/SignIn/index.tsx
  • .changeset/rich-donuts-agree.md
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx
  • packages/clerk-js/src/ui/components/SignUp/index.tsx
  • packages/clerk-js/src/ui/components/SignIn/shared.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpSSOCallback.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInSSOCallback.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOne.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInAccountSwitcher.tsx
  • packages/nextjs/src/client-boundary/controlComponents.ts
  • packages/clerk-js/src/ui/components/UserButton/useMultisessionActions.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
  • packages/clerk-js/src/core/tests/clerk.test.ts
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
  • packages/clerk-js/src/core/sessionTasks.ts
  • packages/types/src/clerk.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwo.tsx
🧰 Additional context used
📓 Path-based instructions (10)
packages/clerk-js/src/ui/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/clerk-js-ui.mdc)

packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use Prettier for consistent code formatting

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

TypeScript is required for all packages

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx,d.ts}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Packages should export TypeScript types alongside runtime code

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use proper TypeScript error types

**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoid any type - prefer unknown when type is uncertain, then narrow with type guards
Use interface for object shapes that might be extended
Use type for unions, primitives, and computed types
Prefer readonly properties for immutable data structures
Use private for internal implementation details
Use protected for inheritance hierarchies
Use public explicitly for clarity in public APIs
Prefer readonly for properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Use const assertions for literal types: as const
Use satisfies operator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports: import type { ... } from ...
No any types without justification
Proper error handling with typed errors
Consistent use of readonly for immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,ts,tsx,jsx}

📄 CodeRabbit Inference Engine (.cursor/rules/monorepo.mdc)

Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*

⚙️ CodeRabbit Configuration File

If there are no tests added or modified as part of the PR, please suggest that tests be added to cover the changes.

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{jsx,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{jsx,tsx}: Use error boundaries in React components
Minimize re-renders in React components

**/*.{jsx,tsx}: Always use functional components with hooks instead of class components
Follow PascalCase naming for components: UserProfile, NavigationMenu
Keep components focused on a single responsibility - split large components
Limit component size to 150-200 lines; extract logic into custom hooks
Use composition over inheritance - prefer smaller, composable components
Export components as named exports for better tree-shaking
One component per file with matching filename and component name
Use useState for simple state management
Use useReducer for complex state logic
Implement proper state initialization
Use proper state updates with callbacks
Implement proper state cleanup
Use Context API for theme/authentication
Implement proper state selectors
Use proper state normalization
Implement proper state persistence
Use React.memo for expensive components
Implement proper useCallback for handlers
Use proper useMemo for expensive computations
Implement proper virtualization for lists
Use proper code splitting with React.lazy
Implement proper cleanup in useEffect
Use proper refs for DOM access
Implement proper event listener cleanup
Use proper abort controllers for fetch
Implement proper subscription cleanup
Use proper HTML elements
Implement proper ARIA attributes
Use proper heading hierarchy
Implement proper form labels
Use proper button types
Implement proper focus management
Use proper keyboard shortcuts
Implement proper tab order
Use proper skip links
Implement proper focus traps
Implement proper error boundaries
Use proper error logging
Implement proper error recovery
Use proper error messages
Implement proper error fallbacks
Use proper form validation
Implement proper error states
Use proper error messages
Implement proper form submission
Use proper form reset
Use proper component naming
Implement proper file naming
Use proper prop naming
Implement proper...

Files:

  • packages/clerk-js/src/ui/common/withRedirect.tsx
**/*.tsx

📄 CodeRabbit Inference Engine (.cursor/rules/react.mdc)

**/*.tsx: Use proper type definitions for props and state
Leverage TypeScript's type inference where possible
Use proper event types for handlers
Implement proper generic types for reusable components
Use proper type guards for conditional rendering

Files:

  • packages/clerk-js/src/ui/common/withRedirect.tsx
🧬 Code Graph Analysis (1)
packages/clerk-js/src/ui/types.ts (1)
packages/types/src/clerk.ts (1)
  • SetActiveNavigate (955-955)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (9)
  • GitHub Check: Integration Tests (nextjs, chrome, 14)
  • GitHub Check: Integration Tests (tanstack-react-router, chrome)
  • GitHub Check: Integration Tests (react-router, chrome)
  • GitHub Check: Integration Tests (vue, chrome)
  • GitHub Check: Integration Tests (billing, chrome)
  • GitHub Check: Integration Tests (nextjs, chrome, 15)
  • GitHub Check: Integration Tests (tanstack-react-start, chrome)
  • GitHub Check: Integration Tests (astro, chrome)
  • GitHub Check: Integration Tests (generic, chrome)
🔇 Additional comments (12)
packages/clerk-js/src/ui/types.ts (1)

15-15: Type-only import of SetActiveNavigate looks correct

Consistent with TS best practices and used solely for typing.

packages/clerk-js/src/ui/common/withRedirect.tsx (4)

63-66: Guard logic update LGTM

Using isSignedInAndSingleSessionModeEnabled simplifies and centralizes the guard. Approved.


82-85: Guard logic update LGTM

Same as SignIn: the guard is correct and consistent.


100-107: Solid: prevent navigate('') by tying condition to taskUrl availability

Condition now depends on both currentTask and signInCtx?.taskUrl, and the redirect URL is non-null-asserted only when condition is true. Good defensive check.


121-128: Solid: same fix for SignUp variant

Mirrors SignIn logic; prevents empty navigation correctly.

packages/clerk-js/src/core/clerk.ts (7)

553-563: Correct guard before opening SignIn

Using isSignedInAndSingleSessionModeEnabled to block opening in single-session mode is clean and consistent with the UI HOCs.


685-695: Correct guard before opening SignUp

Same reasoning as SignIn. Approved.


1231-1233: Good: avoid false positives in warnMissingPendingTaskHandlers

Merging this.#options with params ensures taskUrls and other globals are considered. Approved.


1263-1269: Nice: avoid cache revalidation/unmounts for pending sessions

Skipping onBeforeSetActive and transitive state when pending prevents AIO unmounts. Approved.


1827-1833: Good extraction: centralized pending task navigation for SSO

Using navigateIfTaskExists inside the setActive navigate callback aligns with the new API and keeps SSO flows consistent.


1835-1839: Call sites correctly pass navigate to setActive

Consistent usage across all branches ensures pending tasks are handled uniformly.

Also applies to: 1849-1853, 1899-1903, 1913-1916, 1938-1941


1303-1321: Verify redirectUrl preservation target (hash vs query)

You’re currently appending redirectUrl via hashSearchParams. For non-hash routes (e.g., /onboarding/choose-organization), this should be query params. The refactor above switches to hash vs query based on the target URL string.

Please verify with a route that:

  • Uses pathname routing (no #) → expects ?redirectUrl=...
  • Uses hash routing (contains #) → expects #...redirectUrl=...

If needed, I can add unit tests covering both cases.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🔭 Outside diff range comments (1)
packages/clerk-js/src/ui/common/withRedirect.tsx (1)

31-41: Redirect side-effect misses dependencies → navigation may never fire

useEffect is declared with an empty dependency array, but shouldRedirect can become true after mount (e.g. when taskUrl arrives asynchronously).
React will then never re-run the effect, so users stay on the wrong page.

-  React.useEffect(() => {
+  React.useEffect(() => {
       if (shouldRedirect) {
         …
       }
-  }, []);
+  }, [shouldRedirect, navigate, redirectUrl, clerk, environment, options, warning]);

Add at least shouldRedirect (and other stable refs if required) to guarantee the redirect happens once the condition is satisfied.

♻️ Duplicate comments (2)
packages/clerk-js/src/ui/common/withRedirect.tsx (1)

114-133: Same duplication note as above

packages/clerk-js/src/core/clerk.ts (1)

2130-2135: Same navigation helper duplicated

See previous comment – the repetition here reinforces the need for a shared helper.

🧹 Nitpick comments (4)
packages/clerk-js/src/ui/types.ts (1)

28-41: Optionally re-export SetActiveNavigate for convenience and consistency

UI consumers already import many types from this barrel; re-exporting SetActiveNavigate here would keep the ergonomics consistent.

Apply this diff to re-export:

 export type {
   __internal_OAuthConsentProps,
   __internal_UserVerificationProps,
   CreateOrganizationProps,
   GoogleOneTapProps,
   OrganizationListProps,
   OrganizationProfileProps,
   OrganizationSwitcherProps,
   SignInProps,
   SignUpProps,
   UserButtonProps,
   UserProfileProps,
   WaitlistProps,
+  SetActiveNavigate,
 } from '@clerk/types';
packages/clerk-js/src/ui/common/withRedirect.tsx (1)

93-112: New HOCs duplicate logic – extract a parametric helper

withRedirectToSignInTask and withRedirectToSignUpTask are almost identical except for the context used. A tiny factory can eliminate duplication and reduce maintenance overhead.

const makeTaskRedirect =
  <Ctx, P extends AvailableComponentProps>(
    useCtx: () => { taskUrl?: string },
    display: string,
  ) =>
  (Component: ComponentType<P>) => {
    const dispName = Component.displayName || Component.name || 'Component';
    Component.displayName = dispName;

    const HOC = (props: P) => {
      const ctx = useCtx();
      return withRedirect(
        Component,
        clerk => Boolean(clerk.session?.currentTask && ctx.taskUrl),
        () => ctx.taskUrl!, // eslint-disable-line
      )(props);
    };
    HOC.displayName = `${display}(${dispName})`;
    return HOC;
  };

export const withRedirectToSignInTask = makeTaskRedirect(
  useSignInContext,
  'withRedirectToSignInTask',
);
export const withRedirectToSignUpTask = makeTaskRedirect(
  useSignUpContext,
  'withRedirectToSignUpTask',
);

Keeps the file shorter and avoids future drift.

packages/clerk-js/src/core/clerk.ts (2)

1197-1200: Add JSDoc for the new navigate parameter in setActive

setActive is a public API but the new navigate callback is undocumented.
Please add a short JSDoc block that explains:

• the purpose of the callback
• the expected signature (({ session }) => Promise<void> | void)
• how it interacts with redirectUrl / taskUrls.

This keeps the public surface self-documenting and aligns with the coding-guideline requirement that “All public APIs must be documented with JSDoc”.


1827-1833: Duplicate setActiveNavigate lambdas – consider extracting a helper

The same navigateIfTaskExists wrapper is defined here and again in authenticateWithWeb3.
Factor it into a small util (e.g. createTaskNavigate(displayConfig.signInUrl, this.navigate)) to avoid copy-paste drift.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 070cb91 and 3a2faca.

⛔ Files ignored due to path filters (3)
  • packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
  • packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
  • packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap is excluded by !**/*.snap
📒 Files selected for processing (41)
  • .changeset/rich-donuts-agree.md (1 hunks)
  • .changeset/warm-rocks-flow.md (1 hunks)
  • packages/clerk-js/src/core/__tests__/clerk.test.ts (5 hunks)
  • packages/clerk-js/src/core/clerk.ts (17 hunks)
  • packages/clerk-js/src/core/sessionTasks.ts (1 hunks)
  • packages/clerk-js/src/ui/common/redirects.ts (0 hunks)
  • packages/clerk-js/src/ui/common/withRedirect.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInAccountSwitcher.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOne.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwo.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInSSOCallback.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignIn/index.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignIn/shared.ts (3 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpSSOCallback.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/index.tsx (1 hunks)
  • packages/clerk-js/src/ui/components/UserButton/useMultisessionActions.tsx (3 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts (4 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts (4 hunks)
  • packages/clerk-js/src/ui/lazyModules/components.ts (1 hunks)
  • packages/clerk-js/src/ui/types.ts (2 hunks)
  • packages/clerk-js/src/utils/componentGuards.ts (1 hunks)
  • packages/nextjs/src/client-boundary/controlComponents.ts (1 hunks)
  • packages/nextjs/src/index.ts (0 hunks)
  • packages/react/src/components/controlComponents.tsx (0 hunks)
  • packages/react/src/components/index.ts (0 hunks)
  • packages/react/src/isomorphicClerk.ts (0 hunks)
  • packages/types/src/clerk.ts (3 hunks)
  • packages/vue/src/components/controlComponents.ts (0 hunks)
💤 Files with no reviewable changes (6)
  • packages/nextjs/src/index.ts
  • packages/react/src/components/index.ts
  • packages/vue/src/components/controlComponents.ts
  • packages/clerk-js/src/ui/common/redirects.ts
  • packages/react/src/components/controlComponents.tsx
  • packages/react/src/isomorphicClerk.ts
🚧 Files skipped from review as they are similar to previous changes (32)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx
  • .changeset/warm-rocks-flow.md
  • packages/clerk-js/src/utils/componentGuards.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx
  • packages/clerk-js/src/ui/components/SignIn/index.tsx
  • packages/clerk-js/src/ui/components/SignUp/index.tsx
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx
  • .changeset/rich-donuts-agree.md
  • packages/clerk-js/src/ui/components/SignUp/SignUpSSOCallback.tsx
  • packages/clerk-js/src/ui/lazyModules/components.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOne.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInSSOCallback.tsx
  • packages/clerk-js/src/ui/components/SignIn/shared.ts
  • packages/clerk-js/src/ui/components/UserButton/useMultisessionActions.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwo.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInAccountSwitcher.tsx
  • packages/nextjs/src/client-boundary/controlComponents.ts
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/clerk-js/src/core/sessionTasks.ts
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/clerk-js/src/core/tests/clerk.test.ts
  • packages/types/src/clerk.ts
🧰 Additional context used
📓 Path-based instructions (10)
packages/clerk-js/src/ui/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/clerk-js-ui.mdc)

packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use Prettier for consistent code formatting

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

TypeScript is required for all packages

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx,d.ts}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Packages should export TypeScript types alongside runtime code

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use proper TypeScript error types

**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoid any type - prefer unknown when type is uncertain, then narrow with type guards
Use interface for object shapes that might be extended
Use type for unions, primitives, and computed types
Prefer readonly properties for immutable data structures
Use private for internal implementation details
Use protected for inheritance hierarchies
Use public explicitly for clarity in public APIs
Prefer readonly for properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Use const assertions for literal types: as const
Use satisfies operator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports: import type { ... } from ...
No any types without justification
Proper error handling with typed errors
Consistent use of readonly for immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,ts,tsx,jsx}

📄 CodeRabbit Inference Engine (.cursor/rules/monorepo.mdc)

Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*

⚙️ CodeRabbit Configuration File

If there are no tests added or modified as part of the PR, please suggest that tests be added to cover the changes.

Files:

  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/common/withRedirect.tsx
  • packages/clerk-js/src/core/clerk.ts
**/*.{jsx,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{jsx,tsx}: Use error boundaries in React components
Minimize re-renders in React components

**/*.{jsx,tsx}: Always use functional components with hooks instead of class components
Follow PascalCase naming for components: UserProfile, NavigationMenu
Keep components focused on a single responsibility - split large components
Limit component size to 150-200 lines; extract logic into custom hooks
Use composition over inheritance - prefer smaller, composable components
Export components as named exports for better tree-shaking
One component per file with matching filename and component name
Use useState for simple state management
Use useReducer for complex state logic
Implement proper state initialization
Use proper state updates with callbacks
Implement proper state cleanup
Use Context API for theme/authentication
Implement proper state selectors
Use proper state normalization
Implement proper state persistence
Use React.memo for expensive components
Implement proper useCallback for handlers
Use proper useMemo for expensive computations
Implement proper virtualization for lists
Use proper code splitting with React.lazy
Implement proper cleanup in useEffect
Use proper refs for DOM access
Implement proper event listener cleanup
Use proper abort controllers for fetch
Implement proper subscription cleanup
Use proper HTML elements
Implement proper ARIA attributes
Use proper heading hierarchy
Implement proper form labels
Use proper button types
Implement proper focus management
Use proper keyboard shortcuts
Implement proper tab order
Use proper skip links
Implement proper focus traps
Implement proper error boundaries
Use proper error logging
Implement proper error recovery
Use proper error messages
Implement proper error fallbacks
Use proper form validation
Implement proper error states
Use proper error messages
Implement proper form submission
Use proper form reset
Use proper component naming
Implement proper file naming
Use proper prop naming
Implement proper...

Files:

  • packages/clerk-js/src/ui/common/withRedirect.tsx
**/*.tsx

📄 CodeRabbit Inference Engine (.cursor/rules/react.mdc)

**/*.tsx: Use proper type definitions for props and state
Leverage TypeScript's type inference where possible
Use proper event types for handlers
Implement proper generic types for reusable components
Use proper type guards for conditional rendering

Files:

  • packages/clerk-js/src/ui/common/withRedirect.tsx
🧬 Code Graph Analysis (2)
packages/clerk-js/src/ui/types.ts (1)
packages/types/src/clerk.ts (1)
  • SetActiveNavigate (955-955)
packages/clerk-js/src/ui/common/withRedirect.tsx (4)
packages/clerk-js/src/utils/componentGuards.ts (1)
  • isSignedInAndSingleSessionModeEnabled (9-11)
packages/clerk-js/src/core/warnings.ts (1)
  • warnings (63-63)
packages/clerk-js/src/ui/contexts/components/SignIn.ts (1)
  • useSignInContext (38-158)
packages/clerk-js/src/ui/contexts/components/SignUp.ts (1)
  • useSignUpContext (37-152)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (9)
  • GitHub Check: Integration Tests (nextjs, chrome, 14)
  • GitHub Check: Integration Tests (tanstack-react-router, chrome)
  • GitHub Check: Integration Tests (react-router, chrome)
  • GitHub Check: Integration Tests (vue, chrome)
  • GitHub Check: Integration Tests (billing, chrome)
  • GitHub Check: Integration Tests (nextjs, chrome, 15)
  • GitHub Check: Integration Tests (tanstack-react-start, chrome)
  • GitHub Check: Integration Tests (astro, chrome)
  • GitHub Check: Integration Tests (generic, chrome)
🔇 Additional comments (5)
packages/clerk-js/src/ui/types.ts (1)

15-15: Type-only import of SetActiveNavigate — LGTM

Correctly added as a type-only import and used downstream. No issues.

packages/clerk-js/src/ui/common/withRedirect.tsx (1)

9-9: Import looks good

The new guard is correctly imported from ../../utils.

packages/clerk-js/src/core/clerk.ts (3)

1230-1232: Nice fix – false-positive warning eliminated

Passing the merged object { …this.#options, …params } to warnMissingPendingTaskHandlers ensures taskUrls is present and prevents the earlier false-positive warning.
Looks good.


1304-1308: redirectUrl may be lost when a task URL is used

When both taskUrl and redirectUrl are provided, the code appends redirectUrl as a hash/search param to the task URL:

const taskUrlWithRedirect = redirectUrl
  ? buildURL({ base: taskUrl, hashSearchParams: { redirectUrl } }, { stringify: true })
  : taskUrl;

If the router for task screens expects the original query string (e.g. ?redirect_url=) instead of a fragment param, the downstream page won’t see it.

Consider preserving the original query style, or at least verifying that the consumer of the task URL can parse #redirectUrl=. Otherwise users might never be redirected back after completing the task.


1355-1358: Skip of onAfterSetActive for pending sessions – double-check side-effects

onAfterSetActive is suppressed for pending sessions to keep AIOs mounted.
Confirm no other code relies on this hook to resume polling or clean up resources after setActive, otherwise long-running side-effects might leak until the next non-pending activation.

If unsure, add a comment explaining the rationale and any expected downstream behaviour.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

♻️ Duplicate comments (2)
packages/clerk-js/src/ui/contexts/components/SignUp.ts (2)

118-130: DRY: extract shared onPendingSession handler to avoid duplication with SignIn.ts

The onPendingSession logic is identical in SignIn.ts. Extract to a shared utility (e.g., ui/common/sessionTasks.ts) that accepts clerk, signUpUrl/signInUrl (base), and navigate, returning a SetActiveNavigate. Use it in both SignIn and SignUp for consistency.


118-125: Broaden onPendingSession: honor taskUrls, preserve redirect params, and await navigation

The callback hardcodes a relative route via INTERNAL_SESSION_TASK_ROUTE_BY_KEY and drops preserved/redirect params. This is likely the root cause for the SSO callback E2E failures and the “preserving redirectUrl” TODO. Use buildTaskURL and taskUrls override, append preserved params, and await navigate.

Apply:

-  const onPendingSession: SetActiveNavigate = async ({ session }) => {
-    const currentTaskKey = session.currentTask?.key;
-    if (!currentTaskKey) {
-      return;
-    }
-
-    return navigate(`../tasks/${INTERNAL_SESSION_TASK_ROUTE_BY_KEY[currentTaskKey]}`);
-  };
+  const onPendingSession: SetActiveNavigate = async ({ session }) => {
+    const task = session.currentTask;
+    if (!task) {
+      return;
+    }
+    const customTaskUrl = clerk.__internal_getOption('taskUrls')?.[task.key];
+    const defaultTaskUrl = buildTaskURL(task, { base: signUpUrl });
+    // Preserve redirect/auth params across the navigation
+    const target = buildURL(
+      { base: customTaskUrl ?? defaultTaskUrl, hashSearchParams: [redirectUrls.getPreservedSearchParams()] },
+      { stringify: true },
+    );
+    await navigate(target);
+  };
🧹 Nitpick comments (2)
packages/clerk-js/src/ui/contexts/components/SignUp.ts (2)

6-6: Remove reliance on INTERNAL_SESSION_TASK_ROUTE_BY_KEY

After switching onPendingSession to buildTaskURL, the INTERNAL_SESSION_TASK_ROUTE_BY_KEY import becomes unnecessary and brittle for future tasks. Prefer the centralized URL builder.

-import { buildTaskURL, INTERNAL_SESSION_TASK_ROUTE_BY_KEY } from '@/core/sessionTasks';
+import { buildTaskURL } from '@/core/sessionTasks';

31-32: Context additions look good — add minimal docs

Adding onPendingSession and taskUrl to the context aligns with the new API. Please add a brief JSDoc on both fields to guide integrators (what they represent, when they’re set, and how to use them).

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3a2faca and bdfb8f9.

📒 Files selected for processing (4)
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx (5 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts (4 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts (4 hunks)
  • packages/types/src/clerk.ts (3 hunks)
🚧 Files skipped from review as they are similar to previous changes (3)
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx
  • packages/types/src/clerk.ts
🧰 Additional context used
📓 Path-based instructions (8)
packages/clerk-js/src/ui/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/clerk-js-ui.mdc)

packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use Prettier for consistent code formatting

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
packages/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

TypeScript is required for all packages

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
packages/**/*.{ts,tsx,d.ts}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Packages should export TypeScript types alongside runtime code

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use proper TypeScript error types

**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoid any type - prefer unknown when type is uncertain, then narrow with type guards
Use interface for object shapes that might be extended
Use type for unions, primitives, and computed types
Prefer readonly properties for immutable data structures
Use private for internal implementation details
Use protected for inheritance hierarchies
Use public explicitly for clarity in public APIs
Prefer readonly for properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Use const assertions for literal types: as const
Use satisfies operator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports: import type { ... } from ...
No any types without justification
Proper error handling with typed errors
Consistent use of readonly for immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
**/*.{js,ts,tsx,jsx}

📄 CodeRabbit Inference Engine (.cursor/rules/monorepo.mdc)

Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
**/*

⚙️ CodeRabbit Configuration File

If there are no tests added or modified as part of the PR, please suggest that tests be added to cover the changes.

Files:

  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
  • GitHub Check: Build Packages
  • GitHub Check: Formatting | Dedupe | Changeset
  • GitHub Check: semgrep/ci
  • GitHub Check: Analyze (javascript-typescript)
  • GitHub Check: semgrep-cloud-platform/scan

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 1

♻️ Duplicate comments (2)
packages/clerk-js/src/ui/contexts/components/SignIn.ts (1)

132-135: taskUrl computed from stale session instance

clerk.session may still point to the previous session while a new pending session is being activated, so
clerk.session?.currentTask can be undefined and the URL never resolves.

Use the freshly resolved session instead (pass it in, or read via context) to avoid a null task URL.

-const taskUrl = clerk.session?.currentTask
+const taskUrl = newSession?.currentTask
packages/clerk-js/src/core/clerk.ts (1)

1325-1328: Unhandled errors & type mismatch in setActiveNavigate invocation

await setActiveNavigate({ session: newSession });

  1. The call is unguarded—if consumer code throws, Clerk stays in an inconsistent state with
    __internal_setActiveInProgress stuck true.
  2. The library-supplied helpers expect { session, redirectUrl }; omitting redirectUrl violates the declared
    signature in SignInContext and several AIO helpers, leading to TypeScript errors downstream.
- if (setActiveNavigate && newSession) {
-   await setActiveNavigate({ session: newSession });
+ if (setActiveNavigate && newSession) {
+   try {
+     await setActiveNavigate({ session: newSession, redirectUrl: redirectUrl ?? this.buildAfterSignInUrl() });
+   } catch (err) {
+     logger.error('setActive.navigate callback failed', err);
+   }
   return;
 }
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between bdfb8f9 and 8c87ddd.

📒 Files selected for processing (17)
  • packages/clerk-js/src/core/clerk.ts (18 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx (3 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx (2 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx (5 hunks)
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx (2 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignIn.ts (4 hunks)
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts (4 hunks)
  • packages/clerk-js/src/ui/types.ts (2 hunks)
🚧 Files skipped from review as they are similar to previous changes (15)
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoCodeForm.tsx
  • packages/clerk-js/src/ui/types.ts
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/ChooseOrganizationScreen.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneAlternativeChannelCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpVerificationCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOneCodeForm.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorTwoBackupCodeCard.tsx
  • packages/clerk-js/src/ui/components/SessionTasks/tasks/TaskChooseOrganization/CreateOrganizationScreen.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpEmailLinkCard.tsx
  • packages/clerk-js/src/ui/components/SessionTasks/index.tsx
  • packages/clerk-js/src/ui/contexts/components/SignUp.ts
  • packages/clerk-js/src/ui/components/SignIn/SignInFactorOnePasswordCard.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
  • packages/clerk-js/src/ui/components/SignUp/SignUpContinue.tsx
🧰 Additional context used
📓 Path-based instructions (8)
packages/clerk-js/src/ui/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/clerk-js-ui.mdc)

packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use Prettier for consistent code formatting

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

TypeScript is required for all packages

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
packages/**/*.{ts,tsx,d.ts}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Packages should export TypeScript types alongside runtime code

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use proper TypeScript error types

**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoid any type - prefer unknown when type is uncertain, then narrow with type guards
Use interface for object shapes that might be extended
Use type for unions, primitives, and computed types
Prefer readonly properties for immutable data structures
Use private for internal implementation details
Use protected for inheritance hierarchies
Use public explicitly for clarity in public APIs
Prefer readonly for properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Use const assertions for literal types: as const
Use satisfies operator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports: import type { ... } from ...
No any types without justification
Proper error handling with typed errors
Consistent use of readonly for immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
**/*.{js,ts,tsx,jsx}

📄 CodeRabbit Inference Engine (.cursor/rules/monorepo.mdc)

Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
**/*

⚙️ CodeRabbit Configuration File

If there are no tests added or modified as part of the PR, please suggest that tests be added to cover the changes.

Files:

  • packages/clerk-js/src/ui/contexts/components/SignIn.ts
  • packages/clerk-js/src/core/clerk.ts
🧠 Learnings (1)
📚 Learning: 2025-08-08T19:00:08.931Z
Learnt from: LauraBeatris
PR: clerk/javascript#6486
File: packages/clerk-js/src/core/clerk.ts:1303-1344
Timestamp: 2025-08-08T19:00:08.931Z
Learning: In Clerk's navigation system for pending sessions, `taskUrls` (configured at the ClerkProvider level) should take priority over the `navigate` callback (from All-In-One components). This ensures that explicit provider-level configuration overrides component-level navigation logic, providing developers with predictable control over navigation behavior.

Applied to files:

  • packages/clerk-js/src/core/clerk.ts
🧬 Code Graph Analysis (1)
packages/clerk-js/src/ui/contexts/components/SignIn.ts (3)
packages/types/src/session.ts (1)
  • SessionResource (208-261)
packages/react/src/isomorphicClerk.ts (1)
  • session (663-669)
packages/clerk-js/src/core/sessionTasks.ts (2)
  • INTERNAL_SESSION_TASK_ROUTE_BY_KEY (9-11)
  • buildTaskURL (16-24)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
  • GitHub Check: Build Packages
  • GitHub Check: Formatting | Dedupe | Changeset
  • GitHub Check: semgrep/ci
  • GitHub Check: Analyze (javascript-typescript)
  • GitHub Check: semgrep-cloud-platform/scan

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🔭 Outside diff range comments (1)
packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts (1)

22-22: Avoid any in error handling

Use unknown and narrow inside handleError to comply with TS guidelines and ESLint.

Apply:

-  handleError: (err: any) => void;
+  handleError: (err: unknown) => void;

If helpful, I can follow up with a small handleError helper that safely narrows Clerk/FAPI errors and formats localized messages.

🧹 Nitpick comments (2)
packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts (2)

27-27: Tighten the return type of navigateOnSetActive

Prefer Promise<void> over Promise<unknown> to convey intent and improve DX. No value is consumed downstream.

Apply:

-  navigateOnSetActive: (opts: { session: SessionResource; redirectUrl: string }) => Promise<unknown>;
+  navigateOnSetActive: (opts: { session: SessionResource; redirectUrl: string }) => Promise<void>;

113-137: Add explicit return type to hasOptionalFields

Small clarity win and aligns with our TS rules for explicit return types.

Apply:

-export function hasOptionalFields(
+export function hasOptionalFields(
   signUp: SignUpResource,
   identifierAttribute: 'emailAddress' | 'phoneNumber' | 'username',
-) {
+): boolean {
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9547dbd and 6077ee5.

📒 Files selected for processing (2)
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx (6 hunks)
  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts (4 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
🧰 Additional context used
📓 Path-based instructions (8)
packages/clerk-js/src/ui/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/clerk-js-ui.mdc)

packages/clerk-js/src/ui/**/*.{ts,tsx}: Element descriptors should always be camelCase
Use element descriptors in UI components to enable consistent theming and styling via appearance.elements
Element descriptors should generate unique, stable CSS classes for theming
Element descriptors should handle state classes (e.g., cl-loading, cl-active, cl-error, cl-open) automatically based on component state
Do not render hard-coded values; all user-facing strings must be localized using provided localization methods
Use the useLocalizations hook and localizationKeys utility for all text and error messages
Use the styled system (sx prop, theme tokens, responsive values) for custom component styling
Use useCardState for card-level state, useFormState for form-level state, and useLoadingStatus for loading states
Always use handleError utility for API errors and use translateError for localized error messages
Use useFormControl for form field state, implement proper validation, and handle loading and error states in forms
Use localization keys for all form labels and placeholders
Use element descriptors for consistent styling and follow the theme token system
Use the Card and FormContainer patterns for consistent UI structure

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
**/*.{js,jsx,ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

**/*.{js,jsx,ts,tsx}: All code must pass ESLint checks with the project's configuration
Follow established naming conventions (PascalCase for components, camelCase for variables)
Maintain comprehensive JSDoc comments for public APIs
Use dynamic imports for optional features
All public APIs must be documented with JSDoc
Provide meaningful error messages to developers
Include error recovery suggestions where applicable
Log errors appropriately for debugging
Lazy load components and features when possible
Implement proper caching strategies
Use efficient data structures and algorithms
Profile and optimize critical paths
Validate all inputs and sanitize outputs
Implement proper logging with different levels

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
**/*.{js,jsx,ts,tsx,json,css,scss,md,yaml,yml}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use Prettier for consistent code formatting

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
packages/**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

TypeScript is required for all packages

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
packages/**/*.{ts,tsx,d.ts}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Packages should export TypeScript types alongside runtime code

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
**/*.{ts,tsx}

📄 CodeRabbit Inference Engine (.cursor/rules/development.mdc)

Use proper TypeScript error types

**/*.{ts,tsx}: Always define explicit return types for functions, especially public APIs
Use proper type annotations for variables and parameters where inference isn't clear
Avoid any type - prefer unknown when type is uncertain, then narrow with type guards
Use interface for object shapes that might be extended
Use type for unions, primitives, and computed types
Prefer readonly properties for immutable data structures
Use private for internal implementation details
Use protected for inheritance hierarchies
Use public explicitly for clarity in public APIs
Prefer readonly for properties that shouldn't change after construction
Prefer composition and interfaces over deep inheritance chains
Use mixins for shared behavior across unrelated classes
Implement dependency injection for loose coupling
Let TypeScript infer when types are obvious
Use const assertions for literal types: as const
Use satisfies operator for type checking without widening
Use mapped types for transforming object types
Use conditional types for type-level logic
Leverage template literal types for string manipulation
Use ES6 imports/exports consistently
Use default exports sparingly, prefer named exports
Use type-only imports: import type { ... } from ...
No any types without justification
Proper error handling with typed errors
Consistent use of readonly for immutable data
Proper generic constraints
No unused type parameters
Proper use of utility types instead of manual type construction
Type-only imports where possible
Proper tree-shaking friendly exports
No circular dependencies
Efficient type computations (avoid deep recursion)

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
**/*.{js,ts,tsx,jsx}

📄 CodeRabbit Inference Engine (.cursor/rules/monorepo.mdc)

Support multiple Clerk environment variables (CLERK_, NEXT_PUBLIC_CLERK_, etc.) for configuration.

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
**/*

⚙️ CodeRabbit Configuration File

If there are no tests added or modified as part of the PR, please suggest that tests be added to cover the changes.

Files:

  • packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts
🧬 Code Graph Analysis (1)
packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts (1)
packages/types/src/session.ts (1)
  • SessionResource (208-261)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)
  • GitHub Check: Formatting | Dedupe | Changeset
  • GitHub Check: Build Packages
  • GitHub Check: semgrep/ci
  • GitHub Check: Analyze (javascript-typescript)
  • GitHub Check: semgrep-cloud-platform/scan
🔇 Additional comments (1)
packages/clerk-js/src/ui/components/SignIn/handleCombinedFlowTransfer.ts (1)

1-8: Type-only imports LGTM

Using import type and adding SessionResource is correct and aligns with our TS guidelines.

@LauraBeatris
Copy link
Member Author

The tests for Next.js are timing out. Still investigating it - running session tasks suit passes fine locally.

When downloading the traces, I can see that the final screen cannot load the user button + the state is still signed out
CleanShot 2025-08-08 at 21 19 05

Sign up for free to 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.

4 participants