<RedirectToUserProfile />
(deprecated)
The <RedirectToUserProfile />
component will navigate to the Account Portal User Profile URL which has been configured in your application instance. The behavior will be just like a server-side (3xx) redirect, and will override the current location in the history stack.
To find your User Profile URL:
- In the Clerk Dashboard, navigate to the Account Portal page.
- Under User profile, select the Visit icon.
Usage
import { ClerkProvider, SignedIn, SignedOut, RedirectToUserProfile } from '@clerk/nextjs'
import { AppProps } from 'next/app'
function MyApp({ Component, pageProps }: AppProps) {
return (
<ClerkProvider {...pageProps}>
<SignedIn>
<RedirectToUserProfile />
</SignedIn>
<SignedOut>
<p>You need to sign in to view your user profile.</p>
</SignedOut>
</ClerkProvider>
)
}
export default MyApp
import { ClerkProvider, SignedIn, SignedOut, RedirectToUserProfile } from '@clerk/clerk-react'
// Import your Publishable Key
const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
if (!PUBLISHABLE_KEY) {
throw new Error('Add your Clerk Publishable Key to the .env.local file')
}
function PrivatePage() {
return (
<ClerkProvider publishableKey={PUBLISHABLE_KEY}>
<SignedIn>
<RedirectToUserProfile />
</SignedIn>
<SignedOut>
<p>You need to sign in to view your user profile.</p>
</SignedOut>
</ClerkProvider>
)
}
import { SignedIn, SignedOut, RedirectToUserProfile } from '@clerk/remix'
export default function Index() {
return (
<div>
<SignedIn>
<RedirectToUserProfile />
</SignedIn>
<SignedOut>
<p>You need to sign in to view your user profile.</p>
</SignedOut>
</div>
)
}
Feedback
Last updated on