YepAPI/skills

AI Chatbot

Rules

• Use Vercel AI SDK (ai package) for streaming — useChat() hook on client, streamText() on server
• Stream responses with text/event-stream — never buffer full responses before sending
• Message format: { role: "user" | "assistant" | "system", content: string }
• Context window management: trim oldest messages when approaching token limit, always keep system prompt
• RAG pattern: embed user query → vector search → inject top-k results as context before the user message
• Chat UI: auto-scroll to bottom, loading indicator with animated dots, render markdown in assistant messages
• Persist conversation history server-side — use a messages table with chatId, role, content, createdAt
• System prompt goes first in the messages array — never let user messages override it
• YepAPI chat endpoint: POST /v1/ai/chat with { messages, model?, stream? }
• Stop generation button — use AbortController to cancel in-flight streams

Patterns

// Client — useChat from Vercel AI SDK
const { messages, input, handleInputChange, handleSubmit, isLoading, stop } = useChat({
  api: "/api/chat",
});

// Server — streaming response
import { streamText } from "ai";

export async function POST(req: Request) {
  const { messages } = await req.json();
  const result = streamText({ model, messages });
  return result.toDataStreamResponse();
}

Avoid

• Sending entire conversation history without trimming — will exceed context window
• Blocking UI while waiting for full response — always stream
• Storing messages only in client state — persist server-side for history
• Hardcoding model names — use environment variables or config