Skip to content
+

Chat - Message feed

Render only ChatMessageList — no input. Send messages programmatically via useChat for read-only embeds and transcript views.

MUI Assistant
MUI Assistant

This is a read-only message feed — no ChatComposer is rendered anywhere on the page.

You
You

So how do new messages appear if there is no input?

MUI Assistant
MUI Assistant

Call useChat().sendMessage() directly. Use this pattern for transcripts, notification feeds, or copilot result panels.


When to use this pattern

Use a display-only message feed when your app controls the conversation flow externally: sending happens on the server, on a schedule, or through a different UI element.

Common use cases:

  • Transcripts — display a completed conversation without allowing replies
  • Notification feeds — show a stream of AI-generated updates
  • Copilot result panels — render assistant output alongside an existing form or editor

How it works

Only ChatRoot (the adapter wrapper) and ChatMessageList are needed. ChatComposer is simply not rendered — there is no prop to "hide" it.

To send a message programmatically, call useChat().sendMessage() from any component inside ChatRoot:

const { sendMessage, isStreaming } = useChat();

sendMessage({
  conversationId: 'my-thread',
  parts: [{ type: 'text', text: 'Generate a summary.' }],
});

See also

API