AI Chat Application

A minimal, privacy-first AI chat application built with React, TypeScript, and Transformers.js v4. Chat, dictate, listen, and analyze images — every model runs locally in your browser via WebGPU (with automatic WebAssembly fallback). No servers. No API keys. No data leaves your device.

✨ Features

🔒 Local-first by design

• Transformers.js v4 backend — models execute on your GPU through WebGPU, falling back to WebAssembly automatically.
• On-device speech-to-text — microphone dictation is recorded and transcribed in your browser (Moonshine or Whisper). No cloud speech APIs.
• Text-to-speech — replies can be read aloud with Supertonic or MMS VITS.
• Vision — attach images to chat when a vision model (SmolVLM) is active.
• Offline capable once weights are cached by your browser.

🧠 Model catalog

A built-in Models page lists what each model can do — chat, vision, speech-to-text, text-to-speech, code, reasoning — with size estimates and one-click loading:

Group	Models
Chat	SmolLM2 360M · SmolLM2 1.7B · Llama 3.2 1B · Qwen2.5 Coder 0.5B · Qwen3 0.6B
Vision	SmolVLM 256M · SmolVLM 500M
Speech-to-text	Moonshine Base · Whisper Base · Whisper Tiny EN
Text-to-speech	Supertonic · MMS English (VITS)

🛠️ Tools, artifacts & MCP — built into chat

• The chat model can call real tools when a task needs them: web search (Wikipedia + Hacker News), a Python sandbox, URL/API fetching, calculator and clock.
• MCP support: connect any CORS-enabled Streamable-HTTP MCP server under Models → Tools & MCP (https://mcp.deepwiki.com/mcp works) and its tools join the same toolkit automatically.
• Artifacts: substantial code, HTML mini-apps and documents are produced as artifacts with a live sandboxed preview, copy & download.

🧠 Model library

• Curated catalog with per-model context windows; chat history is trimmed to fit the active model's budget automatically.
• Discover tab: search Hugging Face for transformers.js-compatible models (trending / downloads / recently updated) and add them in one click.

🚀 Getting started

npm install
npm run dev        # http://localhost:5173

First visit loads the default chat model (~740 MB for SmolLM2 1.7B). Pick a smaller one under Models → Load if you want to start faster. Requires a browser with WebGPU (Chrome/Edge 113+) for best speed; everything still works on WebAssembly elsewhere.

🛠️ Tech

React 19 · TypeScript · Tailwind CSS v4 · Zustand · Transformers.js v4 (@huggingface/transformers) · react-router · Sonner.

MIT © Abdullah Studio