# React Router (/docs/reference/react-router)

```ts
import { … } from "@monarcode/session-kit/react-router";
```

Guide: [React Router](/docs/setups/react-router).

## Functions [#functions]

### redirectIfSignedIn [#redirectifsignedin]

Guards your sign-in page in its loader, so a signed-in user goes straight to `redirectTo`, made safe with `safeReturnTo`.

### requireSession [#requiresession]

Guards a route in its loader, in data or framework mode, so only signed-in users get through. They get `{ session }`, which holds no tokens.

### useAuthRevalidation [#useauthrevalidation]

Runs your loaders again when the session changes, so guards such as `requireSession` check it again. That's on sign-in, sign-out, a switch of account, a profile update, a lock, or a refresh that fails once the access token has expired. A token refresh alone doesn't, nor does a failed refresh while the token is still valid.

## Components [#components]

### SessionOutlet [#sessionoutlet]

Renders child routes only while someone is signed in, in any mode. It needs an `AuthProvider` above it, or a `client`.

## Types [#types]

### RedirectIfSignedInOptions [#redirectifsignedinoptions]

Options for [`redirectIfSignedIn`](#redirectifsignedin).

### RedirectIfSignedInOptions

Options for redirectIfSignedIn.

| Prop         | Type      | Description                                                                                              |
| ------------ | --------- | -------------------------------------------------------------------------------------------------------- |
| `redirectTo` | `unknown` | Where to send a signed-in user, usually the `redirectTo` search param. It's checked with `safeReturnTo`. |
| `loginPath?` | `union`   | Your sign-in page's path, or several. `redirectTo` never sends the user back to one. Default: `"/login"` |

### RequireSessionOptions [#requiresessionoptions]

Options for [`requireSession`](#requiresession).

### RequireSessionOptions

Options for requireSession.

| Prop        | Type     | Description                                                                                                                              |
| ----------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| `request`   | `object` | The loader's `request`. Signed-out users come back to its URL after signing in.                                                          |
| `loginPath` | `string` | Your sign-in page's path, starting with `/`, such as `"/login"`.                                                                         |
| `basename?` | `string` | The router's `basename`, if it has one. Loaders see URLs that include it, but redirects add it again, so `redirectTo` must leave it out. |

### SessionOutletProps [#sessionoutletprops]

Props for [`SessionOutlet`](#sessionoutlet).

### SessionOutletProps

Props for SessionOutlet.

| Prop           | Type              | Description                                                                                                                                                                 |
| -------------- | ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `loginPath`    | `string`          | Your sign-in page's path, starting with `/`, such as `"/login"`.                                                                                                            |
| `pending?`     | `ReactNode`       | Shown while the saved session is read and, in data mode, until the loader has accepted a new session.                                                                       |
| `unavailable?` | `function`        | Shown when the session is `unavailable`, such as after a failed refresh (UnavailableProps). Without it, the error is thrown to the nearest error boundary or error element. |
| `client?`      | `RetryableSource` | The client to watch. Default: the nearest `AuthProvider`'s.                                                                                                                 |

### UnavailableProps [#unavailableprops]

What the `unavailable` render prop of an adapter component, such as React Router's `SessionOutlet` or Expo's `SessionGate`, receives.

### UnavailableProps

What the `unavailable` render prop of an adapter component, such as React
Router's `SessionOutlet` or Expo's `SessionGate`, receives.

| Prop    | Type       | Description                                                                     |
| ------- | ---------- | ------------------------------------------------------------------------------- |
| `error` | `union`    | Why access is unavailable, such as a failed refresh or a locked keychain.       |
| `retry` | `function` | Tries again, as `auth.retry()` does. A repeated failure stays in `state.error`. |