# Using Session Keys with React

:::warning
Session keys are only available for **Smart Accounts**. By default, the Openfort SDK creates EOA (Externally Owned Account) wallets. To use session keys, you must first [configure your wallet to use a smart account](/docs/products/embedded-wallet/react/wallet).
:::

Session keys are programmable access tokens with specific permissions, designed for controlled interactions with smart accounts. Examples include:

* Granting access to specific areas or features.
* Limiting usage to a set amount of resources (e.g., 1000 units of currency).
* Time-bound validity (e.g., expiring after 3 days).

Permissions can be combined, enabling fine-tuned, context-specific capabilities.

:::tip
Use `useGrantPermissions` to create session keys and `useRevokePermissions` to revoke them. Both follow the EIP-7715 standard. See [useGrantPermissions](/docs/products/embedded-wallet/react/hooks/useGrantPermissions) and [useRevokePermissions](/docs/products/embedded-wallet/react/hooks/useRevokePermissions) for detailed usage.
:::

## Using the `useGrantPermissions` Hook

The `useGrantPermissions` hook provides a simple, client-side way to create and manage session keys using the EIP-7715 standard.

### Quick Example

```tsx
import { generatePrivateKey, privateKeyToAccount } from 'viem/accounts';
import { useGrantPermissions } from '@openfort/react';

function SessionKeyExample() {
  const { grantPermissions, isLoading } = useGrantPermissions({
    onSuccess: (result) => {
      console.log('Permissions granted for wallet:', result.address);
    },
  });

  const createSession = async () => {
    // Generate a new session key
    const sessionKey = generatePrivateKey();
    const sessionAccount = privateKeyToAccount(sessionKey);

    // Store the session key BEFORE granting permissions
    // The hook does not return the private key
    localStorage.setItem('sessionKey', sessionKey);

    const result = await grantPermissions({
      sessionKey,
      request: {
        signer: {
          type: 'account',
          data: { id: sessionAccount.address },
        },
        expiry: 60 * 60 * 24, // 24 hours
        permissions: [
          {
            type: 'contract-call',
            data: {
              address: '0x2522f4fc9af2e1954a3d13f7a5b2683a00a4543a',
              calls: [],
            },
            policies: [],
          },
        ],
      },
    });

    if (result.address) {
      console.log('Session key registered for wallet:', result.address);
    }
  };

  return (
    <button onClick={createSession} disabled={isLoading}>
      {isLoading ? 'Creating...' : 'Create Session Key'}
    </button>
  );
}
```

For more details and advanced usage, see the [useGrantPermissions documentation](/docs/products/embedded-wallet/react/hooks/useGrantPermissions).

## Revoking a session key

Use the `useRevokePermissions` hook to revoke a session key by its address:

```tsx
import { useRevokePermissions } from '@openfort/react'

function RevokeSession() {
  const { revokePermissions, isLoading } = useRevokePermissions()

  const handleRevoke = async (sessionKeyAddress: `0x${string}`) => {
    await revokePermissions({ sessionKey: sessionKeyAddress })
  }

  return (
    <button onClick={() => handleRevoke('0x...')} disabled={isLoading}>
      Revoke session key
    </button>
  )
}
```

For full API reference, see [useRevokePermissions](/docs/products/embedded-wallet/react/hooks/useRevokePermissions).