aboutsummaryrefslogtreecommitdiff
path: root/apps/docs/ai-sdk/examples.mdx
blob: 61ad8d50777e8f5fe708ff3112425379fcbc6be8 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
---
title: "AI SDK Examples"
description: "Complete examples showing how to use Supermemory with Vercel AI SDK"
sidebarTitle: "Examples"
---

This page provides comprehensive examples of using Supermemory with the Vercel AI SDK, covering both Memory Tools and Infinite Chat approaches.

## Personal Assistant with Memory Tools

Build an AI assistant that remembers user preferences and past interactions:

<CodeGroup>

```typescript Next.js API Route
import { streamText } from 'ai'
import { createAnthropic } from '@ai-sdk/anthropic'
import { supermemoryTools } from '@supermemory/tools/ai-sdk'

const anthropic = createAnthropic({
  apiKey: process.env.ANTHROPIC_API_KEY!
})

export async function POST(request: Request) {
  const { messages } = await request.json()

  const result = await streamText({
    model: anthropic('claude-3-sonnet-20240229'),
    messages,
    tools: supermemoryTools(process.env.SUPERMEMORY_API_KEY!),
    system: `You are a helpful personal assistant. When users share information about themselves,
    remember it using the addMemory tool. When they ask questions, search your memories to provide
    personalized responses. Always be proactive about remembering important details.`
  })

  return result.toAIStreamResponse()
}
```

```typescript Client Component
'use client'

import { useChat } from 'ai/react'

export default function PersonalAssistant() {
  const { messages, input, handleInputChange, handleSubmit } = useChat()

  return (
    <div className="flex flex-col h-screen max-w-2xl mx-auto p-4">
      <div className="flex-1 overflow-y-auto space-y-4">
        {messages.map((message) => (
          <div
            key={message.id}
            className={`p-4 rounded-lg ${
              message.role === 'user' ? 'bg-blue-100 ml-auto' : 'bg-gray-100'
            }`}
          >
            <p>{message.content}</p>
          </div>
        ))}
      </div>

      <form onSubmit={handleSubmit} className="mt-4">
        <input
          value={input}
          onChange={handleInputChange}
          placeholder="Tell me about yourself or ask me anything..."
          className="w-full p-2 border rounded"
        />
      </form>
    </div>
  )
}
```

</CodeGroup>

**Example conversation:**
- User: "I'm allergic to peanuts and I love Italian food"
- AI: *Uses addMemory tool* "I've remembered that you're allergic to peanuts and love Italian food!"
- User: "Suggest a restaurant for dinner"
- AI: *Uses searchMemories tool* "Based on what I know about you, I'd recommend an Italian restaurant that's peanut-free..."

## Customer Support with Context

Build a customer support system that remembers customer history:

```typescript
import { streamText } from 'ai'
import { createOpenAI } from '@ai-sdk/openai'
import { supermemoryTools } from '@supermemory/tools/ai-sdk'

const openai = createOpenAI({
  apiKey: process.env.OPENAI_API_KEY!
})

export async function POST(request: Request) {
  const { messages, customerId } = await request.json()

  const result = await streamText({
    model: openai('gpt-5'),
    messages,
    tools: supermemoryTools(process.env.SUPERMEMORY_API_KEY!, {
      containerTags: [customerId]
    }),
    system: `You are a customer support agent. Before responding to any query:
    1. Search for the customer's previous interactions and issues
    2. Remember any new information shared in this conversation
    3. Provide personalized help based on their history
    4. Always be empathetic and solution-focused`
  })

  return result.toAIStreamResponse()
}
```

## Infinite Chat for Documentation

Create a documentation assistant with unlimited context:

<CodeGroup>

```typescript Documentation Chat
import { streamText } from 'ai'

const supermemoryInfiniteChat = createOpenAI({
  baseUrl: 'https://api.supermemory.ai/v3/https://api.openai.com/v1',
  apiKey: 'your-provider-api-key',
  headers: {
    'x-supermemory-api-key': 'supermemory-api-key',
    'x-sm-conversation-id': 'conversation-id'
  }
})

export async function POST(request: Request) {
  const { messages } = await request.json()

  const result = await streamText({
    model: supermemoryInfiniteChat('gpt-5'),
    messages,
    system: `You are a documentation assistant. You have access to all previous
    conversations and can reference earlier discussions. Help users understand
    the documentation by building on previous context.`
  })

  return result.toAIStreamResponse()
}
```

```typescript Upload Documentation
// Separate endpoint to upload documentation to memory
import { addMemory } from '@supermemory/tools'

export async function POST(request: Request) {
  const { content, title, url } = await request.json()

  const memory = await addMemory({
    apiKey: process.env.SUPERMEMORY_API_KEY!,
    content,
    title,
    url,
    headers: {
      'x-sm-conversation-id': 'documentation'
    }
  })

  return Response.json({ success: true, memory })
}
```

</CodeGroup>

## Multi-User Learning Assistant

Build an assistant that learns from multiple users but keeps data separate:

```typescript
import { streamText } from 'ai'
import { createAnthropic } from '@ai-sdk/anthropic'
import { supermemoryTools } from '@supermemory/tools/ai-sdk'

const anthropic = createAnthropic({
  apiKey: process.env.ANTHROPIC_API_KEY!
})

export async function POST(request: Request) {
  const { messages, userId, courseId } = await request.json()

  const result = await streamText({
    model: anthropic('claude-3-haiku-20240307'),
    messages,
    tools: supermemoryTools(process.env.SUPERMEMORY_API_KEY!, {
      containerTags: [userId]
    }),
    system: `You are a learning assistant. Help students with their coursework by:
    1. Remembering their learning progress and struggles
    2. Searching for relevant information from their past sessions
    3. Providing personalized explanations based on their learning style
    4. Tracking topics they've mastered vs topics they need more help with`
  })

  return result.toAIStreamResponse()
}
```

## Research Assistant with File Processing

Combine file upload with memory tools for research assistance:

<CodeGroup>

```typescript API Route
import { streamText } from 'ai'
import { createOpenAI } from '@ai-sdk/openai'
import { supermemoryTools } from '@supermemory/tools/ai-sdk'

