The AI-powered chatbot with streaming responses, tool use, and conversation history.

VibeFast ships with an AI assistant that streams replies, invokes tools, and stores conversation history for both mobile and web. The CLI command installs every piece at once:

vf add chatbot

RAG (Knowledge Retrieval) is available only with the Convex backend via @convex-dev/agent and ragKnowledge.ts. The Supabase chatbot includes all other AI features: streaming, tool use, history, and attachments.

Frontend

The feature is identical for both backends. The Expo route lives at apps/native/src/app/(root)/(protected)/chatbot/index.tsx and delegates to apps/native/src/features/chatbot/app.

The feature folder contains:

Hooks (use-chat-handlers, use-conversation, use-chat-config) that bridge UI to your backend
UI components (input bar, message list, status chips) using the shared VibeFast design system
API client that abstracts backend differences

Backend

Convex Implementation

packages/backend/convex/chatbotAgent.ts — orchestrates @convex-dev/agent sessions with streaming responses
packages/backend/convex/chatbotHistory.ts — stores conversations and attachments
packages/backend/convex/agents.ts — prompt instructions, tone, and model configs
packages/backend/convex/tools/ — Tavily web search, user profile lookups, knowledge base routing
packages/backend/convex/ragKnowledge.ts — RAG document management

Environment Variables

CONVEX_DEPLOYMENT=xxx
CONVEX_URL=https://xxx.convex.cloud
OPENAI_API_KEY=sk-xxx
TAVILY_API_KEY=xxx  # for web search

Run pnpm native:setup:convex after editing.

Supabase Implementation

packages/backend/supabase/functions/chat-stream/ — Edge Function for streaming AI responses (SSE)
packages/backend/src/services/conversations.ts — conversation management
packages/backend/src/services/messages.ts — message storage and retrieval

Environment Variables

SUPABASE_URL=https://xxx.supabase.co
SUPABASE_PUBLISHABLE_KEY=xxx
OPENAI_API_KEY=sk-xxx
TAVILY_API_KEY=xxx  # for web search

Push secrets with pnpm secrets:push.

Customization

Change personality: Edit the prompt instructions in your backend's agent configuration
Add knowledge files (Convex only): Use ragKnowledge.ts helpers (addKnowledgeFile, askKnowledge)
Modify UI: Edit components in apps/native/src/features/chatbot/components
Remove feature: Use vf remove chatbot to drop it cleanly

AI Chatbot & Agents

Frontend

Backend

Convex Implementation

Environment Variables

Supabase Implementation

Environment Variables

Customization

Found an issue or bug in the docs?

On this page