<SignedOut>
The <SignedOut> component offers authentication checks as a cross-cutting concern. Any child nodes wrapped by a <SignedOut> component will be rendered only if there's no User signed in to your application.
Properties
- Name
treatPendingAsSignedOut?- Description
import { SignedOut, ClerkProvider } 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 file')
}
function Page() {
return (
<ClerkProvider publishableKey={PUBLISHABLE_KEY}>
<SignedOut>
<p>You are signed out.</p>
</SignedOut>
<p>This content is always visible.</p>
</ClerkProvider>
)
}Feedback
Last updated on