> ## Documentation Index
> Fetch the complete documentation index at: https://urbackend-mintlify-f636efa8.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# <UrProvider>

> The core Context Provider for the urBackend React SDK.

The `<UrProvider>` is the heart of the React SDK. It initializes the urBackend client, manages global authentication state, and synchronizes the user's session seamlessly across your application.

You must wrap your entire application (or at least the parts that require authentication and database access) inside this provider.

## Usage

```tsx theme={null}
import { UrProvider } from '@urbackend/react';

function App() {
  return (
    <UrProvider apiKey="pk_live_your_publishable_api_key">
      <YourApplicationComponents />
    </UrProvider>
  );
}
```

## Props

| Prop       | Type              | Required | Description                                                                |
| ---------- | ----------------- | -------- | -------------------------------------------------------------------------- |
| `apiKey`   | `string`          | Yes      | Your project's Publishable API Key (`pk_live_...`).                        |
| `baseUrl`  | `string`          | No       | Overrides the default urBackend API URL. Useful for self-hosted instances. |
| `children` | `React.ReactNode` | Yes      | The components to render inside the provider.                              |

## How it works

When `<UrProvider>` mounts, it automatically:

1. Initializes a singleton `@urbackend/sdk` instance.
2. Checks `localStorage` for an existing active session. The access token is read from `ub_auth_token` and the refresh token from `ub_refresh_token`.
3. Attempts to refresh the session in the background by calling `auth.refreshToken()`, which sends the stored refresh token in the `x-refresh-token` header (and falls back to any HTTP-only cookie if no stored token is found). This makes cross-domain auth work without shared cookies.
4. Exposes the `AuthUser` state and SDK client to all child components via React Context (accessed through hooks like `useUser` and `useDb`).

<Note>
  Access tokens live in memory during the session and are mirrored to `localStorage.ub_auth_token`. Refresh tokens are persisted to `localStorage.ub_refresh_token`. Call `client.auth.logout()` (or `setToken(undefined, undefined)`) to clear both.
</Note>

<Note>
  The provider sets up global state. You only ever need **one** `<UrProvider>` at the root of your React tree.
</Note>