Memory
## assistant-ui Research Summary (July 2026) ### What It Is React component library for building AI chat interfaces. Provides primitives (Thread, Message, Composer, ActionBar, BranchPicker) and higher-level components. Supports multiple backends via "runtimes." ### Architecture (3 Layers) 1. **Core runtimes** — LocalRuntime (you write adapter) or ExternalStoreRuntime (you own state) 2. **Protocol layers** — DataStream (message streaming) or AssistantTransport (state streaming) 3. **Framework adapters** — react-ai-sdk, react-langgraph, react-google-adk, react-a2a, react-ag-ui, react-opencode ### Cloudflare Agents Integration (KEY FINDING) - Uses `@cloudflare/ai-chat` package's `useAgentChat` hook - Agent is a Durable Object subclassing `AIChatAgent` - WebSocket transport for streaming - SQLite-backed message history - Frontend uses `useAISDKRuntime` from `@assistant-ui/react-ai-sdk` - **Two-process architecture**: Worker (agent) + separate frontend app - `routeAgentRequest` handles WebSocket upgrades and agent lookup - `name` parameter on client = Durable Object instance key (per-user = per-DO) ### Custom Backend Options 1. **ChatModelAdapter** — simplest, just implement `run` function 2. **RemoteThreadListRuntime** — you own threads in your database, implement adapter 3. **AssistantTransport** — stream full agent state (not just messages) 4. **DataStream** — backend emits standardized message stream ### Thread Management - **AssistantCloud** — managed multi-thread service - **RemoteThreadListRuntime** — your database, you implement adapter (list, initialize, rename, archive, delete, fetch, generateTitle) - **ExternalStoreThreadListAdapter** — threads in your store ### Key Primitives - `ThreadPrimitive` — scrollable message container with auto-scroll - `MessagePrimitive` — message rendering with parts pipeline - `ComposerPrimitive` — text input with send button - `ActionBarPrimitive` — copy/reload/edit actions - `BranchPickerPrimitive` — navigate alternative responses - `ThreadListPrimitive` — sidebar thread list ### Templates Available - Base Assistant UI (full chat app) - ChatGPT, Claude, Grok, Gemini, Perplexity style assistants - Webpage with Assistant (sidebar/modal) - Product Page with Floating Assistant - React Ink Terminal Assistant - Expo React Native Assistant ### Decision for DocuClear Clearspace **Best path**: Cloudflare Agents integration - Worker: Durable Object subclassing `AIChatAgent` (or custom) - Frontend: assistant-ui with `useAgentChat` + `useAISDKRuntime` - WebSocket streaming for real-time - SQLite for message persistence (via DO) - Custom thread management for workspaces
Tags: research, assistant-ui, frontend, architecture, project:docuclear_clearspace, kind:semantic — Source: claude — 2026-07-18 19:30:41 UTC