Complete "Sending large follow-up messages" pattern documentation
Add new pattern showing how to combine `updateModelContext()` with `sendMessage()` when data exceeds message size limits. The example demonstrates offloading a large transcript to model context first, then sending a brief trigger message. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
89653cbb7a
commit
e626b84d44
3 changed files with 36 additions and 15 deletions
|
|
@ -64,6 +64,12 @@ Use {@link app!App.updateModelContext updateModelContext} to keep the model info
|
||||||
|
|
||||||
{@includeCode ../src/app.examples.ts#App_updateModelContext_appState}
|
{@includeCode ../src/app.examples.ts#App_updateModelContext_appState}
|
||||||
|
|
||||||
|
## Sending large follow-up messages
|
||||||
|
|
||||||
|
When you need to send more data than fits in a message, use {@link app!App.updateModelContext updateModelContext} to set the context first, then {@link app!App.sendMessage sendMessage} with a brief prompt to trigger a response:
|
||||||
|
|
||||||
|
{@includeCode ../src/app.examples.ts#App_sendMessage_withLargeContext}
|
||||||
|
|
||||||
## Persisting widget state
|
## Persisting widget state
|
||||||
|
|
||||||
To persist widget state across conversation reloads (e.g., current page in a PDF viewer, camera position in a map), use [`localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) with a stable identifier provided by the server.
|
To persist widget state across conversation reloads (e.g., current page in a PDF viewer, camera position in a map), use [`localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) with a stable identifier provided by the server.
|
||||||
|
|
|
||||||
|
|
@ -81,18 +81,6 @@ async function App_basicUsage() {
|
||||||
//#endregion App_basicUsage
|
//#endregion App_basicUsage
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Example: Sending a message to the host's chat.
|
|
||||||
*/
|
|
||||||
async function App_sendMessage(app: App) {
|
|
||||||
//#region App_sendMessage
|
|
||||||
await app.sendMessage({
|
|
||||||
role: "user",
|
|
||||||
content: [{ type: "text", text: "Weather updated!" }],
|
|
||||||
});
|
|
||||||
//#endregion App_sendMessage
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Example: Check host capabilities after connection.
|
* Example: Check host capabilities after connection.
|
||||||
*/
|
*/
|
||||||
|
|
@ -329,6 +317,33 @@ async function App_sendMessage_textFromInteraction(app: App) {
|
||||||
//#endregion App_sendMessage_textFromInteraction
|
//#endregion App_sendMessage_textFromInteraction
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Example: Send follow-up message after offloading large data to model context.
|
||||||
|
*/
|
||||||
|
async function App_sendMessage_withLargeContext(
|
||||||
|
app: App,
|
||||||
|
fullTranscript: string,
|
||||||
|
speakerNames: string[],
|
||||||
|
) {
|
||||||
|
//#region App_sendMessage_withLargeContext
|
||||||
|
const markdown = `---
|
||||||
|
word-count: ${fullTranscript.split(/\s+/).length}
|
||||||
|
speaker-names: ${speakerNames.join(", ")}
|
||||||
|
---
|
||||||
|
|
||||||
|
${fullTranscript}`;
|
||||||
|
|
||||||
|
// Offload long transcript to model context
|
||||||
|
await app.updateModelContext({ content: [{ type: "text", text: markdown }] });
|
||||||
|
|
||||||
|
// Send brief trigger message
|
||||||
|
await app.sendMessage({
|
||||||
|
role: "user",
|
||||||
|
content: [{ type: "text", text: "Summarize the key points" }],
|
||||||
|
});
|
||||||
|
//#endregion App_sendMessage_withLargeContext
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Example: Log app state for debugging.
|
* Example: Log app state for debugging.
|
||||||
*/
|
*/
|
||||||
|
|
|
||||||
|
|
@ -156,9 +156,6 @@ type RequestHandlerExtra = Parameters<
|
||||||
*
|
*
|
||||||
* @example Basic usage with PostMessageTransport
|
* @example Basic usage with PostMessageTransport
|
||||||
* {@includeCode ./app.examples.ts#App_basicUsage}
|
* {@includeCode ./app.examples.ts#App_basicUsage}
|
||||||
*
|
|
||||||
* @example Sending a message to the host's chat
|
|
||||||
* {@includeCode ./app.examples.ts#App_sendMessage}
|
|
||||||
*/
|
*/
|
||||||
export class App extends Protocol<AppRequest, AppNotification, AppResult> {
|
export class App extends Protocol<AppRequest, AppNotification, AppResult> {
|
||||||
private _hostCapabilities?: McpUiHostCapabilities;
|
private _hostCapabilities?: McpUiHostCapabilities;
|
||||||
|
|
@ -618,6 +615,9 @@ export class App extends Protocol<AppRequest, AppNotification, AppResult> {
|
||||||
* @example Send a text message from user interaction
|
* @example Send a text message from user interaction
|
||||||
* {@includeCode ./app.examples.ts#App_sendMessage_textFromInteraction}
|
* {@includeCode ./app.examples.ts#App_sendMessage_textFromInteraction}
|
||||||
*
|
*
|
||||||
|
* @example Send follow-up message after offloading large data to model context
|
||||||
|
* {@includeCode ./app.examples.ts#App_sendMessage_withLargeContext}
|
||||||
|
*
|
||||||
* @see {@link McpUiMessageRequest} for request structure
|
* @see {@link McpUiMessageRequest} for request structure
|
||||||
*/
|
*/
|
||||||
sendMessage(params: McpUiMessageRequest["params"], options?: RequestOptions) {
|
sendMessage(params: McpUiMessageRequest["params"], options?: RequestOptions) {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue