# Chat History for AI SDK
URL: /docs/cloud/persistence/ai-sdk

Integrate cloud persistence and thread management with Vercel AI SDK.

***

title: Chat History for AI SDK
description: Integrate cloud persistence and thread management with Vercel AI SDK.
----------------------------------------------------------------------------------

import { InstallCommand } from "@/components/docs/fumadocs/install/install-command";

## Overview

assistant-cloud provides thread management and persistent chat history for applications built with the [AI SDK by Vercel](https://sdk.vercel.ai/). This guide shows you how to integrate cloud persistence into your AI SDK application.

## Prerequisites

<Callout type="info">
  You need an assistant-cloud account to follow this guide. [Sign up here](https://cloud.assistant-ui.com/) to get started.
</Callout>

## Setup Guide

<Steps>
  <Step>
    ### Create a Cloud Project

    Create a new project in the [assistant-cloud dashboard](https://cloud.assistant-ui.com/) and from the settings page, copy:

    * **Frontend API URL**: `https://proj-[ID].assistant-api.com`
    * **Assistant Cloud API Key**: `sk_aui_proj_*`
  </Step>

  <Step>
    ### Configure Environment Variables

    Add the following environment variables to your project:

    ```bash title=".env.local"
    # Frontend API URL from your cloud project settings
    NEXT_PUBLIC_ASSISTANT_BASE_URL=https://proj-[YOUR-ID].assistant-api.com

    # API key for server-side operations
    ASSISTANT_API_KEY=your-api-key-here
    ```
  </Step>

  <Step>
    ### Install Dependencies

    Install the required packages:

    <InstallCommand npm={["@assistant-ui/react", "@assistant-ui/react-ai-sdk"]} />
  </Step>

  <Step>
    ### Set Up the Cloud Runtime

    Create a client-side AssistantCloud instance and integrate it with your AI SDK runtime:

    ```tsx title="app/chat/page.tsx"
    "use client";

    import { AssistantCloud, AssistantRuntimeProvider } from "@assistant-ui/react";
    import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
    import { ThreadList } from "@/components/assistant-ui/thread-list";
    import { Thread } from "@/components/assistant-ui/thread";

    export default function ChatPage() {
      const cloud = new AssistantCloud({
        baseUrl: process.env.NEXT_PUBLIC_ASSISTANT_BASE_URL!,
        anonymous: true, // Creates browser-session based user ID
      });

      const runtime = useChatRuntime({
        api: "/api/chat", // Your AI SDK endpoint
        cloud,
      });

      return (
        <AssistantRuntimeProvider runtime={runtime}>
          <div className="grid h-dvh grid-cols-[200px_1fr] gap-x-2 px-4 py-4">
            <ThreadList />
            <Thread />
          </div>
        </AssistantRuntimeProvider>
      );
    }
    ```
  </Step>
</Steps>

## Authentication

The example above uses `anonymous: true` which creates a browser session-based user ID. This is suitable for public demos or prototypes.

For production apps with user accounts, see the [Cloud Authorization](/docs/cloud/authorization) guide to persist threads per user or workspace.

## Next Steps

* Learn about [user authentication](/docs/cloud/authorization) for multi-user applications
* Explore [runtime hooks](/docs/api-reference/integrations/vercel-ai-sdk) and integration options
* Check out the [complete example](https://github.com/assistant-ui/assistant-ui/tree/main/examples/with-cloud) on GitHub