Configuration UI Guide

The visual configuration UI provides a web interface for all ChatRAG settings - no code editing required.

Accessing the Config UI

Launch the configuration dashboard with:

npm run config
# Opens http://localhost:3333

Configuration Sections

1

API Keys Tab

Manage all service API keys in one place

Configure:

  • Supabase credentials (URL, Anon Key, Service Role Key)
  • OpenAI API key for embeddings and models
  • OpenRouter API key for 100+ AI models
  • LlamaCloud API key for document processing
  • FAL.ai, Replicate for media generation
  • ElevenLabs for voice features
  • Exa for web search
  • Stripe/Polar for payments
2

Features Tab

Enable or disable ChatRAG features

Toggle features:

  • Authentication system
  • RAG document system
  • Image generation (OpenAI, FAL, Replicate)
  • Video generation
  • 3D model generation
  • WhatsApp integration
  • MCP tools
  • Web search
  • Reasoning models
  • Embed widget
3

Branding Tab

Customize your ChatRAG instance appearance

Customize:

  • App name and title
  • Favicon URL
  • Header logo (text or image)
  • AI response avatar logo
  • Logo sizes and borders
  • Custom colors and themes
  • Welcome messages and text
  • UI preferences
4

RAG System Prompt

Configure how AI uses your documents

Features:

  • Pre-configured templates (helpful, professional, educational, technical)
  • Industry-specific templates (sales, support, research, code assistant)
  • WhatsApp-optimized template (concise, conversational)
  • AI translation support for multilingual prompts
  • Pre-context and post-context configuration
  • Real-time preview
5

Model Management

Add, remove, and configure AI models

Capabilities:

  • Add/remove OpenAI models
  • Add/remove OpenRouter models
  • Fetch latest models from OpenRouter API
  • Set default models per feature
  • Configure reasoning parameters (effort, tokens)
  • Mark models as free or open source
6

WhatsApp Configuration

Set up WhatsApp integration

Configure:

  • Provider selection (Fly.io or Koyeb)
  • Provider URL and API key
  • Webhook URL and secret
  • Enable MCP tools in WhatsApp
  • Enable web search in WhatsApp
  • Default model for WhatsApp
  • Session limits
  • Message queue settings
7

MCP Management

Manage Model Context Protocol integrations

Features:

  • Configure Zapier MCP endpoint
  • Add custom MCP servers
  • Test server connections
  • Health monitoring
  • YOLO mode toggle (auto-approve tools)
  • Enable/disable in chat or embed
  • Discover available tools
8

Admin Tools

User and system management

Access to:

  • User management and admin access
  • Database inspection tools
  • Prompt testing interface
  • Document reprocessing
  • System health checks

Saving & Applying Changes

After making configuration changes:

  1. Click "Save Settings" or "Save All Changes" in the Config UI
  2. Configuration is written to .env.local
  3. Some settings are also synced to Supabase admin_settings table
  4. Restart your development server to apply changes:
# In your dev terminal:
Ctrl+C  # Stop the server
npm run dev  # Start again

Real-time Testing

Test your configuration changes in real-time:

1.

Make changes in Config UI

Update any settings, API keys, or features

2.

Save configuration

Click save and wait for confirmation

3.

Restart dev server

Reload environment variables

4.

Test in main app

Visit http://localhost:3000 to verify changes

Production Deployment

For production deployment:

  1. Configure everything locally using the Config UI
  2. Copy your finalized .env.local settings
  3. Paste environment variables into your hosting provider's dashboard (e.g., Vercel Environment Variables)
  4. Deploy your application