> For the complete documentation index, see [llms.txt](https://sdkdocs.deva.me/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sdkdocs.deva.me/authentication/logout-handling.md).

# Logout Handling

## How It Works

The `logout` function from the `useDeva` hook terminates the user's session by revoking tokens and clearing all stored authentication state.

***

## Implementation

```tsx
import { useDeva } from "@bitplanet/deva-sdk";

function LogoutButton() {
  const { logout, isAuthenticated, user } = useDeva();

  if (!isAuthenticated) {
    return null;
  }

  return (
    <div>
      <p>Logged in as {user?.persona?.display_name}</p>
      <button onClick={logout}>Logout</button>
    </div>
  );
}
```

***

## What Happens When User Clicks Logout

1. **Revoke Token** - SDK calls the revocation endpoint to invalidate the access token
2. **Clear Stored State** - All authentication data is removed from browser storage
3. **Reset Auth State** - `isAuthenticated` becomes `false` and `user` becomes `null`
4. **Clear Errors** - Any authentication errors are cleared

After logout, the user must log in again to access protected features. Learn more about the [OAuth Logout](/authentication/oauth-integration.md#logout-flow) flow.

***

## Complete Example with Login/Logout

```tsx
import { useDeva } from "@bitplanet/deva-sdk";

function AuthButton() {
  const { login, logout, isAuthenticated, isReady, user } = useDeva();

  if (!isReady) {
    return <div>Loading...</div>;
  }

  if (!isAuthenticated) {
    return <button onClick={login}>Login with Deva</button>;
  }

  return (
    <div>
      <p>Welcome, {user?.persona?.display_name}!</p>
      <button onClick={logout}>Logout</button>
    </div>
  );
}
```

***

## Best Practices

**Conditional Rendering** Only show the logout button when `isAuthenticated` is true.

**User Confirmation** For critical applications, consider adding a confirmation dialog before logout.

**Post-Logout Redirect** After logout, redirect users to a public page or show appropriate UI.

**Handle Async** The `logout` function is asynchronous. Handle loading states if needed:

```tsx
const [isLoggingOut, setIsLoggingOut] = useState(false);

const handleLogout = async () => {
  setIsLoggingOut(true);
  await logout();
  // Post-logout actions here
};
```

***

## Related Documentation

* [Deva SSO](/authentication/deva-sso.md) - Why use Deva authentication
* [OAuth Integration](/authentication/oauth-integration.md) - Technical OAuth flow details
* [Authentication Flow](/core-concepts/authentication-flow.md) - How authentication works
* [Login Implementation](/authentication/login-implementation.md) - Implement login functionality
* [Token Management](/authentication/token-management.md) - Understand token lifecycle