Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-24 12:20:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions
Enhanced ChatGPT Clone: Features Agents, MCP, DeepSeek, Anthropic, AWS, OpenAI, Responses API, Azure, Groq, o1, GPT-5, Mistral, OpenRouter, Vertex AI, Gemini, Artifacts, AI model switching, message search, Code Interpreter, langchain, DALL-E-3, OpenAPI Actions, Functions, Secure Multi-User Auth, Presets, open-source for self-hosting. Active. https://librechat.ai/
3401 commits 87 branches 70 tags 518 MiB
Find a file
Danny Avila 9848f86215
👐 fix: Open/Close Sidebar Button Animation UX Regression from #10521 (#10694) 
Problem:
--------
Commit 5ed1f2991 introduced a layout shift regression when opening the
sidebar. The UI would visibly "jump" as elements shifted right before
the animation completed. Closing the sidebar worked correctly.

Root Cause Analysis:
--------------------
The accessibility PR added a redundant `{navVisible && ...}` conditional
wrapper around the `<nav>` content inside Nav.tsx's `motion.div`. This
caused a race condition:

1. User clicks "Open Sidebar" button
2. `navVisible` state becomes `true`
3. React renders the `motion.div` AND its children simultaneously
4. The inner `{navVisible && (<nav>...)}` renders content at full width
   (320px/260px) BEFORE framer-motion applies `initial={{ width: 0 }}`
5. Brief flash of full-width content causes visible layout shift
6. Animation then starts from width: 0, but damage is done

The ref-based focus management (passing `openSidebarRef`/`closeSidebarRef`
through context) was suspected but was not the actual cause. However,
`requestAnimationFrame` focus calls during animation start could trigger
forced layout calculations, exacerbating the issue.

Solution:
---------
1. Remove redundant conditional rendering in Nav.tsx
   - The outer `{navVisible && (<motion.div>...)}` already controls
     visibility
   - The `overflow-x-hidden` class on motion.div clips content during
     animation
   - Content should always exist inside motion.div for smooth clipping

2. Replace ref-based focus with ID-based focus management
   - Refs passed through component tree can affect React's reconciliation
   - Using `document.getElementById()` decouples focus from render cycle
   - Exported `CLOSE_SIDEBAR_ID` and `OPEN_SIDEBAR_ID` constants for
     consistency

3. Delay focus until after animation completes
   - Changed from `requestAnimationFrame` to `setTimeout(..., 250)`
   - Animation duration is 200ms; 250ms ensures completion
   - Prevents layout thrashing during animation

4. Clean up prop drilling
   - Removed `openSidebarRef`/`closeSidebarRef` from Root.tsx context
   - Simplified Nav.tsx, Header.tsx, NewChat.tsx prop signatures
   - Updated ContextType to remove ref properties

Files Changed:
--------------
- client/src/routes/Root.tsx
- client/src/components/Nav/Nav.tsx
- client/src/components/Nav/NewChat.tsx
- client/src/components/Chat/Header.tsx
- client/src/components/Chat/Menus/OpenSidebar.tsx
- client/src/common/types.ts

Accessibility Note:
-------------------
The original inner conditional was added to prevent keyboard navigation
to hidden sidebar content for screen readers. This is still handled by:
- AnimatePresence unmounting the motion.div after exit animation
- The motion.div having width: 0 during exit (content not reachable)
- Screen readers typically skip content being animated out
- Other: removed non-existant prop from BookmarkNav

