Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/factor-two-redirect-signed-in-forward.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@clerk/ui': patch
---

Redirect signed-in users forward to afterSignInUrl when landing on factor-two without a pending 2FA session, instead of redirecting back to sign-in start
22 changes: 15 additions & 7 deletions packages/ui/src/components/SignIn/SignInFactorTwo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { withCardStateProvider } from '@/ui/elements/contexts';
import { LoadingCard } from '@/ui/elements/LoadingCard';

import { withRedirectToAfterSignIn, withRedirectToSignInTask } from '../../common';
import { useCoreSignIn } from '../../contexts';
import { useCoreSignIn, useSignInContext } from '../../contexts';
import { useRouter } from '../../router';
import { SignInFactorTwoAlternativeMethods } from './SignInFactorTwoAlternativeMethods';
import { SignInFactorTwoBackupCodeCard } from './SignInFactorTwoBackupCodeCard';
Expand All @@ -16,9 +16,10 @@ import { SignInFactorTwoTOTPCard } from './SignInFactorTwoTOTPCard';
import { useSecondFactorSelection } from './useSecondFactorSelection';

function SignInFactorTwoInternal(): JSX.Element {
const { __internal_setActiveInProgress } = useClerk();
const clerk = useClerk();
const signIn = useCoreSignIn();
const router = useRouter();
const { afterSignInUrl } = useSignInContext();
const {
currentFactor,
factorAlreadyPrepared,
Expand All @@ -29,17 +30,24 @@ function SignInFactorTwoInternal(): JSX.Element {
} = useSecondFactorSelection(signIn.supportedSecondFactors);

React.useEffect(() => {
if (__internal_setActiveInProgress) {
if (clerk.__internal_setActiveInProgress) {
return;
}

// If the sign-in was reset or doesn't exist, redirect back to the start.
// If the sign-in doesn't need second factor verification, redirect away.
// Don't redirect for 'complete' status - setActive will handle navigation.
if (signIn.status === null || signIn.status === 'needs_identifier' || signIn.status === 'needs_first_factor') {
void router.navigate('../');
// If the user is already signed in (e.g. multi-session app, page reload after
// successful verification), redirect forward to afterSignInUrl instead of
// back to sign-in start.
if (clerk.isSignedIn) {
void router.navigate(afterSignInUrl);
} else {
void router.navigate('../');
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps -- Match SignInFactorOne pattern: only run on mount and when setActiveInProgress changes
}, [__internal_setActiveInProgress]);
// eslint-disable-next-line react-hooks/exhaustive-deps -- Only run on mount and when setActiveInProgress changes
}, [clerk.__internal_setActiveInProgress]);

if (!currentFactor) {
return <LoadingCard />;
Expand Down
Loading