useFirstVisit
A hook that detects whether this is the user’s first visit to the site. Perfect for displaying welcome messages, onboarding flows, or first-time user experiences.
Parameters
This hook doesn’t take any parameters.
Returns
boolean
- True if this is the user’s first visit, false otherwise
Usage
import { useFirstVisit } from '@rhinolabs/react-hooks';
function WelcomeMessage() {
const isFirstVisit = useFirstVisit();
return (
<div>
{isFirstVisit ? (
<div className="welcome-banner">
<h1>Welcome to Our Site!</h1>
<p>Let us show you around...</p>
<button>Start Tour</button>
</div>
) : (
<div>Welcome back!</div>
)}
</div>
);
}
Notes
- Uses localStorage for persistence
- Checks on component mount
- One-time detection
- Survives page refreshes
- Browser-based storage
- Efficient state management
- Cross-tab persistence
- Immediate detection
Last updated on