const openai = createOpenAI({
  apiKey: process.env.OPENAI_API_KEY!
})

export async function POST(request: Request) {
  const { messages, projectId } = await request.json()

  const result = await streamText({
    model: openai('gpt-5'),
    messages,
    tools: supermemoryTools(process.env.SUPERMEMORY_API_KEY!, {
      containerTags: [projectId]
    }),
    system: `You are a research assistant. You can:
    1. Search through uploaded research papers and documents
    2. Remember key findings and insights from conversations
    3. Help synthesize information across multiple sources
    4. Track research progress and important discoveries`
  })

  return result.toAIStreamResponse()
}
```

```typescript File Upload Handler
import { addMemory } from '@supermemory/tools'

export async function POST(request: Request) {
  const formData = await request.formData()
  const file = formData.get('file') as File
  const projectId = formData.get('projectId') as string

  // Upload file and add to memory
  const memory = await addMemory({
    apiKey: process.env.SUPERMEMORY_API_KEY!,
    content: file, // Supermemory handles file processing
    title: file.name,
    headers: {
      'x-sm-conversation-id': projectId
    }
  })

  return Response.json({
    success: true,
    message: "Document uploaded and processed for research",
    memoryId: memory.id
  })
}
```

</CodeGroup>

## Code Assistant with Project Memory

Create a coding assistant that remembers your codebase and preferences:

```typescript
import { streamText } from 'ai'
import { createAnthropic } from '@ai-sdk/anthropic'
import {
  supermemoryTools,
  searchMemoriesTool,
  addMemoryTool
} from '@supermemory/tools/ai-sdk'

const anthropic = createAnthropic({
  apiKey: process.env.ANTHROPIC_API_KEY!
})

export async function POST(request: Request) {
  const { messages, repositoryId } = await request.json()

  const result = await streamText({
    model: anthropic('claude-3-sonnet-20240229'),
    messages,
    tools: {
      // Use individual tools for more control
      searchMemories: searchMemoriesTool(process.env.SUPERMEMORY_API_KEY!, {
        headers: {
          'x-sm-conversation-id': `repo-${repositoryId}`
        }
      }),
      addMemory: addMemoryTool(process.env.SUPERMEMORY_API_KEY!, {
        headers: {
          'x-sm-conversation-id': `repo-${repositoryId}`
        }
      }),
      // Add custom tools
      executeCode: {
        description: 'Execute code in a sandbox environment',
        parameters: z.object({
          code: z.string(),
          language: z.string()
        }),
        execute: async ({ code, language }) => {
          // Your code execution logic
          return { result: "Code executed successfully" }
        }
      }
    },
    system: `You are a coding assistant with memory. You can:
    1. Remember coding patterns and preferences from past conversations
    2. Search through previous code examples and solutions
    3. Track project architecture and design decisions
    4. Learn from debugging sessions and common issues`
  })

  return result.toAIStreamResponse()
}
```

## Advanced: Custom Tool Integration

Combine Supermemory tools with your own custom tools:

```typescript
import { streamText } from 'ai'
import { createOpenAI } from '@ai-sdk/openai'
import { supermemoryTools } from '@supermemory/tools/ai-sdk'
import { z } from 'zod'

const openai = createOpenAI({
  apiKey: process.env.OPENAI_API_KEY!
})

// Custom tool for calendar integration
const calendarTool = {
  description: 'Create calendar events',
  parameters: z.object({
    title: z.string(),
    date: z.string(),
    duration: z.number()
  }),
  execute: async ({ title, date, duration }) => {
    // Your calendar API integration
    return { eventId: "cal_123", message: "Event created" }
  }
}

export async function POST(request: Request) {
  const { messages } = await request.json()

  const result = await streamText({
    model: openai('gpt-5'),
    messages,
    tools: {
      // Spread Supermemory tools
      ...supermemoryTools(process.env.SUPERMEMORY_API_KEY!),
      // Add custom tools
      createEvent: calendarTool,
    },
    system: `You are a personal assistant that can remember information and
    manage calendars. When users mention events or appointments:
    1. Remember the details using addMemory
    2. Create calendar events using createEvent
    3. Search for conflicts using searchMemories`
  })

  return result.toAIStreamResponse()
}
```

## Environment Setup

For all examples, ensure you have these environment variables:

```bash .env.local
SUPERMEMORY_API_KEY=your_supermemory_key
OPENAI_API_KEY=your_openai_key
ANTHROPIC_API_KEY=your_anthropic_key
```

## Best Practices

### Memory Tools
- Use descriptive memory content for better search results
- Include context in your system prompts about when to use each tool
- Use project headers to separate different use cases
- Implement error handling for tool failures

### Infinite Chat
- Use conversation IDs to maintain separate chat contexts
- Include user IDs for personalized experiences
- Test with different providers to find the best fit for your use case
- Monitor token usage for cost optimization

### General Tips
- Start with simple examples and gradually add complexity
- Use the search functionality to avoid duplicate memories
- Implement proper authentication for production use
- Consider rate limiting for high-volume applications

## Next Steps

<CardGroup cols={2}>
  <Card title="Memory API" icon="database" href="/memory-api/overview">
    Advanced memory management with full API control
  </Card>

  <Card title="Memory Router" icon="route" href="/memory-router/overview">
    Drop-in proxy for existing LLM applications
  </Card>
</CardGroup>