> ## Documentation Index
> Fetch the complete documentation index at: https://docs.privacyboost.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Wallet integration

# Wallet Integration

This guide covers connecting wallets and authenticating users with the Privacy Boost React SDK.

## Basic Authentication

```tsx theme={null}
import { useAuth } from '@sunnyside-io/privacy-boost-react';

function LoginButton() {
  const { isAuthenticated, authenticateWithWalletAdapter, logout } = useAuth();

  if (isAuthenticated) {
    return <button onClick={logout}>Logout</button>;
  }

  return (
    <button onClick={() => authenticateWithWalletAdapter()}>
      Connect Wallet
    </button>
  );
}
```

## useAuth Return Value

| Property                        | Type                             | Description                             |
| ------------------------------- | -------------------------------- | --------------------------------------- |
| `isConnected`                   | `boolean`                        | Whether a wallet is connected           |
| `isAuthenticated`               | `boolean`                        | Whether the user is fully authenticated |
| `isWalletAvailable`             | `boolean`                        | Whether a wallet provider exists        |
| `address`                       | `string \| null`                 | Connected wallet address                |
| `privacyAddress`                | `string \| null`                 | User's privacy address                  |
| `authenticate`                  | `(adapter, options?) => Promise` | Authenticate with a wallet adapter      |
| `authenticateWithWalletAdapter` | `(options?) => Promise`          | Authenticate with browser wallet        |
| `logout`                        | `() => Promise`                  | Full sign-out                           |
| `clearSession`                  | `() => Promise`                  | Clear auth token, keep keys             |

## Injected Wallet (MetaMask, etc.)

```tsx theme={null}
const { authenticateWithWalletAdapter } = useAuth();

const result = await authenticateWithWalletAdapter();
console.log('Privacy address:', result.privacyAddress);
```

## Custom Wallet Adapter

```tsx theme={null}
function WalletConnect() {
  const { authenticate } = useAuth();

  const handleConnect = async () => {
    const adapter = {
      getAddress: async () => walletClient.account.address,
      signMessage: async ({ message }) => walletClient.signMessage({ message }),
    };

    const result = await authenticate(adapter);
    console.log('Authenticated:', result.privacyAddress);
  };

  return <button onClick={handleConnect}>Connect</button>;
}
```

## Complete Example

```tsx theme={null}
import { useAuth } from '@sunnyside-io/privacy-boost-react';

function ConnectWallet() {
  const {
    isAuthenticated,
    isWalletAvailable,
    address,
    authenticateWithWalletAdapter,
    logout,
  } = useAuth();
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);

  const handleConnect = async () => {
    setLoading(true);
    setError(null);
    try {
      await authenticateWithWalletAdapter();
    } catch (err: any) {
      if (err.code !== 'SIGNATURE_REJECTED') {
        setError(err.message);
      }
    } finally {
      setLoading(false);
    }
  };

  if (!isWalletAvailable) {
    return <p>Please install a wallet extension</p>;
  }

  if (isAuthenticated) {
    return (
      <div>
        <p>Connected: {address?.slice(0, 6)}...{address?.slice(-4)}</p>
        <button onClick={logout}>Disconnect</button>
      </div>
    );
  }

  return (
    <div>
      {error && <p style={{ color: 'red' }}>{error}</p>}
      <button onClick={handleConnect} disabled={loading}>
        {loading ? 'Connecting...' : 'Connect Wallet'}
      </button>
    </div>
  );
}
```

## Error Handling

```tsx theme={null}
try {
  await authenticateWithWalletAdapter();
} catch (error: any) {
  switch (error.code) {
    case 'SIGNATURE_REJECTED':
      return;
    case 'WALLET_NOT_FOUND':
      setError('No wallet detected');
      break;
    default:
      setError(error.message);
  }
}
```

## Best Practices

### 1. Check Wallet Availability

Always check `isWalletAvailable` before showing the connect button.

### 2. Handle Signature Rejection Silently

When users cancel the wallet signature, don't show an error.

### 3. Show Connection State

Display the connected wallet address so users can verify which account is active.

## Next Steps

* [Session Storage](./session-storage)
* [Deposits Guide](./deposits)
* [Provider Setup](./provider-setup)
* [Error Handling](./error-handling)