Testing:
--------
- Verified smooth animation when opening sidebar (no layout shift)
- Verified smooth animation when closing sidebar (unchanged)
- Verified focus transfers correctly between open/close buttons
- Verified keyboard navigation works as expected
2025-12-03 14:27:23 -05:00
.devcontainer 🪦 refactor: Remove Legacy Code (#10533) 2025-12-03 14:27:21 -05:00
.github 🧩 refactor: Decouple MCP Config from Startup Config (#10689) 2025-12-03 14:27:23 -05:00
.husky ⚡ refactor: Latest Message Tracking with Robust Text Key Generation (#10059) 2025-10-10 04:22:16 -04:00
.vscode 🔐 feat: Granular Role-based Permissions + Entra ID Group Discovery (#7804) 2025-08-13 16:24:17 -04:00
api 🧩 refactor: Decouple MCP Config from Startup Config (#10689) 2025-12-03 14:27:23 -05:00
client 👐 fix: Open/Close Sidebar Button Animation UX Regression from #10521 (#10694) 2025-12-03 14:27:23 -05:00
config 🪙 refactor: Remove Use of CHECK_BALANCE in Balance Scripts (#10702) 2025-11-28 11:11:26 -05:00
e2e 🪦 refactor: Remove Legacy Code (#10533) 2025-12-03 14:27:21 -05:00
helm 🪦 refactor: Remove Legacy Code (#10533) 2025-12-03 14:27:21 -05:00
packages 🧩 refactor: Decouple MCP Config from Startup Config (#10689) 2025-12-03 14:27:23 -05:00
redis-config 🔄 refactor: Migrate Cache Logic to TypeScript (#9771) 2025-10-02 09:33:58 -04:00
src/tests 🆔 feat: Add OpenID Connect Federated Provider Token Support (#9931) 2025-11-21 09:51:11 -05:00
utils 🐋 chore: switch from ankane/pgvector to pgvector/pgvector (#9245) 2025-08-27 02:04:58 -04:00
.dockerignore 🐳 : Further Docker build Cleanup & Docs Update (#1502) 2024-01-06 11:59:08 -05:00
.env.example 🪦 refactor: Remove Legacy Code (#10533) 2025-12-03 14:27:21 -05:00
.gitignore 🆔 feat: Add OpenID Connect Federated Provider Token Support (#9931) 2025-11-21 09:51:11 -05:00
.prettierrc 🧹 chore: Migrate to Flat ESLint Config & Update Prettier Settings (#5737) 2025-02-09 12:15:20 -05:00
bun.lockb 📦 chore: bump vite to address low severity vulns (#9553) 2025-09-10 14:56:46 -04:00
CHANGELOG.md 📜 docs: Unreleased Changelog (#7560) 2025-05-27 15:47:36 -04:00
deploy-compose.yml 🐋 chore: switch from ankane/pgvector to pgvector/pgvector (#9245) 2025-08-27 02:04:58 -04:00
docker-compose.override.yml.example 🔑 feat: SAML authentication (#6169) 2025-05-29 11:00:58 -04:00
docker-compose.yml 🧹 chore: Cleanup Logger and Utility Imports (#9935) 2025-10-01 23:30:47 -04:00
Dockerfile ✨ v0.8.1-rc2 (#10688) 2025-11-26 11:40:08 -05:00
Dockerfile.multi ✨ v0.8.1-rc2 (#10688) 2025-11-26 11:40:08 -05:00
eslint.config.mjs 📡 refactor: MCP Runtime Config Sync with Redis Distributed Locking (#10352) 2025-12-03 14:27:21 -05:00
librechat.example.yaml 🌉 feat: Integrate Helicone AI Gateway Provider (#10287) 2025-11-13 08:45:32 -05:00
LICENSE ⚖️ docs: Update LICENSE.md Year: 2024 -> 2025 (#5915) 2025-02-17 10:39:46 -05:00
package-lock.json 📦 chore: Bump Express.js to v5 (#10671) 2025-12-03 14:27:21 -05:00
package.json 🧩 refactor: Decouple MCP Config from Startup Config (#10689) 2025-12-03 14:27:23 -05:00
rag.yml 🐋 chore: switch from ankane/pgvector to pgvector/pgvector (#9245) 2025-08-27 02:04:58 -04:00
README.md 🌉 feat: Integrate Helicone AI Gateway Provider (#10287) 2025-11-13 08:45:32 -05:00

README.md

LibreChat

Deploy on Railway Deploy on Zeabur Deploy on Sealos

Translation Progress

✨ Features

  • 🖥️ UI & Experience inspired by ChatGPT with enhanced design and features

  • 🤖 AI Model Selection:

    • Anthropic (Claude), AWS Bedrock, OpenAI, Azure OpenAI, Google, Vertex AI, OpenAI Responses API (incl. Azure)
    • Custom Endpoints: Use any OpenAI-compatible API with LibreChat, no proxy required
    • Compatible with Local & Remote AI Providers:
      • Ollama, groq, Cohere, Mistral AI, Apple MLX, koboldcpp, together.ai,
      • OpenRouter, Helicone, Perplexity, ShuttleAI, Deepseek, Qwen, and more

  • 🔧 Code Interpreter API:

    • Secure, Sandboxed Execution in Python, Node.js (JS/TS), Go, C/C++, Java, PHP, Rust, and Fortran
    • Seamless File Handling: Upload, process, and download files directly
    • No Privacy Concerns: Fully isolated and secure execution

  • 🔦 Agents & Tools Integration:

    • LibreChat Agents:
      • No-Code Custom Assistants: Build specialized, AI-driven helpers
      • Agent Marketplace: Discover and deploy community-built agents
      • Collaborative Sharing: Share agents with specific users and groups
      • Flexible & Extensible: Use MCP Servers, tools, file search, code execution, and more
      • Compatible with Custom Endpoints, OpenAI, Azure, Anthropic, AWS Bedrock, Google, Vertex AI, Responses API, and more
      • Model Context Protocol (MCP) Support for Tools

  • 🔍 Web Search:

    • Search the internet and retrieve relevant information to enhance your AI context
    • Combines search providers, content scrapers, and result rerankers for optimal results
    • Customizable Jina Reranking: Configure custom Jina API URLs for reranking services
    • Learn More →

  • 🪄 Generative UI with Code Artifacts:

    • Code Artifacts allow creation of React, HTML, and Mermaid diagrams directly in chat

  • 🎨 Image Generation & Editing

  • 💾 Presets & Context Management:

    • Create, Save, & Share Custom Presets
    • Switch between AI Endpoints and Presets mid-chat
    • Edit, Resubmit, and Continue Messages with Conversation branching
    • Create and share prompts with specific users and groups
    • Fork Messages & Conversations for Advanced Context control

  • 💬 Multimodal & File Interactions:

    • Upload and analyze images with Claude 3, GPT-4.5, GPT-4o, o1, Llama-Vision, and Gemini 📸
    • Chat with Files using Custom Endpoints, OpenAI, Azure, Anthropic, AWS Bedrock, & Google 🗃️

  • 🌎 Multilingual UI:

    • English, 中文 (简体), 中文 (繁體), العربية, Deutsch, Español, Français, Italiano
    • Polski, Português (PT), Português (BR), Русский, 日本語, Svenska, 한국어, Tiếng Việt
    • Türkçe, Nederlands, עברית, Català, Čeština, Dansk, Eesti, فارسی
    • Suomi, Magyar, Հայերեն, Bahasa Indonesia, ქართული, Latviešu, ไทย, ئۇيغۇرچە

  • 🧠 Reasoning UI:

    • Dynamic Reasoning UI for Chain-of-Thought/Reasoning AI models like DeepSeek-R1

  • 🎨 Customizable Interface:

    • Customizable Dropdown & Interface that adapts to both power users and newcomers

  • 🗣️ Speech & Audio:

    • Chat hands-free with Speech-to-Text and Text-to-Speech
    • Automatically send and play Audio
    • Supports OpenAI, Azure OpenAI, and Elevenlabs

  • 📥 Import & Export Conversations:

    • Import Conversations from LibreChat, ChatGPT, Chatbot UI
    • Export conversations as screenshots, markdown, text, json

  • 🔍 Search & Discovery:

    • Search all messages/conversations

  • 👥 Multi-User & Secure Access:

    • Multi-User, Secure Authentication with OAuth2, LDAP, & Email Login Support
    • Built-in Moderation, and Token spend tools

  • ⚙️ Configuration & Deployment:

    • Configure Proxy, Reverse Proxy, Docker, & many Deployment options
    • Use completely local or deploy on the cloud

  • 📖 Open-Source & Community:

    • Completely Open-Source & Built in Public
    • Community-driven development, support, and feedback

For a thorough review of our features, see our docs here 📚

🪶 All-In-One AI Conversations with LibreChat

LibreChat brings together the future of assistant AIs with the revolutionary technology of OpenAI's ChatGPT. Celebrating the original styling, LibreChat gives you the ability to integrate multiple AI models. It also integrates and enhances original client features such as conversation and message search, prompt templates and plugins.

With LibreChat, you no longer need to opt for ChatGPT Plus and can instead use free or pay-per-call APIs. We welcome contributions, cloning, and forking to enhance the capabilities of this advanced chatbot platform.

Watch the video

Click on the thumbnail to open the video☝️

🌐 Resources

GitHub Repo:

Other:

📝 Changelog

Keep up with the latest updates by visiting the releases page and notes:

⚠️ Please consult the changelog for breaking changes before updating.

⭐ Star History

Star History Chart

danny-avila%2FLibreChat | Trendshift ROSS Index - Fastest Growing Open-Source Startups in Q1 2024 | Runa Capital

✨ Contributions

Contributions, suggestions, bug reports and fixes are welcome!

For new features, components, or extensions, please open an issue and discuss before sending a PR.

If you'd like to help translate LibreChat into your language, we'd love your contribution! Improving our translations not only makes LibreChat more accessible to users around the world but also enhances the overall user experience. Please check out our Translation Guide.

💖 This project exists in its current state thanks to all the people who contribute

🎉 Special Thanks

We thank Locize for their translation management tools that support multiple languages in LibreChat.

Locize Logo