useSession

Access the current Session object inside your components.

Overview

The useSession hook accesses the current user Session object. It can be used to retrieve information about the session status. The useSession hook is a shortcut for retrieving the Clerk.session property.

As soon as a User signs in, we create a Session on the Client object. Only one session can be active on a single client, and that's exactly the session that is returned by the useSession hook.

The Session object returned from the hook will hold all state for the currently active session. As such, the useSession hook must be called from a component that is a descendant of the <SignedIn/> component. Otherwise, the hook will throw an error.

Usage

Make sure you've followed the installation guide for Clerk React before running the snippets below.

The following example accesses the Session object in order to display how long a user has been active in this client session. Note that you can also get to the User object through the useSession hook.

import { SignedIn, useSession } from "@clerk/clerk-react";
function App() {
return (
<SignedIn>
<Analytics />
</SignedIn>
);
}
function Analytics() {
const session = useSession();
const { user } = session;
return (
<div>
User {user.firstName} has been active
since {session.lastActiveAt}.
</div>
);
}