A modern, responsive chat application built as a T3chat clone for the Cloneathon. TeaTree Chat operates on a BYOK (Bring Your Own Key) basis using OpenRouter, giving users access to multiple AI models with their own API keys. This project was intially made as part of T3 chats cloneathon.
- Secure user registration and login with email validation
- Password strength requirements (uppercase, lowercase, digit, special character)
- Account management with delete account functionality
- API key management with encrypted storage
- Real-time streaming responses from AI models
- Multiple chat sessions with persistent storage
- Chat forking - branch conversations from any message
- Message regeneration with model selection
- Chat renaming for better organization
- Message copying with one-click functionality
- Multiple AI providers through OpenRouter:
- Meta (Llama models)
- Anthropic (Claude)
- OpenAI (GPT)
- Google (Gemini)
- Mistral AI
- And many more!
- Model selection for new chats and regeneration
- Free model auto-selection for new users
- Model-specific regeneration options
- Beautiful, responsive design with TeaTree branding
- Dark theme with tan (#D6BFA3) and brown (#4E342E) color scheme
- API key status indicators with visual feedback
- Loading states and error handling
- Mobile-friendly responsive layout
- Server wake-up functionality for Render free plan
- Automatic retry logic for network issues
- Graceful error handling with user-friendly messages
- Optimized streaming with duplicate content filtering
- Next.js 14 with TypeScript
- Material-UI (MUI) for components
- Tailwind CSS for styling
- React Markdown for message rendering
- Syntax highlighting for code blocks
- FastAPI with Python
- SQLAlchemy ORM with SQLite database
- JWT authentication with bcrypt password hashing
- Encrypted API key storage using Fernet
- CORS middleware for cross-origin requests
- Frontend: Vercel
- Backend: Render (free plan with auto-wake functionality)
- Node.js 18+ and npm
- Python 3.8+
- OpenRouter API key (Get one free here)
cd frontend
npm install
npm run devcd backend
pip install -r requirements.txt
chmod +x start.sh
./start.shCreate .env files in both frontend and backend directories:
Frontend (.env.local):
NEXT_PUBLIC_API_URL=http://localhost:8000/api
Backend (.env):
FERNET_KEY=your-fernet-key-here
ALLOWED_ORIGINS=http://localhost:3000
- Register/Login with your email and password
- Set your OpenRouter API key in Settings
- Create a new chat (automatically uses free Llama model)
- Start chatting with AI models
- Regenerate responses with different models
- Fork conversations to explore different paths
- Manage your chats with renaming and deletion
- User authentication and registration
- BYOK (Bring Your Own Key) functionality
- Multiple AI model support
- Real-time streaming responses
- Chat forking and regeneration
- Model selection for regeneration
- API key status indicators
- Server wake-up for free hosting
- Error handling and user feedback
- Chat management (rename, delete)
- Responsive UI design
- Free model auto-selection
- Message copying functionality
- Tools integration
- File attachments support
- Chat export functionality
- Web search capabilities
- Multi-modal support (images, files)
- Credits calculator
- Custom model configurations
- Improved reasoning model support
- Chat search functionality
TeaTree Chat follows a modern full-stack architecture:
- Frontend: React/Next.js with server-side rendering
- Backend: RESTful API with FastAPI
- Database: SQLite with SQLAlchemy ORM and Postgres for Prod
- Authentication: JWT tokens with secure password hashing
- AI Integration: OpenRouter API for multiple model access
- Deployment: Serverless frontend, containerized backend
This project was built as part of the Cloneathon. Contributions, issues, and feature requests are welcome!
Vividh Mahajan
- Website: vividh.lol
- GitHub: Lasdw6/TeaTreeChat
This project is licensed under the MIT License - see the LICENSE file for details.