AI Chat Application
Note: This is an ongoing project. Updates and new features are being added regularly.
This app is a sophisticated, real-time AI chat platform designed to provide a versatile and seamless conversational experience. Built with a powerful FastAPI backend and a responsive vanilla JavaScript frontend, it integrates with APIs from multiple leading providers, granting users access to a wide array of language models.
The application goes beyond a simple chat interface by incorporating a full suite of features including secure user authentication, persistent chat history, and a usage-based billing system.
Key Features
- Real-time, Streaming Chat: Utilizes WebSockets to deliver instant, token-by-token AI responses, creating a fluid and interactive user experience. Users can also cancel a response mid-generation.
- Multi-Model Integration: Connects to various AI provider APIs, allowing users to choose from a curated list of models. A background service periodically fetches and caches model details to the local database, ensuring the model list is always up-to-date.
- User Authentication & Sessions: Implements secure OAuth for user login. Authenticated users have their chat sessions and messages persistently stored in a database, with full capabilities to list, load, rename, and delete their conversation history.
- Usage-Based Billing System: Tracks the cost of each AI interaction. The system calculates the cost in USD, applies a service tax, converts the final amount to local currency using a cached, real-time exchange rate, and deducts it from the user’s balance.
- Seamless Multi-language Translation: Offers transparent, on-the-fly translation for users chatting in different languages. The system automatically translates user input to English before sending it to the AI model and then translates the AI’s English response back to the user’s native language for a seamless experience.
- Interactive Frontend: The UI is built with vanilla JavaScript, HTML, and CSS for a lightweight and fast experience. It includes full Markdown rendering for messages, syntax highlighting for code blocks with a “copy” button, and dynamic dropdowns for model and language selection.