diff --git a/.changeset/slick-suns-hammer.md b/.changeset/slick-suns-hammer.md new file mode 100644 index 00000000000..bfdfc4025fd --- /dev/null +++ b/.changeset/slick-suns-hammer.md @@ -0,0 +1,7 @@ +--- +'@clerk/nextjs': minor +'@clerk/clerk-react': minor +'@clerk/vue': minor +--- + +Introduce `` component diff --git a/packages/nextjs/src/client-boundary/controlComponents.ts b/packages/nextjs/src/client-boundary/controlComponents.ts index aff293ea2da..fd5a2b586fe 100644 --- a/packages/nextjs/src/client-boundary/controlComponents.ts +++ b/packages/nextjs/src/client-boundary/controlComponents.ts @@ -10,6 +10,7 @@ export { Protect, RedirectToSignIn, RedirectToSignUp, + RedirectToTask, RedirectToUserProfile, AuthenticateWithRedirectCallback, RedirectToCreateOrganization, diff --git a/packages/nextjs/src/index.ts b/packages/nextjs/src/index.ts index b3f31c65cb5..7eef4f48361 100644 --- a/packages/nextjs/src/index.ts +++ b/packages/nextjs/src/index.ts @@ -12,6 +12,7 @@ export { RedirectToOrganizationProfile, RedirectToSignIn, RedirectToSignUp, + RedirectToTask, RedirectToUserProfile, } from './client-boundary/controlComponents'; diff --git a/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap index cf341e7e63b..90de3c5f7ec 100644 --- a/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/react-router/src/__tests__/__snapshots__/exports.test.ts.snap @@ -20,6 +20,7 @@ exports[`root public exports > should not change unexpectedly 1`] = ` "RedirectToOrganizationProfile", "RedirectToSignIn", "RedirectToSignUp", + "RedirectToTask", "RedirectToUserProfile", "SignIn", "SignInButton", diff --git a/packages/react/src/components/controlComponents.tsx b/packages/react/src/components/controlComponents.tsx index 933ff91daaf..1d1d463cded 100644 --- a/packages/react/src/components/controlComponents.tsx +++ b/packages/react/src/components/controlComponents.tsx @@ -166,6 +166,21 @@ export const RedirectToSignUp = withClerk(({ clerk, ...props }: WithClerkProp { + const { session } = clerk; + + React.useEffect(() => { + if (!session) { + void clerk.redirectToSignIn(); + return; + } + + void clerk.__internal_navigateToTaskIfAvailable(); + }, []); + + return null; +}, 'RedirectToTask'); + /** * @function * @deprecated Use [`redirectToUserProfile()`](https://clerk.com/docs/references/javascript/clerk#redirect-to-user-profile) instead. diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts index 1bf25df2516..c935651a3ec 100644 --- a/packages/react/src/components/index.ts +++ b/packages/react/src/components/index.ts @@ -25,6 +25,7 @@ export { RedirectToOrganizationProfile, RedirectToSignIn, RedirectToSignUp, + RedirectToTask, RedirectToUserProfile, SignedIn, SignedOut, diff --git a/packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap index ec0a68f23ca..677ce5a5906 100644 --- a/packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/remix/src/__tests__/__snapshots__/exports.test.ts.snap @@ -21,6 +21,7 @@ exports[`root public exports > should not change unexpectedly 1`] = ` "RedirectToOrganizationProfile", "RedirectToSignIn", "RedirectToSignUp", + "RedirectToTask", "RedirectToUserProfile", "SignIn", "SignInButton", diff --git a/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap index 2bf005468b4..969b5793f21 100644 --- a/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/tanstack-react-start/src/__tests__/__snapshots__/exports.test.ts.snap @@ -32,6 +32,7 @@ exports[`root public exports > should not change unexpectedly 1`] = ` "RedirectToOrganizationProfile", "RedirectToSignIn", "RedirectToSignUp", + "RedirectToTask", "RedirectToUserProfile", "SignIn", "SignInButton", diff --git a/packages/vue/src/components/controlComponents.ts b/packages/vue/src/components/controlComponents.ts index 843254fe04c..bda13710b10 100644 --- a/packages/vue/src/components/controlComponents.ts +++ b/packages/vue/src/components/controlComponents.ts @@ -60,6 +60,21 @@ export const RedirectToSignUp = defineComponent((props: RedirectOptions) => { return () => null; }); +export const RedirectToTask = defineComponent((props: RedirectOptions) => { + const { sessionCtx } = useClerkContext(); + + useClerkLoaded(clerk => { + if (!sessionCtx.value) { + void clerk.redirectToSignIn(props); + return; + } + + void clerk.__internal_navigateToTaskIfAvailable(); + }); + + return () => null; +}); + /** * @deprecated Use [`redirectToUserProfile()`](https://clerk.com/docs/references/javascript/clerk/redirect-methods#redirect-to-user-profile) instead. */