AI Chat Application

A modern, responsive React application featuring real-time AI streaming, persistent chat history, and a sophisticated "thinking" UI.

Features

• Wait-for-it Streaming: Responses stream to the browser in real-time, character by character.
• Thinking UI: Visualizes the internal reasoning process of advanced models (e.g., DeepSeek-R1) with a collapsible "Thinking Process" bubble.
• Persistent History: Chat sessions are saved locally to localStorage, allowing you to resume conversations anytime.
• Markdown Support: Renders clean Markdown with syntax highlighting for code blocks.
• Secure Backend: Uses a Vercel Edge Function proxy (api/ai.js) to keep API keys secure on the server side.

Quick Start

1. Install Dependencies

   npm install

2. Run Development Server

   npm run dev

   Open http://localhost:5173 to view it in the browser.

3. Local API (Optional) To run the serverless function locally:

   npm install -g vercel
   vercel dev

Environment Configuration

To connect a real AI model (instead of the mock mode), create a .env file or configure your Vercel project with:

Variable	Description	Required?
HF_TOKEN	Hugging Face Access Token	Yes (for real AI)
HF_MODEL	Model ID (e.g., meta-llama/Llama-3.1-8B-Instruct)	No
VITE_AI_API_URL	Path to backend (default: /api/ai)	No

Deployment

This project is optimized for Vercel.

1. Push to GitHub.
2. Import project in Vercel.
3. Add HF_TOKEN to Environment Variables.
4. Deploy!

See DEPLOYMENT.md for a detailed guide.