AI Chatbot - Assistant UI

A chat block for assistant-ui (React) that talks directly to Drupal's AI module over a plain HTTP + Server-Sent Events endpoint.

Features

• Live tool-call output. Tool calls stream as they execute, showing the tool's actual result rather than a generic "Calling <tool>" placeholder — including a per-tool progress message while it's still running.
• File attachments, safely staged. Visitors can attach files from the composer. Bytes are staged in a private, per-user temp store and only ever become a permanent Drupal file once the model explicitly calls the file_create tool — nothing is written to disk on upload alone, so an attached-then-abandoned file never leaves an orphan.
• Slash commands and starter prompts. Prompts from the AI Prompt library show up as / commands and empty-state suggestion buttons, with a parameter dialog for prompts that take variables.
• Toolbar and top-bar toggle. An Assistant button appears in the toolbar and top bar wherever an enabled sidebar block exists and the current user may chat, matching how AI Chatbot's own DeepChat toggle behaves.
• Sidebar or inline placement. The default sidebar is collapsible, resizable (with snap points) and keyboard-summonable (Cmd/Ctrl+K); or render the chat directly in a block region instead.
• Safe Markdown rendering. Replies render through react-markdown, which escapes embedded HTML — model output can never inject markup into the page.
• Native theming. Sidebar and panel chrome are styled against core's default_admin/Gin design tokens, with plain-CSS fallbacks otherwise.

How it works

assistant-ui (useLocalRuntime)  ──POST──▶  /api/assistant-ui/chat
        ▲                                          │
        └────────── SSE, ui-message-stream ─────────┘

A whole turn — including every tool call the agent makes — runs inside one request. History is read from and written to AiAssistantApiRunner's existing private-tempstore storage, so nothing new is introduced there; the thread id round-trips in the request body and the X-Assistant-Thread-Id response header. Tool execution events from ai_agents (when present) are re-emitted as protocol frames, so a configured agent's tool calls show up live without any extra wiring.

Requirements

• Drupal ^11
• AI (ai:ai, ai:ai_assistant_api)
• Tool (tool:tool)

ai_chatbot is not a dependency.

Installation

1. Install as usual, e.g. composer require drupal/ai_chatbot_assistant_ui.
2. Grant Use the AI Assistant UI chat to whichever roles may chat.
3. Place the AI Chatbot (assistant-ui) block and pick a configured AI Assistant.

Building the frontend

The compiled bundle is committed under dist/, so installing the module is enough to run it — no build step required at install time. To change the frontend itself:

npm install
npm run build
npm test

The frontend is bundled with esbuild; no framework build tooling runs on the Drupal side.