Skip to main content

​
Overview

The <SignedIn /> component conditionally renders its children only when a user is authenticated. It’s perfect for showing content that should only be visible to signed-in users.

​
Basic Usage

import { SignedIn } from '@snipextt/wacht'

function App() {
  return (
    <>
      <SignedIn>
        <div>Welcome back! You are signed in.</div>
        <UserDashboard />
      </SignedIn>
    </>
  )
}

​
Props

​
children
React.ReactNode
required
The content to render when the user is signed in.

​
What it includes

  • Conditional Rendering - Only shows children when user is authenticated
  • Loading Handling - Hides content while authentication is loading
  • Performance Optimized - Minimal re-renders, only updates when auth state changes
  • SSR Friendly - Works with server-side rendering