@assistant-ui/mcp-docs-server 0.1.29 → 0.1.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.docs/organized/code-examples/waterfall.md +15 -7
- package/.docs/organized/code-examples/with-a2a.md +9 -21
- package/.docs/organized/code-examples/with-ag-ui.md +11 -8
- package/.docs/organized/code-examples/with-ai-sdk-v6.md +10 -10
- package/.docs/organized/code-examples/with-artifacts.md +12 -10
- package/.docs/organized/code-examples/with-assistant-transport.md +11 -12
- package/.docs/organized/code-examples/with-chain-of-thought.md +83 -54
- package/.docs/organized/code-examples/with-cloud-standalone.md +14 -11
- package/.docs/organized/code-examples/with-cloud.md +9 -10
- package/.docs/organized/code-examples/with-custom-thread-list.md +61 -16
- package/.docs/organized/code-examples/with-elevenlabs-conversational.md +17 -12
- package/.docs/organized/code-examples/with-elevenlabs-scribe.md +13 -13
- package/.docs/organized/code-examples/with-expo.md +25 -21
- package/.docs/organized/code-examples/with-external-store.md +8 -8
- package/.docs/organized/code-examples/with-ffmpeg.md +17 -12
- package/.docs/organized/code-examples/with-generative-ui.md +9 -9
- package/.docs/organized/code-examples/with-google-adk.md +8 -8
- package/.docs/organized/code-examples/with-heat-graph.md +5 -5
- package/.docs/organized/code-examples/with-interactables.md +10 -25
- package/.docs/organized/code-examples/with-langchain.md +437 -0
- package/.docs/organized/code-examples/with-langgraph.md +16 -16
- package/.docs/organized/code-examples/with-livekit.md +18 -13
- package/.docs/organized/code-examples/with-opencode.md +105 -62
- package/.docs/organized/code-examples/with-parent-id-grouping.md +10 -10
- package/.docs/organized/code-examples/with-react-hook-form.md +220 -148
- package/.docs/organized/code-examples/with-react-ink.md +2 -2
- package/.docs/organized/code-examples/with-react-router.md +12 -12
- package/.docs/organized/code-examples/with-store.md +8 -5
- package/.docs/organized/code-examples/with-tanstack.md +10 -10
- package/.docs/organized/code-examples/with-tap-runtime.md +10 -6
- package/.docs/raw/docs/(docs)/cli.mdx +2 -1
- package/.docs/raw/docs/(docs)/copilots/assistant-frame.mdx +1 -0
- package/.docs/raw/docs/(docs)/copilots/make-assistant-tool-ui.mdx +10 -3
- package/.docs/raw/docs/(docs)/copilots/make-assistant-tool.mdx +8 -3
- package/.docs/raw/docs/(docs)/copilots/make-assistant-visible.mdx +1 -0
- package/.docs/raw/docs/(docs)/copilots/model-context.mdx +1 -0
- package/.docs/raw/docs/(docs)/copilots/motivation.mdx +1 -0
- package/.docs/raw/docs/(docs)/copilots/use-assistant-instructions.mdx +1 -0
- package/.docs/raw/docs/(docs)/devtools.mdx +1 -0
- package/.docs/raw/docs/(docs)/index.mdx +1 -0
- package/.docs/raw/docs/(docs)/installation.mdx +1 -0
- package/.docs/raw/docs/(docs)/rtl.mdx +80 -0
- package/.docs/raw/docs/(reference)/api-reference/adapters/attachments.mdx +34 -0
- package/.docs/raw/docs/(reference)/api-reference/adapters/feedback-speech.mdx +41 -0
- package/.docs/raw/docs/(reference)/api-reference/adapters/index.mdx +26 -0
- package/.docs/raw/docs/(reference)/api-reference/adapters/persistence.mdx +34 -0
- package/.docs/raw/docs/(reference)/api-reference/adapters/runtime.mdx +31 -0
- package/.docs/raw/docs/(reference)/api-reference/context-providers/index.mdx +20 -0
- package/.docs/raw/docs/(reference)/api-reference/hooks/index.mdx +26 -0
- package/.docs/raw/docs/(reference)/api-reference/hooks/model-context.mdx +72 -0
- package/.docs/raw/docs/(reference)/api-reference/hooks/runtimes.mdx +41 -0
- package/.docs/raw/docs/(reference)/api-reference/hooks/state.mdx +48 -0
- package/.docs/raw/docs/(reference)/api-reference/hooks/utilities.mdx +30 -0
- package/.docs/raw/docs/(reference)/api-reference/integrations/index.mdx +23 -0
- package/.docs/raw/docs/(reference)/api-reference/overview.mdx +21 -0
- package/.docs/raw/docs/(reference)/api-reference/primitives/assistant-if.mdx +7 -0
- package/.docs/raw/docs/(reference)/api-reference/primitives/composer.mdx +149 -40
- package/.docs/raw/docs/(reference)/api-reference/primitives/index.mdx +65 -0
- package/.docs/raw/docs/(reference)/api-reference/primitives/message-part.mdx +2 -0
- package/.docs/raw/docs/(reference)/api-reference/primitives/message.mdx +50 -6
- package/.docs/raw/docs/(reference)/api-reference/primitives/thread-list.mdx +15 -0
- package/.docs/raw/docs/(reference)/api-reference/primitives/thread.mdx +36 -1
- package/.docs/raw/docs/(reference)/api-reference/runtimes/index.mdx +38 -0
- package/.docs/raw/docs/(reference)/api-reference/runtimes/thread-list-runtime.mdx +9 -0
- package/.docs/raw/docs/(reference)/migrations/v0-14.mdx +144 -6
- package/.docs/raw/docs/cloud/ai-sdk-assistant-ui.mdx +231 -3
- package/.docs/raw/docs/cloud/ai-sdk.mdx +221 -3
- package/.docs/raw/docs/cloud/langgraph.mdx +274 -2
- package/.docs/raw/docs/{(docs)/guides → guides}/attachments.mdx +41 -36
- package/.docs/raw/docs/guides/branching.mdx +76 -0
- package/.docs/raw/docs/guides/chain-of-thought.mdx +166 -0
- package/.docs/raw/docs/{(docs)/guides → guides}/context-api.mdx +50 -22
- package/.docs/raw/docs/{(docs)/guides → guides}/dictation.mdx +2 -0
- package/.docs/raw/docs/guides/editing.mdx +102 -0
- package/.docs/raw/docs/guides/index.mdx +103 -0
- package/.docs/raw/docs/{(docs)/guides → guides}/interactables.mdx +49 -0
- package/.docs/raw/docs/{(docs)/guides → guides}/latex.mdx +51 -8
- package/.docs/raw/docs/guides/mentions.mdx +520 -0
- package/.docs/raw/docs/{(docs)/guides → guides}/message-timing.mdx +8 -2
- package/.docs/raw/docs/{(docs)/guides → guides}/multi-agent.mdx +64 -4
- package/.docs/raw/docs/{(docs)/guides → guides}/quoting.mdx +10 -17
- package/.docs/raw/docs/guides/slash-commands.mdx +361 -0
- package/.docs/raw/docs/guides/speech.mdx +156 -0
- package/.docs/raw/docs/{(docs)/guides → guides}/suggestions.mdx +21 -83
- package/.docs/raw/docs/{(docs)/guides → guides}/tool-ui.mdx +108 -36
- package/.docs/raw/docs/{(docs)/guides → guides}/tools.mdx +131 -35
- package/.docs/raw/docs/{(docs)/guides → guides}/voice.mdx +39 -0
- package/.docs/raw/docs/ink/index.mdx +1 -3
- package/.docs/raw/docs/ink/migration.mdx +1 -3
- package/.docs/raw/docs/ink/primitives.mdx +37 -1
- package/.docs/raw/docs/integrations/attachments/custom-adapter.mdx +520 -0
- package/.docs/raw/docs/integrations/auth/better-auth.mdx +191 -0
- package/.docs/raw/docs/integrations/auth/clerk.mdx +172 -0
- package/.docs/raw/docs/integrations/auth/next-auth.mdx +196 -0
- package/.docs/raw/docs/integrations/frameworks/ai-sdk.mdx +79 -0
- package/.docs/raw/docs/integrations/frameworks/mastra/full-stack.mdx +188 -0
- package/.docs/raw/docs/integrations/frameworks/mastra/overview.mdx +57 -0
- package/.docs/raw/docs/integrations/frameworks/mastra/separate-server.mdx +201 -0
- package/.docs/raw/docs/integrations/gateways/index.mdx +157 -0
- package/.docs/raw/docs/integrations/index.mdx +173 -0
- package/.docs/raw/docs/integrations/observability/helicone.mdx +130 -0
- package/.docs/raw/docs/integrations/observability/langfuse.mdx +156 -0
- package/.docs/raw/docs/integrations/observability/langsmith.mdx +146 -0
- package/.docs/raw/docs/integrations/persistence/custom-adapter.mdx +712 -0
- package/.docs/raw/docs/integrations/tools/mcp.mdx +267 -0
- package/.docs/raw/docs/primitives/action-bar.mdx +1 -0
- package/.docs/raw/docs/primitives/assistant-modal.mdx +1 -0
- package/.docs/raw/docs/primitives/attachment.mdx +1 -0
- package/.docs/raw/docs/primitives/branch-picker.mdx +1 -0
- package/.docs/raw/docs/primitives/chain-of-thought.mdx +90 -85
- package/.docs/raw/docs/primitives/composer.mdx +96 -63
- package/.docs/raw/docs/primitives/error.mdx +1 -0
- package/.docs/raw/docs/primitives/index.mdx +2 -1
- package/.docs/raw/docs/primitives/message.mdx +68 -5
- package/.docs/raw/docs/primitives/selection-toolbar.mdx +1 -0
- package/.docs/raw/docs/primitives/suggestion.mdx +1 -0
- package/.docs/raw/docs/primitives/thread-list.mdx +39 -0
- package/.docs/raw/docs/primitives/thread.mdx +16 -13
- package/.docs/raw/docs/react-native/index.mdx +1 -3
- package/.docs/raw/docs/react-native/migration.mdx +1 -3
- package/.docs/raw/docs/runtimes/a2a/client-and-hooks.mdx +396 -0
- package/.docs/raw/docs/runtimes/a2a/overview.mdx +60 -0
- package/.docs/raw/docs/runtimes/a2a/quickstart.mdx +216 -0
- package/.docs/raw/docs/runtimes/ag-ui/overview.mdx +70 -0
- package/.docs/raw/docs/runtimes/ag-ui/quickstart.mdx +243 -0
- package/.docs/raw/docs/runtimes/ag-ui/runtime-options.mdx +123 -0
- package/.docs/raw/docs/runtimes/ai-sdk/overview.mdx +52 -0
- package/.docs/raw/docs/runtimes/ai-sdk/v4-legacy.mdx +71 -131
- package/.docs/raw/docs/runtimes/ai-sdk/v5-legacy.mdx +69 -63
- package/.docs/raw/docs/runtimes/ai-sdk/v6.mdx +365 -101
- package/.docs/raw/docs/runtimes/concepts/adapters.mdx +265 -0
- package/.docs/raw/docs/runtimes/concepts/architecture.mdx +125 -0
- package/.docs/raw/docs/runtimes/concepts/stability.mdx +67 -0
- package/.docs/raw/docs/runtimes/concepts/threads.mdx +428 -0
- package/.docs/raw/docs/runtimes/custom/assistant-transport.mdx +703 -0
- package/.docs/raw/docs/runtimes/custom/data-stream.mdx +323 -0
- package/.docs/raw/docs/runtimes/custom/external-store.mdx +253 -1236
- package/.docs/raw/docs/runtimes/custom/local-runtime.mdx +746 -0
- package/.docs/raw/docs/runtimes/custom/overview.mdx +71 -0
- package/.docs/raw/docs/runtimes/google-adk/api.mdx +256 -0
- package/.docs/raw/docs/runtimes/google-adk/hooks.mdx +717 -0
- package/.docs/raw/docs/runtimes/google-adk/overview.mdx +69 -0
- package/.docs/raw/docs/runtimes/google-adk/quickstart.mdx +229 -0
- package/.docs/raw/docs/runtimes/langchain.mdx +533 -0
- package/.docs/raw/docs/runtimes/langgraph/generative-ui.mdx +305 -0
- package/.docs/raw/docs/runtimes/langgraph/interrupts.mdx +104 -0
- package/.docs/raw/docs/runtimes/langgraph/overview.mdx +84 -0
- package/.docs/raw/docs/runtimes/langgraph/quickstart.mdx +496 -0
- package/.docs/raw/docs/runtimes/langgraph/streaming.mdx +127 -0
- package/.docs/raw/docs/runtimes/langgraph/threads.mdx +113 -0
- package/.docs/raw/docs/runtimes/langgraph/tutorial/introduction.mdx +3 -3
- package/.docs/raw/docs/runtimes/langgraph/tutorial/part-1.mdx +0 -23
- package/.docs/raw/docs/runtimes/langgraph/tutorial/part-2.mdx +1 -1
- package/.docs/raw/docs/runtimes/opencode/hooks.mdx +191 -0
- package/.docs/raw/docs/runtimes/opencode/overview.mdx +48 -0
- package/.docs/raw/docs/runtimes/opencode/quickstart.mdx +119 -0
- package/.docs/raw/docs/runtimes/pick-a-runtime.mdx +74 -198
- package/.docs/raw/docs/ui/accordion.mdx +1 -0
- package/.docs/raw/docs/ui/assistant-modal.mdx +1 -0
- package/.docs/raw/docs/ui/assistant-sidebar.mdx +1 -0
- package/.docs/raw/docs/ui/attachment.mdx +1 -0
- package/.docs/raw/docs/ui/badge.mdx +1 -0
- package/.docs/raw/docs/ui/composer-trigger-popover.mdx +200 -0
- package/.docs/raw/docs/ui/context-display.mdx +1 -0
- package/.docs/raw/docs/ui/diff-viewer.mdx +1 -0
- package/.docs/raw/docs/ui/directive-text.mdx +114 -0
- package/.docs/raw/docs/ui/file.mdx +1 -0
- package/.docs/raw/docs/ui/image.mdx +1 -0
- package/.docs/raw/docs/ui/markdown.mdx +2 -14
- package/.docs/raw/docs/ui/mermaid.mdx +1 -0
- package/.docs/raw/docs/ui/message-timing.mdx +3 -2
- package/.docs/raw/docs/ui/model-selector.mdx +1 -0
- package/.docs/raw/docs/ui/part-grouping.mdx +325 -313
- package/.docs/raw/docs/ui/quote.mdx +1 -0
- package/.docs/raw/docs/ui/reasoning.mdx +69 -32
- package/.docs/raw/docs/ui/scrollbar.mdx +1 -0
- package/.docs/raw/docs/ui/select.mdx +1 -0
- package/.docs/raw/docs/ui/sources.mdx +1 -0
- package/.docs/raw/docs/ui/streamdown.mdx +1 -0
- package/.docs/raw/docs/ui/syntax-highlighting.mdx +1 -0
- package/.docs/raw/docs/ui/tabs.mdx +1 -0
- package/.docs/raw/docs/ui/thread-list.mdx +17 -0
- package/.docs/raw/docs/ui/thread.mdx +56 -1
- package/.docs/raw/docs/ui/tool-fallback.mdx +1 -0
- package/.docs/raw/docs/ui/tool-group.mdx +39 -11
- package/.docs/raw/docs/ui/voice.mdx +1 -0
- package/.docs/raw/docs/utilities/heat-graph.mdx +1 -0
- package/.docs/raw/docs/utilities/react-o11y.mdx +278 -0
- package/.docs/raw/docs/utilities/tw-shimmer.mdx +1 -0
- package/dist/utils/logger.js +1 -1
- package/dist/utils/logger.js.map +1 -1
- package/package.json +4 -4
- package/src/tools/tests/path-traversal.test.ts +1 -1
- package/src/utils/logger.ts +1 -1
- package/.docs/raw/docs/(docs)/guides/branching.mdx +0 -65
- package/.docs/raw/docs/(docs)/guides/chain-of-thought.mdx +0 -164
- package/.docs/raw/docs/(docs)/guides/editing.mdx +0 -66
- package/.docs/raw/docs/(docs)/guides/mentions.mdx +0 -406
- package/.docs/raw/docs/(docs)/guides/slash-commands.mdx +0 -275
- package/.docs/raw/docs/(docs)/guides/speech.mdx +0 -38
- package/.docs/raw/docs/runtimes/a2a/index.mdx +0 -298
- package/.docs/raw/docs/runtimes/assistant-transport.mdx +0 -1033
- package/.docs/raw/docs/runtimes/custom/custom-thread-list.mdx +0 -268
- package/.docs/raw/docs/runtimes/custom/local.mdx +0 -1464
- package/.docs/raw/docs/runtimes/data-stream.mdx +0 -422
- package/.docs/raw/docs/runtimes/google-adk/index.mdx +0 -686
- package/.docs/raw/docs/runtimes/helicone.mdx +0 -61
- package/.docs/raw/docs/runtimes/langgraph/index.mdx +0 -607
- package/.docs/raw/docs/runtimes/langgraph/tutorial/index.mdx +0 -12
- package/.docs/raw/docs/runtimes/langserve.mdx +0 -116
- package/.docs/raw/docs/runtimes/mastra/full-stack-integration.mdx +0 -218
- package/.docs/raw/docs/runtimes/mastra/overview.mdx +0 -18
- package/.docs/raw/docs/runtimes/mastra/separate-server-integration.mdx +0 -217
- package/.docs/raw/docs/ui/mention.mdx +0 -168
|
@@ -1,116 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: LangChain LangServe
|
|
3
|
-
description: Connect to LangServe endpoints via Vercel AI SDK integration.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
<Callout type="warning">
|
|
7
|
-
This integration has not been tested with AI SDK v6.
|
|
8
|
-
</Callout>
|
|
9
|
-
|
|
10
|
-
## Overview
|
|
11
|
-
|
|
12
|
-
Integration with a LangServe server via Vercel AI SDK.
|
|
13
|
-
|
|
14
|
-
## Getting Started
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
<Steps>
|
|
18
|
-
<Step>
|
|
19
|
-
### Create a Next.JS project
|
|
20
|
-
|
|
21
|
-
```sh
|
|
22
|
-
npx create-next-app@latest my-app
|
|
23
|
-
cd my-app
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
</Step>
|
|
27
|
-
<Step>
|
|
28
|
-
|
|
29
|
-
### Install `@langchain/core`, AI SDK and `@assistant-ui/react`
|
|
30
|
-
|
|
31
|
-
<InstallCommand npm={["@assistant-ui/react", "@assistant-ui/react-ai-sdk", "ai", "@ai-sdk/react", "@langchain/core"]} />
|
|
32
|
-
|
|
33
|
-
</Step>
|
|
34
|
-
<Step>
|
|
35
|
-
|
|
36
|
-
### Setup a backend route under `/api/chat`
|
|
37
|
-
|
|
38
|
-
```tsx title="@/app/api/chat/route.ts"
|
|
39
|
-
import { RemoteRunnable } from "@langchain/core/runnables/remote";
|
|
40
|
-
import { toDataStreamResponse } from "@ai-sdk/langchain";
|
|
41
|
-
|
|
42
|
-
export const maxDuration = 30;
|
|
43
|
-
|
|
44
|
-
export async function POST(req: Request) {
|
|
45
|
-
const { messages } = await req.json();
|
|
46
|
-
|
|
47
|
-
// TODO replace with your own langserve URL
|
|
48
|
-
const remoteChain = new RemoteRunnable({
|
|
49
|
-
url: "<YOUR_LANGSERVE_URL>",
|
|
50
|
-
});
|
|
51
|
-
|
|
52
|
-
const stream = await remoteChain.stream({
|
|
53
|
-
messages,
|
|
54
|
-
});
|
|
55
|
-
|
|
56
|
-
return toDataStreamResponse(stream);
|
|
57
|
-
}
|
|
58
|
-
```
|
|
59
|
-
|
|
60
|
-
</Step>
|
|
61
|
-
<Step>
|
|
62
|
-
|
|
63
|
-
### Define a `MyRuntimeProvider` component
|
|
64
|
-
|
|
65
|
-
```tsx twoslash include MyRuntimeProvider title="@/app/MyRuntimeProvider.tsx"
|
|
66
|
-
// @filename: /app/MyRuntimeProvider.tsx
|
|
67
|
-
// ---cut---
|
|
68
|
-
"use client";
|
|
69
|
-
|
|
70
|
-
import { AssistantRuntimeProvider } from "@assistant-ui/react";
|
|
71
|
-
import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
|
|
72
|
-
|
|
73
|
-
export function MyRuntimeProvider({
|
|
74
|
-
children,
|
|
75
|
-
}: Readonly<{
|
|
76
|
-
children: React.ReactNode;
|
|
77
|
-
}>) {
|
|
78
|
-
const runtime = useChatRuntime();
|
|
79
|
-
|
|
80
|
-
return (
|
|
81
|
-
<AssistantRuntimeProvider runtime={runtime}>
|
|
82
|
-
{children}
|
|
83
|
-
</AssistantRuntimeProvider>
|
|
84
|
-
);
|
|
85
|
-
}
|
|
86
|
-
```
|
|
87
|
-
|
|
88
|
-
</Step>
|
|
89
|
-
<Step>
|
|
90
|
-
|
|
91
|
-
### Wrap your app in `MyRuntimeProvider`
|
|
92
|
-
|
|
93
|
-
```tsx twoslash title="@/app/layout.tsx"
|
|
94
|
-
// @include: MyRuntimeProvider
|
|
95
|
-
// @filename: /app/layout.tsx
|
|
96
|
-
// ---cut---
|
|
97
|
-
import type { ReactNode } from "react";
|
|
98
|
-
import { MyRuntimeProvider } from "@/app/MyRuntimeProvider";
|
|
99
|
-
|
|
100
|
-
export default function RootLayout({
|
|
101
|
-
children,
|
|
102
|
-
}: Readonly<{
|
|
103
|
-
children: ReactNode;
|
|
104
|
-
}>) {
|
|
105
|
-
return (
|
|
106
|
-
<html lang="en">
|
|
107
|
-
<body>
|
|
108
|
-
<MyRuntimeProvider>{children}</MyRuntimeProvider>
|
|
109
|
-
</body>
|
|
110
|
-
</html>
|
|
111
|
-
);
|
|
112
|
-
}
|
|
113
|
-
```
|
|
114
|
-
|
|
115
|
-
</Step>
|
|
116
|
-
</Steps>
|
|
@@ -1,218 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Full-Stack Integration
|
|
3
|
-
description: Integrate Mastra directly into Next.js API routes.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
Integrate Mastra directly into your Next.js application's API routes. This approach keeps your backend and frontend code within the same project.
|
|
8
|
-
|
|
9
|
-
<Steps>
|
|
10
|
-
<Step>
|
|
11
|
-
|
|
12
|
-
### Initialize assistant-ui
|
|
13
|
-
|
|
14
|
-
Start by setting up assistant-ui in your project. Run one of the following commands:
|
|
15
|
-
|
|
16
|
-
```sh title="New Project"
|
|
17
|
-
npx assistant-ui@latest create
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
```sh title="Existing Project"
|
|
21
|
-
npx assistant-ui@latest init
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
This command installs necessary dependencies and creates basic configuration files, including a default chat API route.
|
|
25
|
-
|
|
26
|
-
<Callout title="Need Help?">
|
|
27
|
-
For detailed setup instructions, including adding API keys, basic
|
|
28
|
-
configuration, and manual setup steps, please refer to the main [Getting
|
|
29
|
-
Started guide](/docs).
|
|
30
|
-
</Callout>
|
|
31
|
-
|
|
32
|
-
</Step>
|
|
33
|
-
<Step>
|
|
34
|
-
|
|
35
|
-
### Review Initial API Route
|
|
36
|
-
|
|
37
|
-
The initialization command creates a basic API route at `app/api/chat/route.ts` (or `src/app/api/chat/route.ts`). It typically looks like this:
|
|
38
|
-
|
|
39
|
-
```typescript title="app/api/chat/route.ts"
|
|
40
|
-
import { openai } from "@ai-sdk/openai";
|
|
41
|
-
import { streamText } from "ai";
|
|
42
|
-
|
|
43
|
-
// Allow streaming responses up to 30 seconds
|
|
44
|
-
export const maxDuration = 30;
|
|
45
|
-
|
|
46
|
-
export async function POST(req: Request) {
|
|
47
|
-
const { messages } = await req.json();
|
|
48
|
-
|
|
49
|
-
const result = streamText({
|
|
50
|
-
model: openai("gpt-4o-mini"),
|
|
51
|
-
messages,
|
|
52
|
-
});
|
|
53
|
-
|
|
54
|
-
return result.toUIMessageStreamResponse();
|
|
55
|
-
}
|
|
56
|
-
```
|
|
57
|
-
|
|
58
|
-
This default route uses the Vercel AI SDK directly with OpenAI. In the following steps, we will modify this route to integrate Mastra.
|
|
59
|
-
|
|
60
|
-
</Step>
|
|
61
|
-
<Step>
|
|
62
|
-
|
|
63
|
-
### Install Mastra Packages
|
|
64
|
-
|
|
65
|
-
Add the `@mastra/core` package and its peer dependency `zod` (which you can use later inside tools for example). Also add `@mastra/ai-sdk` to convert Mastra's stream to an AI SDK-compatible format:
|
|
66
|
-
|
|
67
|
-
<InstallCommand npm={["@mastra/core@latest", "@mastra/ai-sdk@latest", "zod@latest"]} />
|
|
68
|
-
|
|
69
|
-
</Step>
|
|
70
|
-
<Step>
|
|
71
|
-
|
|
72
|
-
### Configure Next.js
|
|
73
|
-
|
|
74
|
-
To ensure Next.js correctly bundles your application when using Mastra directly in API routes, you need to configure `serverExternalPackages`.
|
|
75
|
-
|
|
76
|
-
Update your `next.config.mjs` (or `next.config.js`) file to include `@mastra/*`:
|
|
77
|
-
|
|
78
|
-
```js title="next.config.mjs"
|
|
79
|
-
/** @type {import('next').NextConfig} */
|
|
80
|
-
const nextConfig = {
|
|
81
|
-
serverExternalPackages: ["@mastra/*"],
|
|
82
|
-
// ... other configurations
|
|
83
|
-
};
|
|
84
|
-
|
|
85
|
-
export default nextConfig;
|
|
86
|
-
```
|
|
87
|
-
|
|
88
|
-
This tells Next.js to treat Mastra packages as external dependencies on the server-side.
|
|
89
|
-
|
|
90
|
-
</Step>
|
|
91
|
-
<Step>
|
|
92
|
-
|
|
93
|
-
### Create Mastra Files
|
|
94
|
-
|
|
95
|
-
Set up the basic folder structure for your Mastra configuration. Create a `mastra` folder (e.g., in your `src` or root directory) with the following structure:
|
|
96
|
-
|
|
97
|
-
```txt title="Project Structure"
|
|
98
|
-
/
|
|
99
|
-
├── mastra/
|
|
100
|
-
│ ├── agents/
|
|
101
|
-
│ │ └── chefAgent.ts
|
|
102
|
-
│ └── index.ts
|
|
103
|
-
└── ... (rest of your project)
|
|
104
|
-
```
|
|
105
|
-
|
|
106
|
-
You can create these files and folders manually or use the following commands in your terminal:
|
|
107
|
-
|
|
108
|
-
```bash
|
|
109
|
-
mkdir -p mastra/agents
|
|
110
|
-
touch mastra/index.ts mastra/agents/chefAgent.ts
|
|
111
|
-
```
|
|
112
|
-
|
|
113
|
-
These files will be used in the next steps to define your Mastra agent and configuration.
|
|
114
|
-
|
|
115
|
-
</Step>
|
|
116
|
-
<Step>
|
|
117
|
-
|
|
118
|
-
### Define the Agent
|
|
119
|
-
|
|
120
|
-
Now, let's define the behavior of our AI agent. Open the `mastra/agents/chefAgent.ts` file and add the following code:
|
|
121
|
-
|
|
122
|
-
```typescript title="mastra/agents/chefAgent.ts"
|
|
123
|
-
import { Agent } from "@mastra/core/agent";
|
|
124
|
-
|
|
125
|
-
export const chefAgent = new Agent({
|
|
126
|
-
name: "chef-agent",
|
|
127
|
-
instructions:
|
|
128
|
-
"You are Michel, a practical and experienced home chef. " +
|
|
129
|
-
"You help people cook with whatever ingredients they have available.",
|
|
130
|
-
model: "openai/gpt-4o-mini",
|
|
131
|
-
});
|
|
132
|
-
```
|
|
133
|
-
|
|
134
|
-
This code creates a new Mastra `Agent` named `chef-agent`.
|
|
135
|
-
|
|
136
|
-
- `instructions`: Defines the agent's persona and primary goal.
|
|
137
|
-
- `model`: Specifies the language model the agent will use (in this case, OpenAI's GPT-4o Mini via Mastra's model router).
|
|
138
|
-
|
|
139
|
-
Make sure you have set up your OpenAI API key as described in the [Getting Started guide](/docs).
|
|
140
|
-
|
|
141
|
-
</Step>
|
|
142
|
-
<Step>
|
|
143
|
-
|
|
144
|
-
### Register the Agent
|
|
145
|
-
|
|
146
|
-
Next, register the agent with your Mastra instance. Open the `mastra/index.ts` file and add the following code:
|
|
147
|
-
|
|
148
|
-
```typescript title="mastra/index.ts"
|
|
149
|
-
import { Mastra } from "@mastra/core";
|
|
150
|
-
import { chefAgent } from "./agents/chefAgent";
|
|
151
|
-
|
|
152
|
-
export const mastra = new Mastra({
|
|
153
|
-
agents: { chefAgent },
|
|
154
|
-
});
|
|
155
|
-
```
|
|
156
|
-
|
|
157
|
-
This code initializes Mastra and makes the `chefAgent` available for use in your application's API routes.
|
|
158
|
-
|
|
159
|
-
</Step>
|
|
160
|
-
<Step>
|
|
161
|
-
|
|
162
|
-
### Modify the API Route
|
|
163
|
-
|
|
164
|
-
Now, update your API route (`app/api/chat/route.ts`) to use the Mastra agent you just configured. Replace the existing content with the following:
|
|
165
|
-
|
|
166
|
-
```typescript title="app/api/chat/route.ts"
|
|
167
|
-
import { createUIMessageStreamResponse } from "ai";
|
|
168
|
-
import { toAISdkFormat } from "@mastra/ai-sdk";
|
|
169
|
-
import { mastra } from "@/mastra"; // Adjust the import path if necessary
|
|
170
|
-
|
|
171
|
-
// Allow streaming responses up to 30 seconds
|
|
172
|
-
export const maxDuration = 30;
|
|
173
|
-
|
|
174
|
-
export async function POST(req: Request) {
|
|
175
|
-
// Extract the messages from the request body
|
|
176
|
-
const { messages } = await req.json();
|
|
177
|
-
|
|
178
|
-
// Get the chefAgent instance from Mastra
|
|
179
|
-
const agent = mastra.getAgent("chefAgent");
|
|
180
|
-
|
|
181
|
-
// Stream the response using the agent
|
|
182
|
-
const stream = await agent.stream(messages);
|
|
183
|
-
|
|
184
|
-
// Create a Response that streams the UI message stream to the client
|
|
185
|
-
return createUIMessageStreamResponse({
|
|
186
|
-
stream: toAISdkFormat(stream, { from: "agent" }),
|
|
187
|
-
});
|
|
188
|
-
}
|
|
189
|
-
```
|
|
190
|
-
|
|
191
|
-
Key changes:
|
|
192
|
-
|
|
193
|
-
- We import the `mastra` instance created in `mastra/index.ts`. Make sure the import path (`@/mastra`) is correct for your project setup (you might need `~/mastra`, `../../../mastra`, etc., depending on your path aliases and project structure).
|
|
194
|
-
- We retrieve the `chefAgent` using `mastra.getAgent("chefAgent")`.
|
|
195
|
-
- Instead of calling the AI SDK's `streamText` directly, we call `agent.stream(messages)` to process the chat messages using the agent's configuration and model.
|
|
196
|
-
- The result is still returned in a format compatible with assistant-ui using `createUIMessageStreamResponse()` and `toAISdkFormat()`.
|
|
197
|
-
|
|
198
|
-
Your API route is now powered by Mastra!
|
|
199
|
-
|
|
200
|
-
</Step>
|
|
201
|
-
<Step>
|
|
202
|
-
|
|
203
|
-
### Run the Application
|
|
204
|
-
|
|
205
|
-
You're all set! Start your Next.js development server:
|
|
206
|
-
|
|
207
|
-
```bash npm2yarn
|
|
208
|
-
npm run dev
|
|
209
|
-
```
|
|
210
|
-
|
|
211
|
-
Open your browser to `http://localhost:3000` (or the port specified in your terminal). You should now be able to interact with your `chefAgent` through the assistant-ui chat interface. Ask it for cooking advice based on ingredients you have!
|
|
212
|
-
|
|
213
|
-
</Step>
|
|
214
|
-
</Steps>
|
|
215
|
-
|
|
216
|
-
Congratulations! You have successfully integrated Mastra into your Next.js application using the full-stack approach. Your assistant-ui frontend now communicates with a Mastra agent running in your Next.js backend API route.
|
|
217
|
-
|
|
218
|
-
To explore more advanced Mastra features like memory, tools, workflows, and more, please refer to the [official Mastra documentation](https://mastra.ai/docs).
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Overview
|
|
3
|
-
description: TypeScript agent framework for AI applications with tools and workflows.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
Mastra is an open-source TypeScript agent framework designed to provide the essential primitives for building AI applications. It enables developers to create AI agents with memory and tool-calling capabilities, implement deterministic LLM workflows, and leverage RAG for knowledge integration. With features like model routing, workflow graphs, and automated evals, Mastra provides a complete toolkit for developing, testing, and deploying AI applications.
|
|
7
|
-
|
|
8
|
-
## Integrating with Next.js and assistant-ui
|
|
9
|
-
|
|
10
|
-
There are two primary ways to integrate Mastra into your Next.js project when using assistant-ui:
|
|
11
|
-
|
|
12
|
-
1. **Full-Stack Integration**: Integrate Mastra directly into your Next.js application's API routes. This approach keeps your backend and frontend code within the same project.
|
|
13
|
-
[Learn how to set up Full-Stack Integration](./full-stack-integration)
|
|
14
|
-
|
|
15
|
-
2. **Separate Server Integration**: Run Mastra as a standalone server and connect your Next.js frontend to its API endpoints. This approach separates concerns and allows for independent scaling.
|
|
16
|
-
[Learn how to set up Separate Server Integration](./separate-server-integration)
|
|
17
|
-
|
|
18
|
-
Choose the guide that best fits your project architecture. Both methods allow seamless integration with the assistant-ui components.
|
|
@@ -1,217 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: Separate Server Integration
|
|
3
|
-
description: Run Mastra as a standalone server connected to your frontend.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
Run Mastra as a standalone server and connect your Next.js frontend (using assistant-ui) to its API endpoints. This approach separates your AI backend from your frontend application, allowing for independent development and scaling.
|
|
8
|
-
|
|
9
|
-
<Steps>
|
|
10
|
-
|
|
11
|
-
<Step>
|
|
12
|
-
|
|
13
|
-
### Create Mastra Server Project
|
|
14
|
-
|
|
15
|
-
First, create a dedicated project for your Mastra server. Choose a directory separate from your Next.js/assistant-ui frontend project.
|
|
16
|
-
|
|
17
|
-
Navigate to your chosen parent directory in the terminal and run the Mastra create command:
|
|
18
|
-
|
|
19
|
-
```bash
|
|
20
|
-
npx create-mastra@latest
|
|
21
|
-
```
|
|
22
|
-
|
|
23
|
-
This command will launch an interactive wizard to help you scaffold a new Mastra project, including prompting you for a project name and setting up basic configurations. Follow the prompts to create your server project. For more detailed setup instructions, refer to the [official Mastra installation guide](https://mastra.ai/docs/getting-started/installation).
|
|
24
|
-
|
|
25
|
-
Once the setup is complete, navigate into your new Mastra project directory (the name you provided during the setup):
|
|
26
|
-
|
|
27
|
-
```bash
|
|
28
|
-
cd your-mastra-server-directory # Replace with the actual directory name
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
In the next steps you'll need to use the `@mastra/ai-sdk` package. Add it to your Mastra project:
|
|
32
|
-
|
|
33
|
-
<InstallCommand npm={["@mastra/ai-sdk@latest"]} />
|
|
34
|
-
|
|
35
|
-
You now have a basic Mastra server project ready.
|
|
36
|
-
|
|
37
|
-
<Callout title="API Keys">
|
|
38
|
-
Ensure you have configured your environment variables (e.g., `OPENAI_API_KEY`)
|
|
39
|
-
within this Mastra server project, typically in a `.env.development` file, as
|
|
40
|
-
required by the models you use. The `create-mastra` wizard might prompt you
|
|
41
|
-
for some keys, but ensure all necessary keys for your chosen models are
|
|
42
|
-
present.
|
|
43
|
-
</Callout>
|
|
44
|
-
|
|
45
|
-
</Step>
|
|
46
|
-
|
|
47
|
-
<Step>
|
|
48
|
-
|
|
49
|
-
### Define the Agent
|
|
50
|
-
|
|
51
|
-
Next, let's define an agent within your Mastra server project. We'll create a `chefAgent` similar to the one used in the full-stack guide.
|
|
52
|
-
|
|
53
|
-
Open or create the agent file (e.g., `src/mastra/agents/chefAgent.ts` within your Mastra project) and add the following code:
|
|
54
|
-
|
|
55
|
-
```typescript title="src/mastra/agents/chefAgent.ts"
|
|
56
|
-
import { Agent } from "@mastra/core/agent";
|
|
57
|
-
|
|
58
|
-
export const chefAgent = new Agent({
|
|
59
|
-
name: "chef-agent",
|
|
60
|
-
instructions:
|
|
61
|
-
"You are Michel, a practical and experienced home chef. " +
|
|
62
|
-
"You help people cook with whatever ingredients they have available.",
|
|
63
|
-
model: "openai/gpt-4o-mini",
|
|
64
|
-
});
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
This defines the agent's behavior, but it's not yet active in the Mastra server.
|
|
68
|
-
|
|
69
|
-
</Step>
|
|
70
|
-
|
|
71
|
-
<Step>
|
|
72
|
-
|
|
73
|
-
### Register the Agent
|
|
74
|
-
|
|
75
|
-
Now, you need to register the `chefAgent` with your Mastra instance so the server knows about it. Open your main Mastra configuration file (this is often `src/mastra/index.ts` in projects created with `create-mastra`).
|
|
76
|
-
|
|
77
|
-
Import the `chefAgent` and add it to the `agents` object when initializing Mastra:
|
|
78
|
-
|
|
79
|
-
```typescript title="src/mastra/index.ts"
|
|
80
|
-
import { Mastra } from "@mastra/core";
|
|
81
|
-
import { chefAgent } from "./agents/chefAgent"; // Adjust path if necessary
|
|
82
|
-
|
|
83
|
-
export const mastra = new Mastra({
|
|
84
|
-
agents: { chefAgent },
|
|
85
|
-
});
|
|
86
|
-
```
|
|
87
|
-
|
|
88
|
-
Make sure you adapt this code to fit the existing structure of your `src/mastra/index.ts` file generated by `create-mastra`. The key is to import your agent and include it in the `agents` configuration object.
|
|
89
|
-
|
|
90
|
-
</Step>
|
|
91
|
-
|
|
92
|
-
<Step>
|
|
93
|
-
|
|
94
|
-
### Register the Chat Route
|
|
95
|
-
|
|
96
|
-
Still inside `src/mastra/index.ts`, register a chat route for the `chefAgent` now. You can do this by using `chatRoute()` from `@mastra/ai-sdk`. You need to place this inside `server.apiRoutes` of your Mastra configuration:
|
|
97
|
-
|
|
98
|
-
```typescript title="src/mastra/index.ts" {3,7-13}
|
|
99
|
-
import { Mastra } from "@mastra/core";
|
|
100
|
-
import { chefAgent } from "./agents/chefAgent";
|
|
101
|
-
import { chatRoute } from "@mastra/ai-sdk";
|
|
102
|
-
|
|
103
|
-
export const mastra = new Mastra({
|
|
104
|
-
agents: { chefAgent },
|
|
105
|
-
server: {
|
|
106
|
-
apiRoutes: [
|
|
107
|
-
chatRoute({
|
|
108
|
-
path: "/chat/:agentId",
|
|
109
|
-
}),
|
|
110
|
-
],
|
|
111
|
-
},
|
|
112
|
-
});
|
|
113
|
-
```
|
|
114
|
-
|
|
115
|
-
Make sure you adapt this code to fit the existing structure of your `src/mastra/index.ts` file generated by `create-mastra`. This will make all agents available in AI SDK-compatible formats, including the `chefAgent` at the endpoint `/chat/chefAgent`.
|
|
116
|
-
|
|
117
|
-
</Step>
|
|
118
|
-
|
|
119
|
-
<Step>
|
|
120
|
-
|
|
121
|
-
### Run the Mastra Server
|
|
122
|
-
|
|
123
|
-
With the agent defined and registered, start the Mastra development server:
|
|
124
|
-
|
|
125
|
-
```bash npm2yarn
|
|
126
|
-
npm run dev
|
|
127
|
-
```
|
|
128
|
-
|
|
129
|
-
By default, the Mastra server will run on `http://localhost:4111`. Keep this server running for the next steps where we'll set up the assistant-ui frontend to connect to it.
|
|
130
|
-
|
|
131
|
-
</Step>
|
|
132
|
-
|
|
133
|
-
<Step>
|
|
134
|
-
|
|
135
|
-
### Initialize assistant-ui Frontend
|
|
136
|
-
|
|
137
|
-
Now, set up your frontend application using assistant-ui. Navigate to a **different directory** from your Mastra server project. You can either create a new Next.js project or use an existing one.
|
|
138
|
-
|
|
139
|
-
Inside your frontend project directory, run one of the following commands:
|
|
140
|
-
|
|
141
|
-
```sh title="New Project"
|
|
142
|
-
npx assistant-ui@latest create
|
|
143
|
-
```
|
|
144
|
-
|
|
145
|
-
```sh title="Existing Project"
|
|
146
|
-
npx assistant-ui@latest init
|
|
147
|
-
```
|
|
148
|
-
|
|
149
|
-
This command installs the necessary assistant-ui dependencies and sets up basic configuration files, including a default chat page and an API route (`app/api/chat/route.ts`).
|
|
150
|
-
|
|
151
|
-
<Callout title="Need Help?">
|
|
152
|
-
For detailed setup instructions for assistant-ui, including manual setup
|
|
153
|
-
steps, please refer to the main [Getting Started
|
|
154
|
-
guide](/docs).
|
|
155
|
-
</Callout>
|
|
156
|
-
|
|
157
|
-
In the next step, we will configure this frontend to communicate with the separate Mastra server instead of using the default API route.
|
|
158
|
-
|
|
159
|
-
</Step>
|
|
160
|
-
|
|
161
|
-
<Step>
|
|
162
|
-
|
|
163
|
-
### Configure Frontend API Endpoint
|
|
164
|
-
|
|
165
|
-
The default assistant-ui setup configures the chat runtime to use a local API route (`/api/chat`) within the Next.js project. Since our Mastra agent is running on a separate server, we need to update the frontend to point to that server's endpoint.
|
|
166
|
-
|
|
167
|
-
Open the file in your assistant-ui frontend project that contains the `useChatRuntime` hook (usually `app/assistant.tsx` or `src/app/assistant.tsx`). Find the `useChatRuntime` hook and change the `api` property to the full URL of your Mastra agent's stream endpoint:
|
|
168
|
-
|
|
169
|
-
```tsx {8} title="app/assistant.tsx"
|
|
170
|
-
"use client";
|
|
171
|
-
|
|
172
|
-
// Rest of the imports...
|
|
173
|
-
|
|
174
|
-
export const Assistant = () => {
|
|
175
|
-
const runtime = useChatRuntime({
|
|
176
|
-
transport: new AssistantChatTransport({
|
|
177
|
-
api: "http://localhost:4111/chat/chefAgent",
|
|
178
|
-
}),
|
|
179
|
-
});
|
|
180
|
-
|
|
181
|
-
// Rest of the component...
|
|
182
|
-
};
|
|
183
|
-
```
|
|
184
|
-
|
|
185
|
-
Replace `"http://localhost:4111/chat/chefAgent"` with the actual URL if your Mastra server runs on a different port or host, or if your agent has a different name.
|
|
186
|
-
|
|
187
|
-
Now, the assistant-ui frontend will send chat requests directly to your running Mastra server.
|
|
188
|
-
|
|
189
|
-
<Callout title="Delete Default API Route">
|
|
190
|
-
Since the frontend no longer uses the local `/api/chat` route created by the
|
|
191
|
-
`init` command, you can safely delete the `app/api/chat/route.ts` (or
|
|
192
|
-
`src/app/api/chat/route.ts`) file from your frontend project.
|
|
193
|
-
</Callout>
|
|
194
|
-
|
|
195
|
-
</Step>
|
|
196
|
-
|
|
197
|
-
<Step>
|
|
198
|
-
|
|
199
|
-
### Run the Frontend Application
|
|
200
|
-
|
|
201
|
-
You're ready to connect the pieces! Make sure your separate Mastra server is still running (from Step 4).
|
|
202
|
-
|
|
203
|
-
In your assistant-ui frontend project directory, start the Next.js development server:
|
|
204
|
-
|
|
205
|
-
```bash npm2yarn
|
|
206
|
-
npm run dev
|
|
207
|
-
```
|
|
208
|
-
|
|
209
|
-
Open your browser to `http://localhost:3000` (or the port specified in your terminal for the frontend app). You should now be able to interact with your `chefAgent` through the assistant-ui chat interface. The frontend will make requests to your Mastra server running on `http://localhost:4111`.
|
|
210
|
-
|
|
211
|
-
</Step>
|
|
212
|
-
|
|
213
|
-
</Steps>
|
|
214
|
-
|
|
215
|
-
Congratulations! You have successfully integrated Mastra with assistant-ui using a separate server approach. Your assistant-ui frontend now communicates with a standalone Mastra agent server.
|
|
216
|
-
|
|
217
|
-
This setup provides a clear separation between your frontend and AI backend. To explore more advanced Mastra features like memory, tools, workflows, and deployment options, please refer to the [official Mastra documentation](https://mastra.ai/docs).
|