Skip to content

feat(appkit): agent chat UI primitives#366

Open
hubertzub-db wants to merge 1 commit into
databricks:mainfrom
hubertzub-db:agent/v2/chatui/1-building-blocks
Open

feat(appkit): agent chat UI primitives#366
hubertzub-db wants to merge 1 commit into
databricks:mainfrom
hubertzub-db:agent/v2/chatui/1-building-blocks

Conversation

@hubertzub-db
Copy link
Copy Markdown

@hubertzub-db hubertzub-db commented May 8, 2026

Agent chat UI primitives

Adds a small set of headless React building blocks for chatting with an AppKit agents() server, and rewires the dev playground's agent route to use them.

What's new

A new @databricks/appkit-ui/react/chat subpath exporting:

  • <Conversation> — render-prop component that runs the whole chat (streaming, history, scroll-stick).
  • <ChatInput> — render-prop input that handles Enter / Shift+Enter / IME / streaming-state.
  • useChat and useScrollToBottom — the underlying hooks for custom layouts.
  • ResponsesApiTransport — the bit that talks to the agents plugin.

The smallest working chat is now ~30 lines of JSX, and threads, tool calls, reasoning ("thinking…"), and destructive-tool approval prompts all stream through without any server-side glue.

Docs at docs/docs/api/appkit-ui/chat/index.md.

Why

Until now, anyone building a chat UI on top of the agents plugin had to hand-roll SSE parsing, message reducers, scroll behavior, thread-id plumbing, etc. — the dev playground's agent route was 500+ lines of exactly that. Now it's the same UI, but built out of reusable parts, and any consumer gets the same thing for free.

We're piggy-backing on the Vercel AI SDK (@ai-sdk/react, ai) for the reducer / state machine — they're declared as optional peer dependencies, so apps that don't use the chat primitives don't pull them in.

Demo (playground still works)

Screen.Recording.2026-05-08.at.17.32.23.mov

Another demo (tool approval)

approval-minimal

What changed in the playground

apps/dev-playground/client/src/routes/agent.route.tsx was rewritten to use the new primitives. Behavior is the same (chat bubbles, tool approvals, autocomplete, event-stream debug panel), just driven by the shared components instead of inline SSE handling.

Notes for reviewers

  • Tests live next to the transport (responses-api-transport.test.ts) and cover the wire-format translation end-to-end.
  • The agents plugin's wire format is unchanged — this is a pure client-side addition.
  • Only text user messages are supported for now (the agents plugin doesn't accept attachments yet).

@hubertzub-db hubertzub-db requested a review from a team as a code owner May 8, 2026 08:58
@hubertzub-db hubertzub-db requested a review from pkosiec May 8, 2026 08:58
@hubertzub-db hubertzub-db force-pushed the agent/v2/chatui/1-building-blocks branch 2 times, most recently from 7f2fddf to ec42841 Compare May 8, 2026 13:01
@hubertzub-db hubertzub-db changed the title Agent/v2/chatui/1 building blocks feat(appkit): agent chat UI primitives May 8, 2026
@hubertzub-db hubertzub-db force-pushed the agent/v2/chatui/1-building-blocks branch 2 times, most recently from 568a77a to e2ded5a Compare May 8, 2026 14:36
"vaul": "1.1.2"
},
"peerDependencies": {
"@ai-sdk/react": "~4.0.0-beta",
Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

note: we're importing canary channel since 4.0+ allows for customizing messages transport easily, should be published as stable very soon

Signed-off-by: Hubert Zub <hubert.zub@databricks.com>
@hubertzub-db hubertzub-db force-pushed the agent/v2/chatui/1-building-blocks branch from e2ded5a to c70492a Compare May 18, 2026 08:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant