AI Configuration

Set up AI providers (OpenAI and Anthropic Claude) for BlockForge's AI features.

Overview

BlockForge supports multiple AI providers:

• OpenAI - GPT-4, GPT-4 Turbo, GPT-3.5 Turbo
• Anthropic - Claude 3 (Sonnet, Haiku, Opus)

OpenAI Setup

1. Get API Key

1. Go to platform.openai.com
2. Sign up or log in
3. Navigate to API Keys
4. Click Create new secret key
5. Copy the key (you won't see it again!)

2. Configure Environment

Add to .env.local:

VITE_AI_PROVIDER=openai
VITE_AI_API_KEY=sk-...
VITE_AI_MODEL=gpt-4o-mini

3. Available Models

Choose based on your needs:

• gpt-4o-mini - Fast, cost-effective (recommended for most use cases)
• gpt-4o - More capable, faster than GPT-4
• gpt-4-turbo - High quality, good for complex tasks
• gpt-4 - Most capable, slower
• gpt-3.5-turbo - Fast and cheap, good for simple tasks

4. Test Configuration

1. Start development server
2. Open a page in BlockForge
3. Select some text
4. Click AI icon
5. Try an AI action (e.g., "Improve")

Anthropic Claude Setup

Option 1: Direct API (Client-Side)

Add to .env.local:

VITE_AI_PROVIDER=anthropic
VITE_AI_API_KEY=sk-ant-...
VITE_AI_MODEL=claude-3-haiku-20240307

Option 2: Edge Function (Recommended)

For better security, use Supabase Edge Function as a proxy:

1. Set up Edge Function:

   • Create Edge Function in Supabase
   • Add ANTHROPIC_API_KEY to function secrets
   • Deploy function

2. Configure environment:

VITE_AI_PROVIDER=anthropic
VITE_AI_API_KEY=your-edge-function-url
VITE_AI_MODEL=claude-3-haiku-20240307

Available Claude Models

• claude-3-haiku-20240307 - Fast, cost-effective
• claude-3-sonnet-20240229 - Balanced, recommended
• claude-3-opus-20240229 - Most capable, slower

Get Anthropic API Key

1. Go to console.anthropic.com
2. Sign up or log in
3. Navigate to API Keys
4. Click Create Key
5. Copy the key

Switching Providers

You can switch providers by changing environment variables:

# Use OpenAI
VITE_AI_PROVIDER=openai
VITE_AI_API_KEY=sk-...

# Or use Anthropic
VITE_AI_PROVIDER=anthropic
VITE_AI_API_KEY=sk-ant-...

Restart the development server after changing providers.

Model Selection

For Speed

• OpenAI: gpt-4o-mini or gpt-3.5-turbo
• Anthropic: claude-3-haiku-20240307

For Quality

• OpenAI: gpt-4o or gpt-4-turbo
• Anthropic: claude-3-sonnet-20240229

For Complex Tasks

• OpenAI: gpt-4
• Anthropic: claude-3-opus-20240229

Cost Considerations

OpenAI Pricing (approximate)

• GPT-4o-mini: Very low cost
• GPT-3.5-turbo: Low cost
• GPT-4o: Medium cost
• GPT-4: Higher cost

Anthropic Pricing (approximate)

• Claude Haiku: Very low cost
• Claude Sonnet: Medium cost
• Claude Opus: Higher cost

Monitor usage in respective provider dashboards.

Security Best Practices

1. Never commit API keys - Use environment variables only
2. Use Edge Functions - For production, proxy through Edge Functions
3. Set usage limits - Configure limits in provider dashboards
4. Rotate keys - Regularly rotate API keys
5. Monitor usage - Track API usage and costs

Troubleshooting

API Key Errors

• Verify key is correct
• Check key has necessary permissions
• Ensure key hasn't expired

Rate Limiting

• Reduce request frequency
• Upgrade API plan if needed
• Implement retry logic

Model Not Found

• Verify model name is correct
• Check provider has access to model
• Update to supported model version

Connection Issues

• Check network connectivity
• Verify API endpoint URLs
• Check firewall/proxy settings

Production Setup

For production deployment:

1. Add environment variables in hosting platform (Vercel, etc.)
2. Use Edge Functions for sensitive API keys
3. Set up monitoring for API usage
4. Configure rate limiting if needed
5. Set up alerts for errors or high usage

Next Steps

• Deployment Guide
• Configuration Guide
• AI Features Guide