{"owner":"huggingface","repo":"chat-ui","hasSkills":true,"hasMcp":false,"mcpConfig":null,"found":["CLAUDE.md"],"skills":{"CLAUDE.md":"# CLAUDE.md\n\nThis file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.\n\n## Overview\n\nChat UI is a SvelteKit application that provides a chat interface for LLMs. It powers HuggingChat (hf.co/chat). The app speaks exclusively to OpenAI-compatible APIs via `OPENAI_BASE_URL`.\n\n## Commands\n\n```bash\nnpm run dev          # Start dev server on localhost:5173\nnpm run build        # Production build\nnpm run preview      # Preview production build\nnpm run check        # TypeScript validation (svelte-kit sync + svelte-check)\nnpm run lint         # Check formatting (Prettier) and linting (ESLint)\nnpm run format       # Auto-format with Prettier\nnpm run test         # Run all tests (Vitest)\n```\n\n### Running a Single Test\n\n```bash\nnpx vitest run path/to/file.spec.ts        # Run specific test file\nnpx vitest run -t \"test name\"              # Run test by name\nnpx vitest --watch path/to/file.spec.ts    # Watch mode for single file\n```\n\n### Test Environments\n\nTests are split into three workspaces (configured in vite.config.ts):\n\n- **Client tests** (`*.svelte.test.ts`): Browser environment with Playwright\n- **SSR tests** (`*.ssr.test.ts`): Node environment for server-side rendering\n- **Server tests** (`*.test.ts`, `*.spec.ts`): Node environment for utilities\n\n## Architecture\n\n### Stack\n\n- **SvelteKit 2** with Svelte 5 (uses runes: `$state`, `$effect`, `$bindable`)\n- **MongoDB** for persistence (auto-fallback to in-memory with MongoMemoryServer when `MONGODB_URL` not set)\n- **TailwindCSS** for styling\n\n### Key Directories\n\n```\nsrc/\n├── lib/\n│   ├── components/       # Svelte components (chat/, mcp/, voice/, icons/)\n│   ├── server/\n│   │   ├── api/utils/       # Shared API helpers (auth, superjson, model/conversation resolvers)\n│   │   ├── textGeneration/  # LLM streaming pipeline\n│   │   ├── mcp/          # Model Context Protocol integration\n│   │   ├── router/       # Smart model routing (Omni)\n│   │   ├── database.ts   # MongoDB collections\n│   │   ├── models.ts     # Model registry from OPENAI_BASE_URL/models\n│   │   └── auth.ts       # OpenID Connect authentication\n│   ├── types/            # TypeScript interfaces (Conversation, Message, User, Model, etc.)\n│   ├── stores/           # Svelte stores for reactive state\n│   └── utils/            # Helpers (tree/, marked.ts, auth.ts, etc.)\n├── routes/               # SvelteKit file-based routing\n│   ├── conversation/[id]/  # Chat page + streaming endpoint\n│   ├── settings/         # User settings pages\n│   ├── api/              # Legacy v1 API endpoints (mcp, transcribe, fetch-url)\n│   ├── api/v2/           # REST API endpoints (+server.ts)\n│   └── r/[id]/           # Shared conversation view\n```\n\n### Text Generation Flow\n\n1. User sends message via `POST /conversation/[id]`\n2. Server validates user, fetches conversation history\n3. Builds message tree structure (see `src/lib/utils/tree/`)\n4. Calls LLM endpoint via OpenAI client\n5. Streams response back, stores in MongoDB\n\n### Model Context Protocol (MCP)\n\nMCP servers are configured via `MCP_SERVERS` env var. When enabled, tools are exposed as OpenAI function calls. The router can auto-select tools-capable models when `LLM_ROUTER_ENABLE_TOOLS=true`.\n\n### LLM Router (Omni)\n\nSmart routing via Arch-Router model. Configured with:\n\n- `LLM_ROUTER_ROUTES_PATH`: JSON file defining routes\n- `LLM_ROUTER_ARCH_BASE_URL`: Router endpoint\n- Shortcuts: multimodal routes bypass router if `LLM_ROUTER_ENABLE_MULTIMODAL=true`\n\n### Database Collections\n\n- `conversations` - Chat sessions with nested messages\n- `users` - User accounts (OIDC-backed)\n- `sessions` - Session data\n- `sharedConversations` - Public share links\n- `settings` - User preferences\n\n## Environment Setup\n\nCopy `.env` to `.env.local` and configure:\n\n```env\nOPENAI_BASE_URL=https://router.huggingface.co/v1\nOPENAI_API_KEY=hf_***\n# MONGODB_URL is optional; omit for in-memory DB persisted to ./db\n```\n\nSee `.env` for full list of variables including router config, MCP servers, auth, and feature flags.\n\n## Code Conventions\n\n- TypeScript strict mode enabled\n- ESLint: no `any`, no non-null assertions\n- Prettier: tabs, 100 char width, Tailwind class sorting\n- Server vs client separation via SvelteKit conventions (`+page.server.ts` vs `+page.ts`)\n\n## Feature Development Checklist\n\nWhen building new features, consider:\n\n1. **HuggingChat vs self-hosted**: Wrap HuggingChat-specific features with `publicConfig.isHuggingChat`\n2. **Settings persistence**: Add new fields to `src/lib/types/Settings.ts`, update API endpoint at `src/routes/api/v2/user/settings/+server.ts`\n3. **Rich dropdowns**: Use `bits-ui` (Select, DropdownMenu) instead of native elements when you need icons/images in options\n4. **Scrollbars**: Use `scrollbar-custom` class for styled scrollbars\n5. **Icons**: Custom icons in `$lib/components/icons/`, use Carbon (`~icons/carbon/*`) or Lucide (`~icons/lucide/*`) for standard icons\n6. **Provider avatars**: Use `PROVIDERS_HUB_ORGS` from `@huggingface/inference` for HF provider avatar URLs\n"},"files":{"CLAUDE.md":"# CLAUDE.md\n\nThis file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.\n\n## Overview\n\nChat UI is a SvelteKit application that provides a chat interface for LLMs. It powers HuggingChat (hf.co/chat). The app speaks exclusively to OpenAI-compatible APIs via `OPENAI_BASE_URL`.\n\n## Commands\n\n```bash\nnpm run dev          # Start dev server on localhost:5173\nnpm run build        # Production build\nnpm run preview      # Preview production build\nnpm run check        # TypeScript validation (svelte-kit sync + svelte-check)\nnpm run lint         # Check formatting (Prettier) and linting (ESLint)\nnpm run format       # Auto-format with Prettier\nnpm run test         # Run all tests (Vitest)\n```\n\n### Running a Single Test\n\n```bash\nnpx vitest run path/to/file.spec.ts        # Run specific test file\nnpx vitest run -t \"test name\"              # Run test by name\nnpx vitest --watch path/to/file.spec.ts    # Watch mode for single file\n```\n\n### Test Environments\n\nTests are split into three workspaces (configured in vite.config.ts):\n\n- **Client tests** (`*.svelte.test.ts`): Browser environment with Playwright\n- **SSR tests** (`*.ssr.test.ts`): Node environment for server-side rendering\n- **Server tests** (`*.test.ts`, `*.spec.ts`): Node environment for utilities\n\n## Architecture\n\n### Stack\n\n- **SvelteKit 2** with Svelte 5 (uses runes: `$state`, `$effect`, `$bindable`)\n- **MongoDB** for persistence (auto-fallback to in-memory with MongoMemoryServer when `MONGODB_URL` not set)\n- **TailwindCSS** for styling\n\n### Key Directories\n\n```\nsrc/\n├── lib/\n│   ├── components/       # Svelte components (chat/, mcp/, voice/, icons/)\n│   ├── server/\n│   │   ├── api/utils/       # Shared API helpers (auth, superjson, model/conversation resolvers)\n│   │   ├── textGeneration/  # LLM streaming pipeline\n│   │   ├── mcp/          # Model Context Protocol integration\n│   │   ├── router/       # Smart model routing (Omni)\n│   │   ├── database.ts   # MongoDB collections\n│   │   ├── models.ts     # Model registry from OPENAI_BASE_URL/models\n│   │   └── auth.ts       # OpenID Connect authentication\n│   ├── types/            # TypeScript interfaces (Conversation, Message, User, Model, etc.)\n│   ├── stores/           # Svelte stores for reactive state\n│   └── utils/            # Helpers (tree/, marked.ts, auth.ts, etc.)\n├── routes/               # SvelteKit file-based routing\n│   ├── conversation/[id]/  # Chat page + streaming endpoint\n│   ├── settings/         # User settings pages\n│   ├── api/              # Legacy v1 API endpoints (mcp, transcribe, fetch-url)\n│   ├── api/v2/           # REST API endpoints (+server.ts)\n│   └── r/[id]/           # Shared conversation view\n```\n\n### Text Generation Flow\n\n1. User sends message via `POST /conversation/[id]`\n2. Server validates user, fetches conversation history\n3. Builds message tree structure (see `src/lib/utils/tree/`)\n4. Calls LLM endpoint via OpenAI client\n5. Streams response back, stores in MongoDB\n\n### Model Context Protocol (MCP)\n\nMCP servers are configured via `MCP_SERVERS` env var. When enabled, tools are exposed as OpenAI function calls. The router can auto-select tools-capable models when `LLM_ROUTER_ENABLE_TOOLS=true`.\n\n### LLM Router (Omni)\n\nSmart routing via Arch-Router model. Configured with:\n\n- `LLM_ROUTER_ROUTES_PATH`: JSON file defining routes\n- `LLM_ROUTER_ARCH_BASE_URL`: Router endpoint\n- Shortcuts: multimodal routes bypass router if `LLM_ROUTER_ENABLE_MULTIMODAL=true`\n\n### Database Collections\n\n- `conversations` - Chat sessions with nested messages\n- `users` - User accounts (OIDC-backed)\n- `sessions` - Session data\n- `sharedConversations` - Public share links\n- `settings` - User preferences\n\n## Environment Setup\n\nCopy `.env` to `.env.local` and configure:\n\n```env\nOPENAI_BASE_URL=https://router.huggingface.co/v1\nOPENAI_API_KEY=hf_***\n# MONGODB_URL is optional; omit for in-memory DB persisted to ./db\n```\n\nSee `.env` for full list of variables including router config, MCP servers, auth, and feature flags.\n\n## Code Conventions\n\n- TypeScript strict mode enabled\n- ESLint: no `any`, no non-null assertions\n- Prettier: tabs, 100 char width, Tailwind class sorting\n- Server vs client separation via SvelteKit conventions (`+page.server.ts` vs `+page.ts`)\n\n## Feature Development Checklist\n\nWhen building new features, consider:\n\n1. **HuggingChat vs self-hosted**: Wrap HuggingChat-specific features with `publicConfig.isHuggingChat`\n2. **Settings persistence**: Add new fields to `src/lib/types/Settings.ts`, update API endpoint at `src/routes/api/v2/user/settings/+server.ts`\n3. **Rich dropdowns**: Use `bits-ui` (Select, DropdownMenu) instead of native elements when you need icons/images in options\n4. **Scrollbars**: Use `scrollbar-custom` class for styled scrollbars\n5. **Icons**: Custom icons in `$lib/components/icons/`, use Carbon (`~icons/carbon/*`) or Lucide (`~icons/lucide/*`) for standard icons\n6. **Provider avatars**: Use `PROVIDERS_HUB_ORGS` from `@huggingface/inference` for HF provider avatar URLs\n"},"items":[{"name":"CLAUDE.md","path":"CLAUDE.md","title":"CLAUDE.md","content":"# CLAUDE.md\n\nThis file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.\n\n## Overview\n\nChat UI is a SvelteKit application that provides a chat interface for LLMs. It powers HuggingChat (hf.co/chat). The app speaks exclusively to OpenAI-compatible APIs via `OPENAI_BASE_URL`.\n\n## Commands\n\n```bash\nnpm run dev          # Start dev server on localhost:5173\nnpm run build        # Production build\nnpm run preview      # Preview production build\nnpm run check        # TypeScript validation (svelte-kit sync + svelte-check)\nnpm run lint         # Check formatting (Prettier) and linting (ESLint)\nnpm run format       # Auto-format with Prettier\nnpm run test         # Run all tests (Vitest)\n```\n\n### Running a Single Test\n\n```bash\nnpx vitest run path/to/file.spec.ts        # Run specific test file\nnpx vitest run -t \"test name\"              # Run test by name\nnpx vitest --watch path/to/file.spec.ts    # Watch mode for single file\n```\n\n### Test Environments\n\nTests are split into three workspaces (configured in vite.config.ts):\n\n- **Client tests** (`*.svelte.test.ts`): Browser environment with Playwright\n- **SSR tests** (`*.ssr.test.ts`): Node environment for server-side rendering\n- **Server tests** (`*.test.ts`, `*.spec.ts`): Node environment for utilities\n\n## Architecture\n\n### Stack\n\n- **SvelteKit 2** with Svelte 5 (uses runes: `$state`, `$effect`, `$bindable`)\n- **MongoDB** for persistence (auto-fallback to in-memory with MongoMemoryServer when `MONGODB_URL` not set)\n- **TailwindCSS** for styling\n\n### Key Directories\n\n```\nsrc/\n├── lib/\n│   ├── components/       # Svelte components (chat/, mcp/, voice/, icons/)\n│   ├── server/\n│   │   ├── api/utils/       # Shared API helpers (auth, superjson, model/conversation resolvers)\n│   │   ├── textGeneration/  # LLM streaming pipeline\n│   │   ├── mcp/          # Model Context Protocol integration\n│   │   ├── router/       # Smart model routing (Omni)\n│   │   ├── database.ts   # MongoDB collections\n│   │   ├── models.ts     # Model registry from OPENAI_BASE_URL/models\n│   │   └── auth.ts       # OpenID Connect authentication\n│   ├── types/            # TypeScript interfaces (Conversation, Message, User, Model, etc.)\n│   ├── stores/           # Svelte stores for reactive state\n│   └── utils/            # Helpers (tree/, marked.ts, auth.ts, etc.)\n├── routes/               # SvelteKit file-based routing\n│   ├── conversation/[id]/  # Chat page + streaming endpoint\n│   ├── settings/         # User settings pages\n│   ├── api/              # Legacy v1 API endpoints (mcp, transcribe, fetch-url)\n│   ├── api/v2/           # REST API endpoints (+server.ts)\n│   └── r/[id]/           # Shared conversation view\n```\n\n### Text Generation Flow\n\n1. User sends message via `POST /conversation/[id]`\n2. Server validates user, fetches conversation history\n3. Builds message tree structure (see `src/lib/utils/tree/`)\n4. Calls LLM endpoint via OpenAI client\n5. Streams response back, stores in MongoDB\n\n### Model Context Protocol (MCP)\n\nMCP servers are configured via `MCP_SERVERS` env var. When enabled, tools are exposed as OpenAI function calls. The router can auto-select tools-capable models when `LLM_ROUTER_ENABLE_TOOLS=true`.\n\n### LLM Router (Omni)\n\nSmart routing via Arch-Router model. Configured with:\n\n- `LLM_ROUTER_ROUTES_PATH`: JSON file defining routes\n- `LLM_ROUTER_ARCH_BASE_URL`: Router endpoint\n- Shortcuts: multimodal routes bypass router if `LLM_ROUTER_ENABLE_MULTIMODAL=true`\n\n### Database Collections\n\n- `conversations` - Chat sessions with nested messages\n- `users` - User accounts (OIDC-backed)\n- `sessions` - Session data\n- `sharedConversations` - Public share links\n- `settings` - User preferences\n\n## Environment Setup\n\nCopy `.env` to `.env.local` and configure:\n\n```env\nOPENAI_BASE_URL=https://router.huggingface.co/v1\nOPENAI_API_KEY=hf_***\n# MONGODB_URL is optional; omit for in-memory DB persisted to ./db\n```\n\nSee `.env` for full list of variables including router config, MCP servers, auth, and feature flags.\n\n## Code Conventions\n\n- TypeScript strict mode enabled\n- ESLint: no `any`, no non-null assertions\n- Prettier: tabs, 100 char width, Tailwind class sorting\n- Server vs client separation via SvelteKit conventions (`+page.server.ts` vs `+page.ts`)\n\n## Feature Development Checklist\n\nWhen building new features, consider:\n\n1. **HuggingChat vs self-hosted**: Wrap HuggingChat-specific features with `publicConfig.isHuggingChat`\n2. **Settings persistence**: Add new fields to `src/lib/types/Settings.ts`, update API endpoint at `src/routes/api/v2/user/settings/+server.ts`\n3. **Rich dropdowns**: Use `bits-ui` (Select, DropdownMenu) instead of native elements when you need icons/images in options\n4. **Scrollbars**: Use `scrollbar-custom` class for styled scrollbars\n5. **Icons**: Custom icons in `$lib/components/icons/`, use Carbon (`~icons/carbon/*`) or Lucide (`~icons/lucide/*`) for standard icons\n6. **Provider avatars**: Use `PROVIDERS_HUB_ORGS` from `@huggingface/inference` for HF provider avatar URLs\n","category":"root","tokens":1261}]}