# 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


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://sdkdocs.deva.me/authentication/logout-handling.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.