Merge branch 'dev' into feat/openid-custom-data

* 🚀 feat: Add @marsidev/react-turnstile dependency to package.json and package-lock.json

* 🚀 feat: Integrate Cloudflare Turnstile configuration support in AppService and add schema validation

* 🚀 feat: Implemented Cloudflare Turnstile integration in Login and Registration forms

* 🚀 feat: Enhance AppService tests with additional mocks and configuration setups

* 🚀 feat: Comment out outdated config version warning tests in AppService.spec.js

* 🚀 feat: Remove outdated warning tests and add new checks for environment variables and API health

* 🔧 test: Update AppService.spec.js to use expect.anything() for paths validation

* 🔧 test: Refactor AppService.spec.js to streamline mocks and enhance clarity

* 🔧 chore: removed not needed test

* Potential fix for code scanning alert no. 5638: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* Potential fix for code scanning alert no. 5629: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* Potential fix for code scanning alert no. 5642: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* Update turnstile.js

* Potential fix for code scanning alert no. 5634: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* Potential fix for code scanning alert no. 5646: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* Potential fix for code scanning alert no. 5647: Ensure code is properly formatted, use insertion, deletion, or replacement to obtain desired formatting.

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

---------

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

.env.example

@@ -142,12 +142,12 @@ GOOGLE_KEY=user_provided
 # GOOGLE_AUTH_HEADER=true
 
 # Gemini API (AI Studio)
-# GOOGLE_MODELS=gemini-2.5-pro-exp-03-25,gemini-2.0-flash-exp,gemini-2.0-flash-thinking-exp-1219,gemini-exp-1121,gemini-exp-1114,gemini-1.5-flash-latest,gemini-1.0-pro,gemini-1.0-pro-001,gemini-1.0-pro-latest,gemini-1.0-pro-vision-latest,gemini-1.5-pro-latest,gemini-pro,gemini-pro-vision
+# GOOGLE_MODELS=gemini-2.5-pro-preview-05-06,gemini-2.5-flash-preview-04-17,gemini-2.0-flash-001,gemini-2.0-flash-exp,gemini-2.0-flash-lite-001,gemini-1.5-pro-002,gemini-1.5-flash-002
 
 # Vertex AI
-# GOOGLE_MODELS=gemini-1.5-flash-preview-0514,gemini-1.5-pro-preview-0514,gemini-1.0-pro-vision-001,gemini-1.0-pro-002,gemini-1.0-pro-001,gemini-pro-vision,gemini-1.0-pro
+# GOOGLE_MODELS=gemini-2.5-pro-preview-05-06,gemini-2.5-flash-preview-04-17,gemini-2.0-flash-001,gemini-2.0-flash-exp,gemini-2.0-flash-lite-001,gemini-1.5-pro-002,gemini-1.5-flash-002
 
-# GOOGLE_TITLE_MODEL=gemini-pro
+# GOOGLE_TITLE_MODEL=gemini-2.0-flash-lite-001
 
 # GOOGLE_LOC=us-central1
 
@@ -438,6 +438,10 @@ OPENID_USERNAME_CLAIM=
 # Set to determine which user info property returned from OpenID Provider to store as the User's name
 OPENID_NAME_CLAIM=
 
+OPENID_CUSTOM_DATA=
+OPENID_PROVIDER=
+OPENID_ADMIN_ROLE=
+
 OPENID_BUTTON_LABEL=
 OPENID_IMAGE_URL=
 # Set to true to automatically redirect to the OpenID provider when a user visits the login page

.github/workflows/generate-release-changelog-pr.yml

@@ -4,6 +4,7 @@ on:
   push:
     tags:
       - 'v*.*.*'
+  workflow_dispatch:
 
 jobs:
   generate-release-changelog-pr:
@@ -88,7 +89,7 @@ jobs:
           base: main
           branch: "changelog/${{ github.ref_name }}"
           reviewers: danny-avila
-          title: "chore: update CHANGELOG for release ${{ github.ref_name }}"
+          title: "📜 docs: Changelog for release ${{ github.ref_name }}"
           body: |
             **Description**:
-            - This PR updates the CHANGELOG.md by removing the "Unreleased" section and adding new release notes for release ${{ github.ref_name }} above previous releases.
+            - This PR updates the CHANGELOG.md by removing the "Unreleased" section and adding new release notes for release ${{ github.ref_name }} above previous releases.

.github/workflows/generate-unreleased-changelog-pr.yml

@@ -3,6 +3,7 @@ name: Generate Unreleased Changelog PR
 on:
   schedule:
     - cron: "0 0 * * 1"  # Runs every Monday at 00:00 UTC
+  workflow_dispatch:
 
 jobs:
   generate-unreleased-changelog-pr:
@@ -98,9 +99,9 @@ jobs:
           branch: "changelog/unreleased-update"
           sign-commits: true
           commit-message: "action: update Unreleased changelog"
-          title: "action: update Unreleased changelog"
+          title: "📜 docs: Unreleased Changelog"
           body: |
             **Description**:
             - This PR updates the Unreleased section in CHANGELOG.md.
             - It compares the current main branch with the latest version tag (determined as ${{ steps.get_latest_tag.outputs.tag }}),
-              regenerates the Unreleased changelog, removes any old Unreleased block, and inserts the new content.
+              regenerates the Unreleased changelog, removes any old Unreleased block, and inserts the new content.

.github/workflows/i18n-unused-keys.yml

@@ -39,12 +39,35 @@ jobs:
           # Check if each key is used in the source code
           for KEY in $KEYS; do
             FOUND=false
-            for DIR in "${SOURCE_DIRS[@]}"; do
-              if grep -r --include=\*.{js,jsx,ts,tsx} -q "$KEY" "$DIR"; then
-                FOUND=true
-                break
+            
+            # Special case for dynamically constructed special variable keys
+            if [[ "$KEY" == com_ui_special_var_* ]]; then
+              # Check if TSpecialVarLabel is used in the codebase
+              for DIR in "${SOURCE_DIRS[@]}"; do
+                if grep -r --include=\*.{js,jsx,ts,tsx} -q "TSpecialVarLabel" "$DIR"; then
+                  FOUND=true
+                  break
+                fi
+              done
+              
+              # Also check if the key is directly used somewhere
+              if [[ "$FOUND" == false ]]; then
+                for DIR in "${SOURCE_DIRS[@]}"; do
+                  if grep -r --include=\*.{js,jsx,ts,tsx} -q "$KEY" "$DIR"; then
+                    FOUND=true
+                    break
+                  fi
+                done
               fi
-            done
+            else
+              # Regular check for other keys
+              for DIR in "${SOURCE_DIRS[@]}"; do
+                if grep -r --include=\*.{js,jsx,ts,tsx} -q "$KEY" "$DIR"; then
+                  FOUND=true
+                  break
+                fi
+              done
+            fi
           
             if [[ "$FOUND" == false ]]; then
               UNUSED_KEYS+=("$KEY")
@@ -90,4 +113,4 @@ jobs:
 
       - name: Fail workflow if unused keys found
         if: env.unused_keys != '[]'
-        run: exit 1
+        run: exit 1

CHANGELOG.md

@@ -2,15 +2,212 @@
 
 All notable changes to this project will be documented in this file.
 
+
+
+
 ## [Unreleased]
 
 ### ✨ New Features
 
-- 🪄 feat: Agent Artifacts by **@danny-avila** in [#5804](https://github.com/danny-avila/LibreChat/pull/5804)
+- ✨ feat: implement search parameter updates by **@mawburn** in [#7151](https://github.com/danny-avila/LibreChat/pull/7151)
+- 🎏 feat: Add MCP support for Streamable HTTP Transport by **@benverhees** in [#7353](https://github.com/danny-avila/LibreChat/pull/7353)
+
+### 🔧 Fixes
+
+- 💬 fix: update aria-label for accessibility in ConvoLink component by **@berry-13** in [#7320](https://github.com/danny-avila/LibreChat/pull/7320)
+- 🔑 fix: use `apiKey` instead of `openAIApiKey` in OpenAI-like Config by **@danny-avila** in [#7337](https://github.com/danny-avila/LibreChat/pull/7337)
+- 🔄 fix: update navigation logic in `useFocusChatEffect` to ensure correct search parameters are used by **@mawburn** in [#7340](https://github.com/danny-avila/LibreChat/pull/7340)
 
 ### ⚙️ Other Changes
 
-- 🔄 chore: Enforce 18next Language Keys by **@rubentalstra** in [#5803](https://github.com/danny-avila/LibreChat/pull/5803)
-- 🔃 refactor: Parent Message ID Handling on Error, Update Translations, Bump Agents by **@danny-avila** in [#5833](https://github.com/danny-avila/LibreChat/pull/5833)
+- 📜 docs: CHANGELOG for release v0.7.8 by **@github-actions[bot]** in [#7290](https://github.com/danny-avila/LibreChat/pull/7290)
+- 📦 chore: Update API Package Dependencies by **@danny-avila** in [#7359](https://github.com/danny-avila/LibreChat/pull/7359)
+
+
+
+---
+## [v0.7.8] - 
+
+Changes from v0.7.8-rc1 to v0.7.8.
+
+### ✨ New Features
+
+- ✨ feat: Enhance form submission for touch screens by **@berry-13** in [#7198](https://github.com/danny-avila/LibreChat/pull/7198)
+- 🔍 feat: Additional Tavily API Tool Parameters by **@glowforge-opensource** in [#7232](https://github.com/danny-avila/LibreChat/pull/7232)
+- 🐋 feat: Add python to Dockerfile for increased MCP compatibility by **@technicalpickles** in [#7270](https://github.com/danny-avila/LibreChat/pull/7270)
+
+### 🔧 Fixes
+
+- 🔧 fix: Google Gemma Support & OpenAI Reasoning Instructions by **@danny-avila** in [#7196](https://github.com/danny-avila/LibreChat/pull/7196)
+- 🛠️ fix: Conversation Navigation State by **@danny-avila** in [#7210](https://github.com/danny-avila/LibreChat/pull/7210)
+- 🔄 fix: o-Series Model Regex for System Messages by **@danny-avila** in [#7245](https://github.com/danny-avila/LibreChat/pull/7245)
+- 🔖 fix: Custom Headers for Initial MCP SSE Connection by **@danny-avila** in [#7246](https://github.com/danny-avila/LibreChat/pull/7246)
+- 🛡️ fix: Deep Clone `MCPOptions` for User MCP Connections by **@danny-avila** in [#7247](https://github.com/danny-avila/LibreChat/pull/7247)
+- 🔄 fix: URL Param Race Condition and File Draft Persistence by **@danny-avila** in [#7257](https://github.com/danny-avila/LibreChat/pull/7257)
+- 🔄 fix: Assistants Endpoint & Minor Issues by **@danny-avila** in [#7274](https://github.com/danny-avila/LibreChat/pull/7274)
+- 🔄 fix: Ollama Think Tag Edge Case with Tools by **@danny-avila** in [#7275](https://github.com/danny-avila/LibreChat/pull/7275)
+
+### ⚙️ Other Changes
+
+- 📜 docs: CHANGELOG for release v0.7.8-rc1 by **@github-actions[bot]** in [#7153](https://github.com/danny-avila/LibreChat/pull/7153)
+- 🔄 refactor: Artifact Visibility Management by **@danny-avila** in [#7181](https://github.com/danny-avila/LibreChat/pull/7181)
+- 📦 chore: Bump Package Security by **@danny-avila** in [#7183](https://github.com/danny-avila/LibreChat/pull/7183)
+- 🌿 refactor: Unmount Fork Popover on Hide for Better Performance by **@danny-avila** in [#7189](https://github.com/danny-avila/LibreChat/pull/7189)
+- 🧰 chore: ESLint configuration to enforce Prettier formatting rules by **@mawburn** in [#7186](https://github.com/danny-avila/LibreChat/pull/7186)
+- 🎨 style: Improve KaTeX Rendering for LaTeX Equations by **@andresgit** in [#7223](https://github.com/danny-avila/LibreChat/pull/7223)
+- 📝 docs: Update `.env.example` Google models by **@marlonka** in [#7254](https://github.com/danny-avila/LibreChat/pull/7254)
+- 💬 refactor: MCP Chat Visibility Option, Google Rates, Remove OpenAPI Plugins by **@danny-avila** in [#7286](https://github.com/danny-avila/LibreChat/pull/7286)
+- 📜 docs: Unreleased Changelog by **@github-actions[bot]** in [#7214](https://github.com/danny-avila/LibreChat/pull/7214)
+
+
+
+[See full release details][release-v0.7.8]
+
+[release-v0.7.8]: https://github.com/danny-avila/LibreChat/releases/tag/v0.7.8
+
+---
+## [v0.7.8-rc1] - 
+## [v0.7.8-rc1] - 
+
+Changes from v0.7.7 to v0.7.8-rc1.
+
+### ✨ New Features
+
+- 🔍 feat: Mistral OCR API / Upload Files as Text by **@danny-avila** in [#6274](https://github.com/danny-avila/LibreChat/pull/6274)
+- 🤖 feat: Support OpenAI Web Search models by **@danny-avila** in [#6313](https://github.com/danny-avila/LibreChat/pull/6313)
+- 🔗 feat: Agent Chain (Mixture-of-Agents) by **@danny-avila** in [#6374](https://github.com/danny-avila/LibreChat/pull/6374)
+- ⌛ feat: `initTimeout` for Slow Starting MCP Servers by **@perweij** in [#6383](https://github.com/danny-avila/LibreChat/pull/6383)
+- 🚀 feat: `S3` Integration for File handling and Image uploads by **@rubentalstra** in [#6142](https://github.com/danny-avila/LibreChat/pull/6142)
+- 🔒feat: Enable OpenID Auto-Redirect by **@leondape** in [#6066](https://github.com/danny-avila/LibreChat/pull/6066)
+- 🚀 feat: Integrate `Azure Blob Storage` for file handling and image uploads by **@rubentalstra** in [#6153](https://github.com/danny-avila/LibreChat/pull/6153)
+- 🚀 feat: Add support for custom `AWS` endpoint in `S3` by **@rubentalstra** in [#6431](https://github.com/danny-avila/LibreChat/pull/6431)
+- 🚀 feat: Add support for LDAP STARTTLS in LDAP authentication by **@rubentalstra** in [#6438](https://github.com/danny-avila/LibreChat/pull/6438)
+- 🚀 feat: Refactor schema exports and update package version to 0.0.4 by **@rubentalstra** in [#6455](https://github.com/danny-avila/LibreChat/pull/6455)
+- 🔼 feat: Add Auto Submit For URL Query Params by **@mjaverto** in [#6440](https://github.com/danny-avila/LibreChat/pull/6440)
+- 🛠 feat: Enhance Redis Integration, Rate Limiters & Log Headers by **@danny-avila** in [#6462](https://github.com/danny-avila/LibreChat/pull/6462)
+- 💵 feat: Add Automatic Balance Refill by **@rubentalstra** in [#6452](https://github.com/danny-avila/LibreChat/pull/6452)
+- 🗣️ feat: add support for gpt-4o-transcribe models by **@berry-13** in [#6483](https://github.com/danny-avila/LibreChat/pull/6483)
+- 🎨 feat: UI Refresh for Enhanced UX by **@berry-13** in [#6346](https://github.com/danny-avila/LibreChat/pull/6346)
+- 🌍 feat: Add support for Hungarian language localization by **@rubentalstra** in [#6508](https://github.com/danny-avila/LibreChat/pull/6508)
+- 🚀 feat: Add Gemini 2.5 Token/Context Values, Increase Max Possible Output to 64k by **@danny-avila** in [#6563](https://github.com/danny-avila/LibreChat/pull/6563)
+- 🚀 feat: Enhance MCP Connections For Multi-User Support by **@danny-avila** in [#6610](https://github.com/danny-avila/LibreChat/pull/6610)
+- 🚀 feat: Enhance S3 URL Expiry with Refresh; fix: S3 File Deletion by **@danny-avila** in [#6647](https://github.com/danny-avila/LibreChat/pull/6647)
+- 🚀 feat: enhance UI components and refactor settings by **@berry-13** in [#6625](https://github.com/danny-avila/LibreChat/pull/6625)
+- 💬 feat: move TemporaryChat to the Header by **@berry-13** in [#6646](https://github.com/danny-avila/LibreChat/pull/6646)
+- 🚀 feat: Use Model Specs + Specific Endpoints, Limit Providers for Agents by **@danny-avila** in [#6650](https://github.com/danny-avila/LibreChat/pull/6650)
+- 🪙 feat: Sync Balance Config on Login by **@danny-avila** in [#6671](https://github.com/danny-avila/LibreChat/pull/6671)
+- 🔦 feat: MCP Support for Non-Agent Endpoints by **@danny-avila** in [#6775](https://github.com/danny-avila/LibreChat/pull/6775)
+- 🗃️ feat: Code Interpreter File Persistence between Sessions by **@danny-avila** in [#6790](https://github.com/danny-avila/LibreChat/pull/6790)
+- 🖥️ feat: Code Interpreter API for Non-Agent Endpoints by **@danny-avila** in [#6803](https://github.com/danny-avila/LibreChat/pull/6803)
+- ⚡ feat: Self-hosted Artifacts Static Bundler URL by **@danny-avila** in [#6827](https://github.com/danny-avila/LibreChat/pull/6827)
+- 🐳 feat: Add Jemalloc and UV to Docker Builds by **@danny-avila** in [#6836](https://github.com/danny-avila/LibreChat/pull/6836)
+- 🤖 feat: GPT-4.1 by **@danny-avila** in [#6880](https://github.com/danny-avila/LibreChat/pull/6880)
+- 👋 feat: remove Edge TTS by **@berry-13** in [#6885](https://github.com/danny-avila/LibreChat/pull/6885)
+- feat: nav optimization  by **@berry-13** in [#5785](https://github.com/danny-avila/LibreChat/pull/5785)
+- 🗺️ feat: Add Parameter Location Mapping for OpenAPI actions by **@peeeteeer** in [#6858](https://github.com/danny-avila/LibreChat/pull/6858)
+- 🤖 feat: Support `o4-mini` and `o3` Models by **@danny-avila** in [#6928](https://github.com/danny-avila/LibreChat/pull/6928)
+- 🎨 feat: OpenAI Image Tools (GPT-Image-1) by **@danny-avila** in [#7079](https://github.com/danny-avila/LibreChat/pull/7079)
+- 🗓️ feat: Add Special Variables for Prompts & Agents, Prompt UI Improvements by **@danny-avila** in [#7123](https://github.com/danny-avila/LibreChat/pull/7123)
+
+### 🌍 Internationalization
+
+- 🌍 i18n: Add Thai Language Support and Update Translations by **@rubentalstra** in [#6219](https://github.com/danny-avila/LibreChat/pull/6219)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6220](https://github.com/danny-avila/LibreChat/pull/6220)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6240](https://github.com/danny-avila/LibreChat/pull/6240)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6241](https://github.com/danny-avila/LibreChat/pull/6241)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6277](https://github.com/danny-avila/LibreChat/pull/6277)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6414](https://github.com/danny-avila/LibreChat/pull/6414)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6505](https://github.com/danny-avila/LibreChat/pull/6505)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6530](https://github.com/danny-avila/LibreChat/pull/6530)
+- 🌍 i18n: Add Persian Localization Support by **@rubentalstra** in [#6669](https://github.com/danny-avila/LibreChat/pull/6669)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#6667](https://github.com/danny-avila/LibreChat/pull/6667)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#7126](https://github.com/danny-avila/LibreChat/pull/7126)
+- 🌍 i18n: Update translation.json with latest translations by **@github-actions[bot]** in [#7148](https://github.com/danny-avila/LibreChat/pull/7148)
+
+### 👐 Accessibility
+
+- 🎨 a11y: Update Model Spec Description Text by **@berry-13** in [#6294](https://github.com/danny-avila/LibreChat/pull/6294)
+- 🗑️ a11y: Add Accessible Name to Button for File Attachment Removal by **@kangabell** in [#6709](https://github.com/danny-avila/LibreChat/pull/6709)
+- ⌨️ a11y: enhance accessibility & visual consistency by **@berry-13** in [#6866](https://github.com/danny-avila/LibreChat/pull/6866)
+- 🙌 a11y: Searchbar/Conversations List Focus by **@danny-avila** in [#7096](https://github.com/danny-avila/LibreChat/pull/7096)
+- 👐 a11y: Improve Fork and SplitText Accessibility by **@danny-avila** in [#7147](https://github.com/danny-avila/LibreChat/pull/7147)
+
+### 🔧 Fixes
+
+- 🐛 fix: Avatar Type Definitions in Agent/Assistant Schemas by **@danny-avila** in [#6235](https://github.com/danny-avila/LibreChat/pull/6235)
+- 🔧 fix: MeiliSearch Field Error and Patch Incorrect Import by #6210 by **@rubentalstra** in [#6245](https://github.com/danny-avila/LibreChat/pull/6245)
+- 🔏 fix: Enhance Two-Factor Authentication by **@rubentalstra** in [#6247](https://github.com/danny-avila/LibreChat/pull/6247)
+- 🐛 fix: Await saveMessage in abortMiddleware to ensure proper execution by **@sh4shii** in [#6248](https://github.com/danny-avila/LibreChat/pull/6248)
+- 🔧 fix: Axios Proxy Usage And Bump `mongoose` by **@danny-avila** in [#6298](https://github.com/danny-avila/LibreChat/pull/6298)
+- 🔧 fix: comment out MCP servers to resolve service run issues by **@KunalScriptz** in [#6316](https://github.com/danny-avila/LibreChat/pull/6316)
+- 🔧 fix: Update Token Calculations and Mapping, MCP `env` Initialization by **@danny-avila** in [#6406](https://github.com/danny-avila/LibreChat/pull/6406)
+- 🐞 fix: Agent "Resend" Message Attachments + Source Icon Styling by **@danny-avila** in [#6408](https://github.com/danny-avila/LibreChat/pull/6408)
+- 🐛 fix: Prevent Crash on Duplicate Message ID by **@Odrec** in [#6392](https://github.com/danny-avila/LibreChat/pull/6392)
+- 🔐 fix: Invalid Key Length in 2FA Encryption by **@rubentalstra** in [#6432](https://github.com/danny-avila/LibreChat/pull/6432)
+- 🏗️ fix: Fix Agents Token Spend Race Conditions, Expand Test Coverage by **@danny-avila** in [#6480](https://github.com/danny-avila/LibreChat/pull/6480)
+- 🔃 fix: Draft Clearing, Claude Titles, Remove Default Vision Max Tokens by **@danny-avila** in [#6501](https://github.com/danny-avila/LibreChat/pull/6501)
+- 🔧 fix: Update username reference to use user.name in greeting display by **@rubentalstra** in [#6534](https://github.com/danny-avila/LibreChat/pull/6534)
+- 🔧 fix: S3 Download Stream with Key Extraction and Blob Storage Encoding for Vision by **@danny-avila** in [#6557](https://github.com/danny-avila/LibreChat/pull/6557)
+- 🔧 fix: Mistral type strictness for `usage` & update token values/windows by **@danny-avila** in [#6562](https://github.com/danny-avila/LibreChat/pull/6562)
+- 🔧 fix: Consolidate Text Parsing and TTS Edge Initialization by **@danny-avila** in [#6582](https://github.com/danny-avila/LibreChat/pull/6582)
+- 🔧 fix: Ensure continuation in image processing on base64 encoding from Blob Storage by **@danny-avila** in [#6619](https://github.com/danny-avila/LibreChat/pull/6619)
+- ✉️ fix: Fallback For User Name In Email Templates by **@danny-avila** in [#6620](https://github.com/danny-avila/LibreChat/pull/6620)
+- 🔧 fix: Azure Blob Integration and File Source References by **@rubentalstra** in [#6575](https://github.com/danny-avila/LibreChat/pull/6575)
+- 🐛 fix: Safeguard against undefined addedEndpoints by **@wipash** in [#6654](https://github.com/danny-avila/LibreChat/pull/6654)
+- 🤖 fix: Gemini 2.5 Vision Support by **@danny-avila** in [#6663](https://github.com/danny-avila/LibreChat/pull/6663)
+- 🔄 fix: Avatar & Error Handling Enhancements by **@danny-avila** in [#6687](https://github.com/danny-avila/LibreChat/pull/6687)
+- 🔧 fix: Chat Middleware, Zod Conversion, Auto-Save and S3 URL Refresh by **@danny-avila** in [#6720](https://github.com/danny-avila/LibreChat/pull/6720)
+- 🔧 fix: Agent Capability Checks & DocumentDB Compatibility for Agent Resource Removal by **@danny-avila** in [#6726](https://github.com/danny-avila/LibreChat/pull/6726)
+- 🔄 fix: Improve audio MIME type detection and handling by **@berry-13** in [#6707](https://github.com/danny-avila/LibreChat/pull/6707)
+- 🪺 fix: Update Role Handling due to New Schema Shape by **@danny-avila** in [#6774](https://github.com/danny-avila/LibreChat/pull/6774)
+- 🗨️ fix: Show ModelSpec Greeting by **@berry-13** in [#6770](https://github.com/danny-avila/LibreChat/pull/6770)
+- 🔧 fix: Keyv and Proxy Issues, and More Memory Optimizations by **@danny-avila** in [#6867](https://github.com/danny-avila/LibreChat/pull/6867)
+- ✨ fix: Implement dynamic text sizing for greeting and name display by **@berry-13** in [#6833](https://github.com/danny-avila/LibreChat/pull/6833)
+- 📝 fix: Mistral OCR Image Support and Azure Agent Titles by **@danny-avila** in [#6901](https://github.com/danny-avila/LibreChat/pull/6901)
+- 📢 fix: Invalid `engineTTS` and Conversation State on Navigation by **@berry-13** in [#6904](https://github.com/danny-avila/LibreChat/pull/6904)
+- 🛠️ fix: Improve Accessibility and Display of Conversation Menu by **@danny-avila** in [#6913](https://github.com/danny-avila/LibreChat/pull/6913)
+- 🔧 fix: Agent Resource Form, Convo Menu Style, Ensure Draft Clears on Submission by **@danny-avila** in [#6925](https://github.com/danny-avila/LibreChat/pull/6925)
+- 🔀 fix: MCP Improvements, Auto-Save Drafts, Artifact Markup by **@danny-avila** in [#7040](https://github.com/danny-avila/LibreChat/pull/7040)
+- 🐋 fix: Improve Deepseek Compatbility by **@danny-avila** in [#7132](https://github.com/danny-avila/LibreChat/pull/7132)
+- 🐙 fix: Add Redis Ping Interval to Prevent Connection Drops by **@peeeteeer** in [#7127](https://github.com/danny-avila/LibreChat/pull/7127)
+
+### ⚙️ Other Changes
+
+- 📦 refactor: Move DB Models to `@librechat/data-schemas` by **@rubentalstra** in [#6210](https://github.com/danny-avila/LibreChat/pull/6210)
+- 📦 chore: Patch `axios` to address CVE-2025-27152 by **@danny-avila** in [#6222](https://github.com/danny-avila/LibreChat/pull/6222)
+- ⚠️ refactor: Use Error Content Part Instead Of Throwing Error for Agents by **@danny-avila** in [#6262](https://github.com/danny-avila/LibreChat/pull/6262)
+- 🏃‍♂️ refactor: Improve Agent Run Context & Misc. Changes by **@danny-avila** in [#6448](https://github.com/danny-avila/LibreChat/pull/6448)
+- 📝 docs: librechat.example.yaml by **@ineiti** in [#6442](https://github.com/danny-avila/LibreChat/pull/6442)
+- 🏃‍♂️ refactor: More Agent Context Improvements during Run by **@danny-avila** in [#6477](https://github.com/danny-avila/LibreChat/pull/6477)
+- 🔃 refactor: Allow streaming for `o1` models by **@danny-avila** in [#6509](https://github.com/danny-avila/LibreChat/pull/6509)
+- 🔧 chore: `Vite` Plugin Upgrades & Config Optimizations by **@rubentalstra** in [#6547](https://github.com/danny-avila/LibreChat/pull/6547)
+- 🔧 refactor: Consolidate Logging, Model Selection & Actions Optimizations, Minor Fixes by **@danny-avila** in [#6553](https://github.com/danny-avila/LibreChat/pull/6553)
+- 🎨 style: Address Minor UI Refresh Issues by **@berry-13** in [#6552](https://github.com/danny-avila/LibreChat/pull/6552)
+- 🔧 refactor: Enhance Model & Endpoint Configurations with Global Indicators 🌍 by **@berry-13** in [#6578](https://github.com/danny-avila/LibreChat/pull/6578)
+- 💬 style: Chat UI, Greeting, and Message adjustments by **@berry-13** in [#6612](https://github.com/danny-avila/LibreChat/pull/6612)
+- ⚡ refactor: DocumentDB Compatibility for Balance Updates by **@danny-avila** in [#6673](https://github.com/danny-avila/LibreChat/pull/6673)
+- 🧹 chore: Update ESLint rules for React hooks by **@rubentalstra** in [#6685](https://github.com/danny-avila/LibreChat/pull/6685)
+- 🪙 chore: Update Gemini Pricing by **@RedwindA** in [#6731](https://github.com/danny-avila/LibreChat/pull/6731)
+- 🪺 refactor: Nest Permission fields for Roles by **@rubentalstra** in [#6487](https://github.com/danny-avila/LibreChat/pull/6487)
+- 📦 chore: Update `caniuse-lite` dependency to version 1.0.30001706 by **@rubentalstra** in [#6482](https://github.com/danny-avila/LibreChat/pull/6482)
+- ⚙️ refactor: OAuth Flow Signal, Type Safety, Tool Progress & Updated Packages by **@danny-avila** in [#6752](https://github.com/danny-avila/LibreChat/pull/6752)
+- 📦 chore: bump vite from 6.2.3 to 6.2.5 by **@dependabot[bot]** in [#6745](https://github.com/danny-avila/LibreChat/pull/6745)
+- 💾 chore: Enhance Local Storage Handling and Update MCP SDK by **@danny-avila** in [#6809](https://github.com/danny-avila/LibreChat/pull/6809)
+- 🤖 refactor: Improve Agents Memory Usage, Bump Keyv, Grok 3 by **@danny-avila** in [#6850](https://github.com/danny-avila/LibreChat/pull/6850)
+- 💾 refactor: Enhance Memory In Image Encodings & Client Disposal by **@danny-avila** in [#6852](https://github.com/danny-avila/LibreChat/pull/6852)
+- 🔁 refactor: Token Event Handler and Standardize `maxTokens` Key by **@danny-avila** in [#6886](https://github.com/danny-avila/LibreChat/pull/6886)
+- 🔍 refactor: Search & Message Retrieval by **@berry-13** in [#6903](https://github.com/danny-avila/LibreChat/pull/6903)
+- 🎨 style: standardize dropdown styling & fix z-Index layering by **@berry-13** in [#6939](https://github.com/danny-avila/LibreChat/pull/6939)
+- 📙 docs: CONTRIBUTING.md by **@dblock** in [#6831](https://github.com/danny-avila/LibreChat/pull/6831)
+- 🧭 refactor: Modernize Nav/Header by **@danny-avila** in [#7094](https://github.com/danny-avila/LibreChat/pull/7094)
+- 🪶 refactor: Chat Input Focus for Conversation Navigations & ChatForm Optimizations by **@danny-avila** in [#7100](https://github.com/danny-avila/LibreChat/pull/7100)
+- 🔃 refactor: Streamline Navigation, Message Loading UX by **@danny-avila** in [#7118](https://github.com/danny-avila/LibreChat/pull/7118)
+- 📜 docs: Unreleased changelog by **@github-actions[bot]** in [#6265](https://github.com/danny-avila/LibreChat/pull/6265)
+
+
+
+[See full release details][release-v0.7.8-rc1]
+
+[release-v0.7.8-rc1]: https://github.com/danny-avila/LibreChat/releases/tag/v0.7.8-rc1
 
 ---

Dockerfile

@@ -1,10 +1,11 @@
-# v0.7.7
+# v0.7.8
 
 # Base node image
 FROM node:20-alpine AS node
 
 # Install jemalloc
 RUN apk add --no-cache jemalloc
+RUN apk add --no-cache python3 py3-pip uv
 
 # Set environment variable to use jemalloc
 ENV LD_PRELOAD=/usr/lib/libjemalloc.so.2

Dockerfile.multi

@@ -1,5 +1,5 @@
 # Dockerfile.multi
-# v0.7.7
+# v0.7.8
 
 # Base for all builds
 FROM node:20-alpine AS base-min

api/app/clients/AnthropicClient.js

@@ -396,13 +396,13 @@ class AnthropicClient extends BaseClient {
     const formattedMessages = orderedMessages.map((message, i) => {
       const formattedMessage = this.useMessages
         ? formatMessage({
-          message,
-          endpoint: EModelEndpoint.anthropic,
-        })
+            message,
+            endpoint: EModelEndpoint.anthropic,
+          })
         : {
-          author: message.isCreatedByUser ? this.userLabel : this.assistantLabel,
-          content: message?.content ?? message.text,
-        };
+            author: message.isCreatedByUser ? this.userLabel : this.assistantLabel,
+            content: message?.content ?? message.text,
+          };
 
       const needsTokenCount = this.contextStrategy && !orderedMessages[i].tokenCount;
       /* If tokens were never counted, or, is a Vision request and the message has files, count again */
@@ -418,6 +418,9 @@ class AnthropicClient extends BaseClient {
             this.contextHandlers?.processFile(file);
             continue;
           }
+          if (file.metadata?.fileIdentifier) {
+            continue;
+          }
 
           orderedMessages[i].tokenCount += this.calculateImageTokenCost({
             width: file.width,
@@ -677,7 +680,7 @@ class AnthropicClient extends BaseClient {
   }
 
   getCompletion() {
-    logger.debug('AnthropicClient doesn\'t use getCompletion (all handled in sendCompletion)');
+    logger.debug("AnthropicClient doesn't use getCompletion (all handled in sendCompletion)");
   }
 
   /**
@@ -885,7 +888,7 @@ class AnthropicClient extends BaseClient {
   }
 
   getBuildMessagesOptions() {
-    logger.debug('AnthropicClient doesn\'t use getBuildMessagesOptions');
+    logger.debug("AnthropicClient doesn't use getBuildMessagesOptions");
   }
 
   getEncoding() {

api/app/clients/BaseClient.js

@@ -63,15 +63,15 @@ class BaseClient {
   }
 
   setOptions() {
-    throw new Error('Method \'setOptions\' must be implemented.');
+    throw new Error("Method 'setOptions' must be implemented.");
   }
 
   async getCompletion() {
-    throw new Error('Method \'getCompletion\' must be implemented.');
+    throw new Error("Method 'getCompletion' must be implemented.");
   }
 
   async sendCompletion() {
-    throw new Error('Method \'sendCompletion\' must be implemented.');
+    throw new Error("Method 'sendCompletion' must be implemented.");
   }
 
   getSaveOptions() {
@@ -237,11 +237,11 @@ class BaseClient {
     const userMessage = opts.isEdited
       ? this.currentMessages[this.currentMessages.length - 2]
       : this.createUserMessage({
-        messageId: userMessageId,
-        parentMessageId,
-        conversationId,
-        text: message,
-      });
+          messageId: userMessageId,
+          parentMessageId,
+          conversationId,
+          text: message,
+        });
 
     if (typeof opts?.getReqData === 'function') {
       opts.getReqData({

api/app/clients/GoogleClient.js

@@ -140,8 +140,7 @@ class GoogleClient extends BaseClient {
     this.options.attachments?.then((attachments) => this.checkVisionRequest(attachments));
 
     /** @type {boolean} Whether using a "GenerativeAI" Model */
-    this.isGenerativeModel =
-      this.modelOptions.model.includes('gemini') || this.modelOptions.model.includes('learnlm');
+    this.isGenerativeModel = /gemini|learnlm|gemma/.test(this.modelOptions.model);
 
     this.maxContextTokens =
       this.options.maxContextTokens ??
@@ -318,6 +317,9 @@ class GoogleClient extends BaseClient {
           this.contextHandlers?.processFile(file);
           continue;
         }
+        if (file.metadata?.fileIdentifier) {
+          continue;
+        }
       }
 
       this.augmentedPrompt = await this.contextHandlers.createContext();

api/app/clients/OpenAIClient.js

@@ -455,6 +455,9 @@ class OpenAIClient extends BaseClient {
             this.contextHandlers?.processFile(file);
             continue;
           }
+          if (file.metadata?.fileIdentifier) {
+            continue;
+          }
 
           orderedMessages[i].tokenCount += this.calculateImageTokenCost({
             width: file.width,
@@ -472,7 +475,9 @@ class OpenAIClient extends BaseClient {
       promptPrefix = this.augmentedPrompt + promptPrefix;
     }
 
-    if (promptPrefix && this.isOmni !== true) {
+    const noSystemModelRegex = /\b(o1-preview|o1-mini)\b/i.test(this.modelOptions.model);
+
+    if (promptPrefix && !noSystemModelRegex) {
       promptPrefix = `Instructions:\n${promptPrefix.trim()}`;
       instructions = {
         role: 'system',
@@ -500,7 +505,7 @@ class OpenAIClient extends BaseClient {
     };
 
     /** EXPERIMENTAL */
-    if (promptPrefix && this.isOmni === true) {
+    if (promptPrefix && noSystemModelRegex) {
       const lastUserMessageIndex = payload.findLastIndex((message) => message.role === 'user');
       if (lastUserMessageIndex !== -1) {
         if (Array.isArray(payload[lastUserMessageIndex].content)) {
@@ -1224,9 +1229,9 @@ ${convo}
 
         opts.baseURL = this.langchainProxy
           ? constructAzureURL({
-            baseURL: this.langchainProxy,
-            azureOptions: this.azure,
-          })
+              baseURL: this.langchainProxy,
+              azureOptions: this.azure,
+            })
           : this.azureEndpoint.split(/(?<!\/)\/(chat|completion)\//)[0];
 
         opts.defaultQuery = { 'api-version': this.azure.azureOpenAIApiVersion };
@@ -1280,6 +1285,14 @@ ${convo}
         modelOptions.messages[0].role = 'user';
       }
 
+      if (
+        (this.options.endpoint === EModelEndpoint.openAI ||
+          this.options.endpoint === EModelEndpoint.azureOpenAI) &&
+        modelOptions.stream === true
+      ) {
+        modelOptions.stream_options = { include_usage: true };
+      }
+
       if (this.options.addParams && typeof this.options.addParams === 'object') {
         const addParams = { ...this.options.addParams };
         modelOptions = {
@@ -1382,12 +1395,6 @@ ${convo}
           ...modelOptions,
           stream: true,
         };
-        if (
-          this.options.endpoint === EModelEndpoint.openAI ||
-          this.options.endpoint === EModelEndpoint.azureOpenAI
-        ) {
-          params.stream_options = { include_usage: true };
-        }
         const stream = await openai.beta.chat.completions
           .stream(params)
           .on('abort', () => {

api/app/clients/tools/structured/TavilySearchResults.js

@@ -43,9 +43,39 @@ class TavilySearchResults extends Tool {
         .boolean()
         .optional()
         .describe('Whether to include answers in the search results. Default is False.'),
-      // include_raw_content: z.boolean().optional().describe('Whether to include raw content in the search results. Default is False.'),
-      // include_domains: z.array(z.string()).optional().describe('A list of domains to specifically include in the search results.'),
-      // exclude_domains: z.array(z.string()).optional().describe('A list of domains to specifically exclude from the search results.'),
+      include_raw_content: z
+        .boolean()
+        .optional()
+        .describe('Whether to include raw content in the search results. Default is False.'),
+      include_domains: z
+        .array(z.string())
+        .optional()
+        .describe('A list of domains to specifically include in the search results.'),
+      exclude_domains: z
+        .array(z.string())
+        .optional()
+        .describe('A list of domains to specifically exclude from the search results.'),
+      topic: z
+        .enum(['general', 'news', 'finance'])
+        .optional()
+        .describe(
+          'The category of the search. Use news ONLY if query SPECIFCALLY mentions the word "news".',
+        ),
+      time_range: z
+        .enum(['day', 'week', 'month', 'year', 'd', 'w', 'm', 'y'])
+        .optional()
+        .describe('The time range back from the current date to filter results.'),
+      days: z
+        .number()
+        .min(1)
+        .optional()
+        .describe('Number of days back from the current date to include. Only if topic is news.'),
+      include_image_descriptions: z
+        .boolean()
+        .optional()
+        .describe(
+          'When include_images is true, also add a descriptive text for each image. Default is false.',
+        ),
     });
   }
 

api/app/clients/tools/util/addOpenAPISpecs.js

@@ -1,30 +0,0 @@
-const { loadSpecs } = require('./loadSpecs');
-
-function transformSpec(input) {
-  return {
-    name: input.name_for_human,
-    pluginKey: input.name_for_model,
-    description: input.description_for_human,
-    icon: input?.logo_url ?? 'https://placehold.co/70x70.png',
-    // TODO: add support for authentication
-    isAuthRequired: 'false',
-    authConfig: [],
-  };
-}
-
-async function addOpenAPISpecs(availableTools) {
-  try {
-    const specs = (await loadSpecs({})).map(transformSpec);
-    if (specs.length > 0) {
-      return [...specs, ...availableTools];
-    }
-    return availableTools;
-  } catch (error) {
-    return availableTools;
-  }
-}
-
-module.exports = {
-  transformSpec,
-  addOpenAPISpecs,
-};

api/app/clients/tools/util/addOpenAPISpecs.spec.js

@@ -1,76 +0,0 @@
-const { addOpenAPISpecs, transformSpec } = require('./addOpenAPISpecs');
-const { loadSpecs } = require('./loadSpecs');
-const { createOpenAPIPlugin } = require('../dynamic/OpenAPIPlugin');
-
-jest.mock('./loadSpecs');
-jest.mock('../dynamic/OpenAPIPlugin');
-
-describe('transformSpec', () => {
-  it('should transform input spec to a desired format', () => {
-    const input = {
-      name_for_human: 'Human Name',
-      name_for_model: 'Model Name',
-      description_for_human: 'Human Description',
-      logo_url: 'https://example.com/logo.png',
-    };
-
-    const expectedOutput = {
-      name: 'Human Name',
-      pluginKey: 'Model Name',
-      description: 'Human Description',
-      icon: 'https://example.com/logo.png',
-      isAuthRequired: 'false',
-      authConfig: [],
-    };
-
-    expect(transformSpec(input)).toEqual(expectedOutput);
-  });
-
-  it('should use default icon if logo_url is not provided', () => {
-    const input = {
-      name_for_human: 'Human Name',
-      name_for_model: 'Model Name',
-      description_for_human: 'Human Description',
-    };
-
-    const expectedOutput = {
-      name: 'Human Name',
-      pluginKey: 'Model Name',
-      description: 'Human Description',
-      icon: 'https://placehold.co/70x70.png',
-      isAuthRequired: 'false',
-      authConfig: [],
-    };
-
-    expect(transformSpec(input)).toEqual(expectedOutput);
-  });
-});
-
-describe('addOpenAPISpecs', () => {
-  it('should add specs to available tools', async () => {
-    const availableTools = ['Tool1', 'Tool2'];
-    const specs = [
-      {
-        name_for_human: 'Human Name',
-        name_for_model: 'Model Name',
-        description_for_human: 'Human Description',
-        logo_url: 'https://example.com/logo.png',
-      },
-    ];
-
-    loadSpecs.mockResolvedValue(specs);
-    createOpenAPIPlugin.mockReturnValue('Plugin');
-
-    const result = await addOpenAPISpecs(availableTools);
-    expect(result).toEqual([...specs.map(transformSpec), ...availableTools]);
-  });
-
-  it('should return available tools if specs loading fails', async () => {
-    const availableTools = ['Tool1', 'Tool2'];
-
-    loadSpecs.mockRejectedValue(new Error('Failed to load specs'));
-
-    const result = await addOpenAPISpecs(availableTools);
-    expect(result).toEqual(availableTools);
-  });
-});

api/app/clients/tools/util/handleTools.js

@@ -24,7 +24,6 @@ const { primeFiles: primeCodeFiles } = require('~/server/services/Files/Code/pro
 const { createFileSearchTool, primeFiles: primeSearchFiles } = require('./fileSearch');
 const { loadAuthValues } = require('~/server/services/Tools/credentials');
 const { createMCPTool } = require('~/server/services/MCP');
-const { loadSpecs } = require('./loadSpecs');
 const { logger } = require('~/config');
 
 const mcpToolPattern = new RegExp(`^.+${Constants.mcp_delimiter}.+$`);
@@ -232,7 +231,6 @@ const loadTools = async ({
 
   /** @type {Record<string, string>} */
   const toolContextMap = {};
-  const remainingTools = [];
   const appTools = options.req?.app?.locals?.availableTools ?? {};
 
   for (const tool of tools) {
@@ -292,30 +290,6 @@ const loadTools = async ({
       requestedTools[tool] = toolInstance;
       continue;
     }
-
-    if (functions === true) {
-      remainingTools.push(tool);
-    }
-  }
-
-  let specs = null;
-  if (useSpecs === true && functions === true && remainingTools.length > 0) {
-    specs = await loadSpecs({
-      llm: model,
-      user,
-      message: options.message,
-      memory: options.memory,
-      signal: options.signal,
-      tools: remainingTools,
-      map: true,
-      verbose: false,
-    });
-  }
-
-  for (const tool of remainingTools) {
-    if (specs && specs[tool]) {
-      requestedTools[tool] = specs[tool];
-    }
   }
 
   if (returnMap) {

api/app/clients/tools/util/loadSpecs.js

@@ -1,117 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const { z } = require('zod');
-const { logger } = require('~/config');
-const { createOpenAPIPlugin } = require('~/app/clients/tools/dynamic/OpenAPIPlugin');
-
-// The minimum Manifest definition
-const ManifestDefinition = z.object({
-  schema_version: z.string().optional(),
-  name_for_human: z.string(),
-  name_for_model: z.string(),
-  description_for_human: z.string(),
-  description_for_model: z.string(),
-  auth: z.object({}).optional(),
-  api: z.object({
-    // Spec URL or can be the filename of the OpenAPI spec yaml file,
-    // located in api\app\clients\tools\.well-known\openapi
-    url: z.string(),
-    type: z.string().optional(),
-    is_user_authenticated: z.boolean().nullable().optional(),
-    has_user_authentication: z.boolean().nullable().optional(),
-  }),
-  // use to override any params that the LLM will consistently get wrong
-  params: z.object({}).optional(),
-  logo_url: z.string().optional(),
-  contact_email: z.string().optional(),
-  legal_info_url: z.string().optional(),
-});
-
-function validateJson(json) {
-  try {
-    return ManifestDefinition.parse(json);
-  } catch (error) {
-    logger.debug('[validateJson] manifest parsing error', error);
-    return false;
-  }
-}
-
-// omit the LLM to return the well known jsons as objects
-async function loadSpecs({ llm, user, message, tools = [], map = false, memory, signal }) {
-  const directoryPath = path.join(__dirname, '..', '.well-known');
-  let files = [];
-
-  for (let i = 0; i < tools.length; i++) {
-    const filePath = path.join(directoryPath, tools[i] + '.json');
-
-    try {
-      // If the access Promise is resolved, it means that the file exists
-      // Then we can add it to the files array
-      await fs.promises.access(filePath, fs.constants.F_OK);
-      files.push(tools[i] + '.json');
-    } catch (err) {
-      logger.error(`[loadSpecs] File ${tools[i] + '.json'} does not exist`, err);
-    }
-  }
-
-  if (files.length === 0) {
-    files = (await fs.promises.readdir(directoryPath)).filter(
-      (file) => path.extname(file) === '.json',
-    );
-  }
-
-  const validJsons = [];
-  const constructorMap = {};
-
-  logger.debug('[validateJson] files', files);
-
-  for (const file of files) {
-    if (path.extname(file) === '.json') {
-      const filePath = path.join(directoryPath, file);
-      const fileContent = await fs.promises.readFile(filePath, 'utf8');
-      const json = JSON.parse(fileContent);
-
-      if (!validateJson(json)) {
-        logger.debug('[validateJson] Invalid json', json);
-        continue;
-      }
-
-      if (llm && map) {
-        constructorMap[json.name_for_model] = async () =>
-          await createOpenAPIPlugin({
-            data: json,
-            llm,
-            message,
-            memory,
-            signal,
-            user,
-          });
-        continue;
-      }
-
-      if (llm) {
-        validJsons.push(createOpenAPIPlugin({ data: json, llm }));
-        continue;
-      }
-
-      validJsons.push(json);
-    }
-  }
-
-  if (map) {
-    return constructorMap;
-  }
-
-  const plugins = (await Promise.all(validJsons)).filter((plugin) => plugin);
-
-  //   logger.debug('[validateJson] plugins', plugins);
-  //   logger.debug(plugins[0].name);
-
-  return plugins;
-}
-
-module.exports = {
-  loadSpecs,
-  validateJson,
-  ManifestDefinition,
-};

api/app/clients/tools/util/loadSpecs.spec.js

@@ -1,101 +0,0 @@
-const fs = require('fs');
-const { validateJson, loadSpecs, ManifestDefinition } = require('./loadSpecs');
-const { createOpenAPIPlugin } = require('../dynamic/OpenAPIPlugin');
-
-jest.mock('../dynamic/OpenAPIPlugin');
-
-describe('ManifestDefinition', () => {
-  it('should validate correct json', () => {
-    const json = {
-      name_for_human: 'Test',
-      name_for_model: 'Test',
-      description_for_human: 'Test',
-      description_for_model: 'Test',
-      api: {
-        url: 'http://test.com',
-      },
-    };
-
-    expect(() => ManifestDefinition.parse(json)).not.toThrow();
-  });
-
-  it('should not validate incorrect json', () => {
-    const json = {
-      name_for_human: 'Test',
-      name_for_model: 'Test',
-      description_for_human: 'Test',
-      description_for_model: 'Test',
-      api: {
-        url: 123, // incorrect type
-      },
-    };
-
-    expect(() => ManifestDefinition.parse(json)).toThrow();
-  });
-});
-
-describe('validateJson', () => {
-  it('should return parsed json if valid', () => {
-    const json = {
-      name_for_human: 'Test',
-      name_for_model: 'Test',
-      description_for_human: 'Test',
-      description_for_model: 'Test',
-      api: {
-        url: 'http://test.com',
-      },
-    };
-
-    expect(validateJson(json)).toEqual(json);
-  });
-
-  it('should return false if json is not valid', () => {
-    const json = {
-      name_for_human: 'Test',
-      name_for_model: 'Test',
-      description_for_human: 'Test',
-      description_for_model: 'Test',
-      api: {
-        url: 123, // incorrect type
-      },
-    };
-
-    expect(validateJson(json)).toEqual(false);
-  });
-});
-
-describe('loadSpecs', () => {
-  beforeEach(() => {
-    jest.spyOn(fs.promises, 'readdir').mockResolvedValue(['test.json']);
-    jest.spyOn(fs.promises, 'readFile').mockResolvedValue(
-      JSON.stringify({
-        name_for_human: 'Test',
-        name_for_model: 'Test',
-        description_for_human: 'Test',
-        description_for_model: 'Test',
-        api: {
-          url: 'http://test.com',
-        },
-      }),
-    );
-    createOpenAPIPlugin.mockResolvedValue({});
-  });
-
-  afterEach(() => {
-    jest.restoreAllMocks();
-  });
-
-  it('should return plugins', async () => {
-    const plugins = await loadSpecs({ llm: true, verbose: false });
-
-    expect(plugins).toHaveLength(1);
-    expect(createOpenAPIPlugin).toHaveBeenCalledTimes(1);
-  });
-
-  it('should return constructorMap if map is true', async () => {
-    const plugins = await loadSpecs({ llm: {}, map: true, verbose: false });
-
-    expect(plugins).toHaveProperty('Test');
-    expect(createOpenAPIPlugin).not.toHaveBeenCalled();
-  });
-});

api/cache/keyvRedis.js

@@ -75,6 +75,12 @@ if (REDIS_URI && isEnabled(USE_REDIS)) {
   } else {
     keyvRedis = new KeyvRedis(REDIS_URI, keyvOpts);
   }
+
+  const pingInterval = setInterval(() => {
+    logger.debug('KeyvRedis ping');
+    keyvRedis.client.ping().catch(err => logger.error('Redis keep-alive ping failed:', err));
+  }, 5 * 60 * 1000);
+
   keyvRedis.on('ready', () => {
     logger.info('KeyvRedis connection ready');
   });
@@ -85,6 +91,7 @@ if (REDIS_URI && isEnabled(USE_REDIS)) {
     logger.info('KeyvRedis connection ended');
   });
   keyvRedis.on('close', () => {
+    clearInterval(pingInterval);
     logger.info('KeyvRedis connection closed');
   });
   keyvRedis.on('error', (err) => logger.error('KeyvRedis connection error:', err));

api/models/Agent.js

@@ -308,7 +308,7 @@ const getListAgents = async (searchParameter) => {
  * This function also updates the corresponding projects to include or exclude the agent ID.
  *
  * @param {Object} params - Parameters for updating the agent's projects.
- * @param {import('librechat-data-provider').TUser} params.user - Parameters for updating the agent's projects.
+ * @param {MongoUser} params.user - Parameters for updating the agent's projects.
  * @param {string} params.agentId - The ID of the agent to update.
  * @param {string[]} [params.projectIds] - Array of project IDs to add to the agent.
  * @param {string[]} [params.removeProjectIds] - Array of project IDs to remove from the agent.

api/models/Message.js

@@ -61,6 +61,14 @@ async function saveMessage(req, params, metadata) {
       update.expiredAt = null;
     }
 
+    if (update.tokenCount != null && isNaN(update.tokenCount)) {
+      logger.warn(
+        `Resetting invalid \`tokenCount\` for message \`${params.messageId}\`: ${update.tokenCount}`,
+      );
+      logger.info(`---\`saveMessage\` context: ${metadata?.context}`);
+      update.tokenCount = 0;
+    }
+
     const message = await Message.findOneAndUpdate(
       { messageId: params.messageId, user: req.user.id },
       update,
@@ -97,7 +105,9 @@ async function saveMessage(req, params, metadata) {
         };
       } catch (findError) {
         // If the findOne also fails, log it but don't crash
-        logger.warn(`Could not retrieve existing message with ID ${params.messageId}: ${findError.message}`);
+        logger.warn(
+          `Could not retrieve existing message with ID ${params.messageId}: ${findError.message}`,
+        );
         return {
           ...params,
           messageId: params.messageId,

api/models/tx.js

@@ -111,10 +111,15 @@ const tokenValues = Object.assign(
     /* cohere doesn't have rates for the older command models,
   so this was from https://artificialanalysis.ai/models/command-light/providers */
     command: { prompt: 0.38, completion: 0.38 },
+    gemma: { prompt: 0, completion: 0 }, // https://ai.google.dev/pricing
+    'gemma-2': { prompt: 0, completion: 0 }, // https://ai.google.dev/pricing
+    'gemma-3': { prompt: 0, completion: 0 }, // https://ai.google.dev/pricing
+    'gemma-3-27b': { prompt: 0, completion: 0 }, // https://ai.google.dev/pricing
     'gemini-2.0-flash-lite': { prompt: 0.075, completion: 0.3 },
     'gemini-2.0-flash': { prompt: 0.1, completion: 0.4 },
     'gemini-2.0': { prompt: 0, completion: 0 }, // https://ai.google.dev/pricing
-    'gemini-2.5-pro-preview-03-25': { prompt: 1.25, completion: 10 },
+    'gemini-2.5-pro': { prompt: 1.25, completion: 10 },
+    'gemini-2.5-flash': { prompt: 0.15, completion: 3.5 },
     'gemini-2.5': { prompt: 0, completion: 0 }, // Free for a period of time
     'gemini-1.5-flash-8b': { prompt: 0.075, completion: 0.3 },
     'gemini-1.5-flash': { prompt: 0.15, completion: 0.6 },

api/models/tx.spec.js

@@ -488,6 +488,9 @@ describe('getCacheMultiplier', () => {
 
 describe('Google Model Tests', () => {
   const googleModels = [
+    'gemini-2.5-pro-preview-05-06',
+    'gemini-2.5-flash-preview-04-17',
+    'gemini-2.5-exp',
     'gemini-2.0-flash-lite-preview-02-05',
     'gemini-2.0-flash-001',
     'gemini-2.0-flash-exp',
@@ -525,6 +528,9 @@ describe('Google Model Tests', () => {
 
   it('should map to the correct model keys', () => {
     const expected = {
+      'gemini-2.5-pro-preview-05-06': 'gemini-2.5-pro',
+      'gemini-2.5-flash-preview-04-17': 'gemini-2.5-flash',
+      'gemini-2.5-exp': 'gemini-2.5',
       'gemini-2.0-flash-lite-preview-02-05': 'gemini-2.0-flash-lite',
       'gemini-2.0-flash-001': 'gemini-2.0-flash',
       'gemini-2.0-flash-exp': 'gemini-2.0-flash',

api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@librechat/backend",
-  "version": "v0.7.7",
+  "version": "v0.7.8",
   "description": "",
   "scripts": {
     "start": "echo 'please run this from the root directory'",
@@ -43,14 +43,15 @@
     "@google/generative-ai": "^0.23.0",
     "@googleapis/youtube": "^20.0.0",
     "@keyv/redis": "^4.3.3",
-    "@langchain/community": "^0.3.39",
-    "@langchain/core": "^0.3.43",
-    "@langchain/google-genai": "^0.2.2",
-    "@langchain/google-vertexai": "^0.2.3",
+    "@langchain/community": "^0.3.42",
+    "@langchain/core": "^0.3.55",
+    "@langchain/google-genai": "^0.2.8",
+    "@langchain/google-vertexai": "^0.2.8",
     "@langchain/textsplitters": "^0.1.0",
-    "@librechat/agents": "^2.4.22",
+    "@librechat/agents": "^2.4.317",
     "@librechat/data-schemas": "*",
     "@waylaidwanderer/fetch-event-source": "^3.0.1",
+    "@microsoft/microsoft-graph-client": "^3.0.7",
     "axios": "^1.8.2",
     "bcryptjs": "^2.4.3",
     "cohere-ai": "^7.9.1",
@@ -90,9 +91,9 @@
     "nanoid": "^3.3.7",
     "nodemailer": "^6.9.15",
     "ollama": "^0.5.0",
-    "openai": "^4.47.1",
+    "openai": "^4.96.2",
     "openai-chat-tokens": "^0.2.8",
-    "openid-client": "^5.4.2",
+    "openid-client": "^5.7.1",
     "passport": "^0.6.0",
     "passport-apple": "^2.0.2",
     "passport-discord": "^0.1.4",
@@ -116,6 +117,6 @@
     "jest": "^29.7.0",
     "mongodb-memory-server": "^10.1.3",
     "nodemon": "^3.0.3",
-    "supertest": "^7.0.0"
+    "supertest": "^7.1.0"
   }
 }

api/server/controllers/AskController.js

@@ -128,7 +128,7 @@ const AskController = async (req, res, next, initializeClient, addTitle) => {
     clientRef = new WeakRef(client);
 
     getAbortData = () => {
-      const currentClient = clientRef.deref();
+      const currentClient = clientRef?.deref();
       const currentText =
         currentClient?.getStreamText != null ? currentClient.getStreamText() : getPartialText();
 
@@ -228,7 +228,7 @@ const AskController = async (req, res, next, initializeClient, addTitle) => {
 
     if (!client?.skipSaveUserMessage && latestUserMessage) {
       await saveMessage(req, latestUserMessage, {
-        context: 'api/server/controllers/AskController.js - don\'t skip saving user message',
+        context: "api/server/controllers/AskController.js - don't skip saving user message",
       });
     }
 
@@ -255,7 +255,7 @@ const AskController = async (req, res, next, initializeClient, addTitle) => {
     logger.error('[AskController] Error handling request', error);
     let partialText = '';
     try {
-      const currentClient = clientRef.deref();
+      const currentClient = clientRef?.deref();
       partialText =
         currentClient?.getStreamText != null ? currentClient.getStreamText() : getPartialText();
     } catch (getTextError) {
@@ -268,6 +268,7 @@ const AskController = async (req, res, next, initializeClient, addTitle) => {
       conversationId: reqDataContext.conversationId,
       messageId: reqDataContext.responseMessageId,
       parentMessageId: overrideParentMessageId ?? reqDataContext.userMessageId ?? parentMessageId,
+      userMessageId: reqDataContext.userMessageId,
     })
       .catch((err) => {
         logger.error('[AskController] Error in `handleAbortError` during catch block', err);

api/server/controllers/EditController.js

@@ -123,7 +123,7 @@ const EditController = async (req, res, next, initializeClient) => {
     clientRef = new WeakRef(client);
 
     getAbortData = () => {
-      const currentClient = clientRef.deref();
+      const currentClient = clientRef?.deref();
       const currentText =
         currentClient?.getStreamText != null ? currentClient.getStreamText() : getPartialText();
 
@@ -219,7 +219,7 @@ const EditController = async (req, res, next, initializeClient) => {
     logger.error('[EditController] Error handling request', error);
     let partialText = '';
     try {
-      const currentClient = clientRef.deref();
+      const currentClient = clientRef?.deref();
       partialText =
         currentClient?.getStreamText != null ? currentClient.getStreamText() : getPartialText();
     } catch (getTextError) {
@@ -232,6 +232,7 @@ const EditController = async (req, res, next, initializeClient) => {
       conversationId,
       messageId: reqDataContext.responseMessageId,
       parentMessageId: overrideParentMessageId ?? userMessageId ?? parentMessageId,
+      userMessageId,
     })
       .catch((err) => {
         logger.error('[EditController] Error in `handleAbortError` during catch block', err);

api/server/controllers/PluginController.js

@@ -1,5 +1,5 @@
 const { CacheKeys, AuthType } = require('librechat-data-provider');
-const { addOpenAPISpecs } = require('~/app/clients/tools/util/addOpenAPISpecs');
+const { getToolkitKey } = require('~/server/services/ToolService');
 const { getCustomConfig } = require('~/server/services/Config');
 const { availableTools } = require('~/app/clients/tools');
 const { getMCPManager } = require('~/config');
@@ -69,7 +69,7 @@ const getAvailablePluginsController = async (req, res) => {
       );
     }
 
-    let plugins = await addOpenAPISpecs(authenticatedPlugins);
+    let plugins = authenticatedPlugins;
 
     if (includedTools.length > 0) {
       plugins = plugins.filter((plugin) => includedTools.includes(plugin.pluginKey));
@@ -105,11 +105,11 @@ const getAvailableTools = async (req, res) => {
       return;
     }
 
-    const pluginManifest = availableTools;
+    let pluginManifest = availableTools;
     const customConfig = await getCustomConfig();
     if (customConfig?.mcpServers != null) {
       const mcpManager = getMCPManager();
-      await mcpManager.loadManifestTools(pluginManifest);
+      pluginManifest = await mcpManager.loadManifestTools(pluginManifest);
     }
 
     /** @type {TPlugin[]} */
@@ -128,7 +128,7 @@ const getAvailableTools = async (req, res) => {
       (plugin) =>
         toolDefinitions[plugin.pluginKey] !== undefined ||
         (plugin.toolkit === true &&
-          Object.keys(toolDefinitions).some((key) => key.startsWith(`${plugin.pluginKey}_`))),
+          Object.keys(toolDefinitions).some((key) => getToolkitKey(key) === plugin.pluginKey)),
     );
 
     await cache.set(CacheKeys.TOOLS, tools);

api/server/controllers/agents/callbacks.js

@@ -14,15 +14,6 @@ const { loadAuthValues } = require('~/server/services/Tools/credentials');
 const { saveBase64Image } = require('~/server/services/Files/process');
 const { logger, sendEvent } = require('~/config');
 
-/** @typedef {import('@librechat/agents').Graph} Graph */
-/** @typedef {import('@librechat/agents').EventHandler} EventHandler */
-/** @typedef {import('@librechat/agents').ModelEndData} ModelEndData */
-/** @typedef {import('@librechat/agents').ToolEndData} ToolEndData */
-/** @typedef {import('@librechat/agents').ToolEndCallback} ToolEndCallback */
-/** @typedef {import('@librechat/agents').ChatModelStreamHandler} ChatModelStreamHandler */
-/** @typedef {import('@librechat/agents').ContentAggregatorResult['aggregateContent']} ContentAggregator */
-/** @typedef {import('@librechat/agents').GraphEvents} GraphEvents */
-
 class ModelEndHandler {
   /**
    * @param {Array<UsageMetadata>} collectedUsage
@@ -38,7 +29,7 @@ class ModelEndHandler {
    * @param {string} event
    * @param {ModelEndData | undefined} data
    * @param {Record<string, unknown> | undefined} metadata
-   * @param {Graph} graph
+   * @param {StandardGraph} graph
    * @returns
    */
   handle(event, data, metadata, graph) {
@@ -61,7 +52,10 @@ class ModelEndHandler {
       }
 
       this.collectedUsage.push(usage);
-      if (!graph.clientOptions?.disableStreaming) {
+      const streamingDisabled = !!(
+        graph.clientOptions?.disableStreaming || graph?.boundModel?.disableStreaming
+      );
+      if (!streamingDisabled) {
         return;
       }
       if (!data.output.content) {

api/server/controllers/agents/client.js

@@ -58,7 +58,7 @@ const payloadParser = ({ req, agent, endpoint }) => {
 
 const legacyContentEndpoints = new Set([KnownEndpoints.groq, KnownEndpoints.deepseek]);
 
-const noSystemModelRegex = [/\b(o\d)\b/gi];
+const noSystemModelRegex = [/\b(o1-preview|o1-mini|amazon\.titan-text)\b/gi];
 
 // const { processMemory, memoryInstructions } = require('~/server/services/Endpoints/agents/memory');
 // const { getFormattedMemories } = require('~/models/Memory');
@@ -148,19 +148,13 @@ class AgentClient extends BaseClient {
    * @param {MongoFile[]} attachments
    */
   checkVisionRequest(attachments) {
-    logger.info(
-      '[api/server/controllers/agents/client.js #checkVisionRequest] not implemented',
-      attachments,
-    );
     // if (!attachments) {
     //   return;
     // }
-
     // const availableModels = this.options.modelsConfig?.[this.options.endpoint];
     // if (!availableModels) {
     //   return;
     // }
-
     // let visionRequestDetected = false;
     // for (const file of attachments) {
     //   if (file?.type?.includes('image')) {
@@ -171,13 +165,11 @@ class AgentClient extends BaseClient {
     // if (!visionRequestDetected) {
     //   return;
     // }
-
     // this.isVisionModel = validateVisionModel({ model: this.modelOptions.model, availableModels });
     // if (this.isVisionModel) {
     //   delete this.modelOptions.stop;
     //   return;
     // }
-
     // for (const model of availableModels) {
     //   if (!validateVisionModel({ model, availableModels })) {
     //     continue;
@@ -187,14 +179,12 @@ class AgentClient extends BaseClient {
     //   delete this.modelOptions.stop;
     //   return;
     // }
-
     // if (!availableModels.includes(this.defaultVisionModel)) {
     //   return;
     // }
     // if (!validateVisionModel({ model: this.defaultVisionModel, availableModels })) {
     //   return;
     // }
-
     // this.modelOptions.model = this.defaultVisionModel;
     // this.isVisionModel = true;
     // delete this.modelOptions.stop;
@@ -364,7 +354,9 @@ class AgentClient extends BaseClient {
             this.contextHandlers?.processFile(file);
             continue;
           }
-
+          if (file.metadata?.fileIdentifier) {
+            continue;
+          }
           // orderedMessages[i].tokenCount += this.calculateImageTokenCost({
           //   width: file.width,
           //   height: file.height,
@@ -671,7 +663,7 @@ class AgentClient extends BaseClient {
         this.indexTokenCountMap,
         toolSet,
       );
-      if (legacyContentEndpoints.has(this.options.agent.endpoint)) {
+      if (legacyContentEndpoints.has(this.options.agent.endpoint?.toLowerCase())) {
         initialMessages = formatContentStrings(initialMessages);
       }
 
@@ -726,12 +718,14 @@ class AgentClient extends BaseClient {
         }
 
         if (noSystemMessages === true && systemContent?.length) {
-          let latestMessage = _messages.pop().content;
+          const latestMessageContent = _messages.pop().content;
           if (typeof latestMessage !== 'string') {
-            latestMessage = latestMessage[0].text;
+            latestMessageContent[0].text = [systemContent, latestMessageContent[0].text].join('\n');
+            _messages.push(new HumanMessage({ content: latestMessageContent }));
+          } else {
+            const text = [systemContent, latestMessageContent].join('\n');
+            _messages.push(new HumanMessage(text));
           }
-          latestMessage = [systemContent, latestMessage].join('\n');
-          _messages.push(new HumanMessage(latestMessage));
         }
 
         let messages = _messages;

api/server/controllers/agents/request.js

@@ -259,6 +259,7 @@ const AgentController = async (req, res, next, initializeClient, addTitle) => {
       sender,
       messageId: responseMessageId,
       parentMessageId: overrideParentMessageId ?? userMessageId ?? parentMessageId,
+      userMessageId,
     })
       .catch((err) => {
         logger.error('[api/server/controllers/agents/request] Error in `handleAbortError`', err);

api/server/controllers/assistants/chatV1.js

@@ -119,7 +119,7 @@ const chatV1 = async (req, res) => {
     } else if (/Files.*are invalid/.test(error.message)) {
       const errorMessage = `Files are invalid, or may not have uploaded yet.${
         endpoint === EModelEndpoint.azureAssistants
-          ? ' If using Azure OpenAI, files are only available in the region of the assistant\'s model at the time of upload.'
+          ? " If using Azure OpenAI, files are only available in the region of the assistant's model at the time of upload."
           : ''
       }`;
       return sendResponse(req, res, messageData, errorMessage);
@@ -379,8 +379,8 @@ const chatV1 = async (req, res) => {
         body.additional_instructions ? `${body.additional_instructions}\n` : ''
       }The user has uploaded ${imageCount} image${pluralized}.
       Use the \`${ImageVisionTool.function.name}\` tool to retrieve ${
-  plural ? '' : 'a '
-}detailed text description${pluralized} for ${plural ? 'each' : 'the'} image${pluralized}.`;
+        plural ? '' : 'a '
+      }detailed text description${pluralized} for ${plural ? 'each' : 'the'} image${pluralized}.`;
 
       return files;
     };
@@ -576,6 +576,8 @@ const chatV1 = async (req, res) => {
       thread_id,
       model: assistant_id,
       endpoint,
+      spec: endpointOption.spec,
+      iconURL: endpointOption.iconURL,
     };
 
     sendMessage(res, {

api/server/controllers/assistants/chatV2.js

@@ -428,6 +428,8 @@ const chatV2 = async (req, res) => {
       thread_id,
       model: assistant_id,
       endpoint,
+      spec: endpointOption.spec,
+      iconURL: endpointOption.iconURL,
     };
 
     sendMessage(res, {

api/server/middleware/abortMiddleware.js

@@ -311,7 +311,7 @@ const handleAbortError = async (res, req, error, data) => {
   } else {
     logger.error('[handleAbortError] AI response error; aborting request:', error);
   }
-  const { sender, conversationId, messageId, parentMessageId, partialText } = data;
+  const { sender, conversationId, messageId, parentMessageId, userMessageId, partialText } = data;
 
   if (error.stack && error.stack.includes('google')) {
     logger.warn(
@@ -344,10 +344,10 @@ const handleAbortError = async (res, req, error, data) => {
       parentMessageId,
       text: errorText,
       user: req.user.id,
-      shouldSaveMessage: true,
       spec: endpointOption?.spec,
       iconURL: endpointOption?.iconURL,
       modelLabel: endpointOption?.modelLabel,
+      shouldSaveMessage: userMessageId != null,
       model: endpointOption?.modelOptions?.model || req.body?.model,
     };
 

api/server/routes/config.js

@@ -75,6 +75,7 @@ router.get('/', async function (req, res) {
         process.env.SHOW_BIRTHDAY_ICON === '',
       helpAndFaqURL: process.env.HELP_AND_FAQ_URL || 'https://librechat.ai',
       interface: req.app.locals.interfaceConfig,
+      turnstile: req.app.locals.turnstileConfig,
       modelSpecs: req.app.locals.modelSpecs,
       balance: req.app.locals.balance,
       sharedLinksEnabled,

api/server/routes/files/files.js

@@ -21,6 +21,7 @@ const { getOpenAIClient } = require('~/server/controllers/assistants/helpers');
 const { loadAuthValues } = require('~/server/services/Tools/credentials');
 const { refreshS3FileUrls } = require('~/server/services/Files/S3/crud');
 const { getFiles, batchUpdateFiles } = require('~/models/File');
+const { getAssistant } = require('~/models/Assistant');
 const { getAgent } = require('~/models/Agent');
 const { getLogStores } = require('~/cache');
 const { logger } = require('~/config');
@@ -94,7 +95,7 @@ router.delete('/', async (req, res) => {
       });
     }
 
-    /* Handle entity unlinking even if no valid files to delete */
+    /* Handle agent unlinking even if no valid files to delete */
     if (req.body.agent_id && req.body.tool_resource && dbFiles.length === 0) {
       const agent = await getAgent({
         id: req.body.agent_id,
@@ -104,7 +105,21 @@ router.delete('/', async (req, res) => {
       const agentFiles = files.filter((f) => toolResourceFiles.includes(f.file_id));
 
       await processDeleteRequest({ req, files: agentFiles });
-      res.status(200).json({ message: 'File associations removed successfully' });
+      res.status(200).json({ message: 'File associations removed successfully from agent' });
+      return;
+    }
+
+    /* Handle assistant unlinking even if no valid files to delete */
+    if (req.body.assistant_id && req.body.tool_resource && dbFiles.length === 0) {
+      const assistant = await getAssistant({
+        id: req.body.assistant_id,
+      });
+
+      const toolResourceFiles = assistant.tool_resources?.[req.body.tool_resource]?.file_ids ?? [];
+      const assistantFiles = files.filter((f) => toolResourceFiles.includes(f.file_id));
+
+      await processDeleteRequest({ req, files: assistantFiles });
+      res.status(200).json({ message: 'File associations removed successfully from assistant' });
       return;
     }
 

api/server/routes/search.js

@@ -1,40 +1,17 @@
-const { Keyv } = require('keyv');
 const express = require('express');
 const { MeiliSearch } = require('meilisearch');
-const { Conversation } = require('~/models/Conversation');
 const requireJwtAuth = require('~/server/middleware/requireJwtAuth');
-const { Message } = require('~/models/Message');
 const { isEnabled } = require('~/server/utils');
-const keyvRedis = require('~/cache/keyvRedis');
 
 const router = express.Router();
 
-const expiration = 60 * 1000;
-const cache = isEnabled(process.env.USE_REDIS)
-  ? new Keyv({ store: keyvRedis })
-  : new Keyv({ namespace: 'search', ttl: expiration });
-
 router.use(requireJwtAuth);
 
-router.get('/sync', async function (req, res) {
-  await Message.syncWithMeili();
-  await Conversation.syncWithMeili();
-  res.send('synced');
-});
-
-router.get('/test', async function (req, res) {
-  const { q } = req.query;
-  const messages = (
-    await Message.meiliSearch(q, { attributesToHighlight: ['text'] }, true)
-  ).hits.map((message) => {
-    const { _formatted, ...rest } = message;
-    return { ...rest, searchResult: true, text: _formatted.text };
-  });
-  res.send(messages);
-});
-
 router.get('/enable', async function (req, res) {
-  let result = false;
+  if (!isEnabled(process.env.SEARCH)) {
+    return res.send(false);
+  }
+
   try {
     const client = new MeiliSearch({
       host: process.env.MEILI_HOST,
@@ -42,8 +19,7 @@ router.get('/enable', async function (req, res) {
     });
 
     const { status } = await client.health();
-    result = status === 'available' && !!process.env.SEARCH;
-    return res.send(result);
+    return res.send(status === 'available');
   } catch (error) {
     return res.send(false);
   }

api/server/services/ActionService.js

@@ -146,7 +146,7 @@ async function createActionTool({
       /** @type {import('librechat-data-provider').ActionMetadataRuntime} */
       const metadata = action.metadata;
       const executor = requestBuilder.createExecutor();
-      const preparedExecutor = executor.setParams(toolInput);
+      const preparedExecutor = executor.setParams(toolInput ?? {});
 
       if (metadata.auth && metadata.auth.type !== AuthTypeEnum.None) {
         try {

api/server/services/AppService.js

@@ -12,6 +12,7 @@ const { initializeFirebase } = require('./Files/Firebase/initialize');
 const loadCustomConfig = require('./Config/loadCustomConfig');
 const handleRateLimits = require('./Config/handleRateLimits');
 const { loadDefaultInterface } = require('./start/interface');
+const { loadTurnstileConfig } = require('./start/turnstile');
 const { azureConfigSetup } = require('./start/azureOpenAI');
 const { processModelSpecs } = require('./start/modelSpecs');
 const { initializeS3 } = require('./Files/S3/initialize');
@@ -23,7 +24,6 @@ const { getMCPManager } = require('~/config');
 const paths = require('~/config/paths');
 
 /**
- *
  * Loads custom config and initializes app-wide variables.
  * @function AppService
  * @param {Express.Application} app - The Express application object.
@@ -74,6 +74,7 @@ const AppService = async (app) => {
   const socialLogins =
     config?.registration?.socialLogins ?? configDefaults?.registration?.socialLogins;
   const interfaceConfig = await loadDefaultInterface(config, configDefaults);
+  const turnstileConfig = loadTurnstileConfig(config, configDefaults);
 
   const defaultLocals = {
     ocr,
@@ -85,6 +86,7 @@ const AppService = async (app) => {
     availableTools,
     imageOutputType,
     interfaceConfig,
+    turnstileConfig,
     balance,
   };
 

api/server/services/AppService.spec.js

@@ -46,6 +46,12 @@ jest.mock('./ToolService', () => ({
     },
   }),
 }));
+jest.mock('./start/turnstile', () => ({
+  loadTurnstileConfig: jest.fn(() => ({
+    siteKey: 'default-site-key',
+    options: {},
+  })),
+}));
 
 const azureGroups = [
   {
@@ -86,6 +92,10 @@ const azureGroups = [
 
 describe('AppService', () => {
   let app;
+  const mockedTurnstileConfig = {
+    siteKey: 'default-site-key',
+    options: {},
+  };
 
   beforeEach(() => {
     app = { locals: {} };
@@ -107,6 +117,7 @@ describe('AppService', () => {
         sidePanel: true,
         presets: true,
       }),
+      turnstileConfig: mockedTurnstileConfig,
       modelSpecs: undefined,
       availableTools: {
         ExampleTool: {

api/server/services/AuthService.js

@@ -56,7 +56,7 @@ const logoutUser = async (req, refreshToken) => {
     try {
       req.session.destroy();
     } catch (destroyErr) {
-      logger.error('[logoutUser] Failed to destroy session.', destroyErr);
+      logger.debug('[logoutUser] Failed to destroy session.', destroyErr);
     }
 
     return { status: 200, message: 'Logout successful' };

api/server/services/Endpoints/agents/initialize.js

@@ -6,6 +6,7 @@ const {
   EToolResources,
   getResponseSender,
   AgentCapabilities,
+  replaceSpecialVars,
   providerEndpointMap,
 } = require('librechat-data-provider');
 const {
@@ -232,6 +233,13 @@ const initializeAgentOptions = async ({
     endpointOption: _endpointOption,
   });
 
+  if (
+    agent.endpoint === EModelEndpoint.azureOpenAI &&
+    options.llmConfig?.azureOpenAIApiInstanceName == null
+  ) {
+    agent.provider = Providers.OPENAI;
+  }
+
   if (options.provider != null) {
     agent.provider = options.provider;
   }
@@ -246,6 +254,13 @@ const initializeAgentOptions = async ({
     agent.model_parameters.model = agent.model;
   }
 
+  if (agent.instructions && agent.instructions !== '') {
+    agent.instructions = replaceSpecialVars({
+      text: agent.instructions,
+      user: req.user,
+    });
+  }
+
   if (typeof agent.artifacts === 'string' && agent.artifacts !== '') {
     agent.additional_instructions = generateArtifactsPrompt({
       endpoint: agent.provider,

api/server/services/Endpoints/assistants/build.js

@@ -3,7 +3,6 @@ const generateArtifactsPrompt = require('~/app/clients/prompts/artifacts');
 const { getAssistant } = require('~/models/Assistant');
 
 const buildOptions = async (endpoint, parsedBody) => {
-
   const { promptPrefix, assistant_id, iconURL, greeting, spec, artifacts, ...modelOptions } =
     parsedBody;
   const endpointOption = removeNullishValues({

api/server/services/Endpoints/openAI/llm.js

@@ -136,7 +136,7 @@ function getLLMConfig(apiKey, options = {}, endpoint = null) {
     Object.assign(llmConfig, azure);
     llmConfig.model = llmConfig.azureOpenAIApiDeploymentName;
   } else {
-    llmConfig.openAIApiKey = apiKey;
+    llmConfig.apiKey = apiKey;
     // Object.assign(llmConfig, {
     //   configuration: { apiKey },
     // });

api/server/services/Threads/manage.js

@@ -132,6 +132,8 @@ async function saveUserMessage(req, params) {
  * @param {string} params.endpoint - The conversation endpoint
  * @param {string} params.parentMessageId - The latest user message that triggered this response.
  * @param {string} [params.instructions] - Optional: from preset for `instructions` field.
+ * @param {string} [params.spec] - Optional: Model spec identifier.
+ * @param {string} [params.iconURL]
  * Overrides the instructions of the assistant.
  * @param {string} [params.promptPrefix] - Optional: from preset for `additional_instructions` field.
  * @return {Promise<Run>} A promise that resolves to the created run object.
@@ -154,6 +156,8 @@ async function saveAssistantMessage(req, params) {
     text: params.text,
     unfinished: false,
     // tokenCount,
+    iconURL: params.iconURL,
+    spec: params.spec,
   });
 
   await saveConvo(
@@ -165,6 +169,8 @@ async function saveAssistantMessage(req, params) {
       instructions: params.instructions,
       assistant_id: params.assistant_id,
       model: params.model,
+      iconURL: params.iconURL,
+      spec: params.spec,
     },
     { context: 'api/server/services/Threads/manage.js #saveAssistantMessage' },
   );

api/server/services/ToolService.js

@@ -8,6 +8,7 @@ const {
   ErrorTypes,
   ContentTypes,
   imageGenTools,
+  EToolResources,
   EModelEndpoint,
   actionDelimiter,
   ImageVisionTool,
@@ -36,6 +37,30 @@ const { redactMessage } = require('~/config/parsers');
 const { sleep } = require('~/server/utils');
 const { logger } = require('~/config');
 
+/**
+ * @param {string} toolName
+ * @returns {string | undefined} toolKey
+ */
+function getToolkitKey(toolName) {
+  /** @type {string|undefined} */
+  let toolkitKey;
+  for (const toolkit of toolkits) {
+    if (toolName.startsWith(EToolResources.image_edit)) {
+      const splitMatches = toolkit.pluginKey.split('_');
+      const suffix = splitMatches[splitMatches.length - 1];
+      if (toolName.endsWith(suffix)) {
+        toolkitKey = toolkit.pluginKey;
+        break;
+      }
+    }
+    if (toolName.startsWith(toolkit.pluginKey)) {
+      toolkitKey = toolkit.pluginKey;
+      break;
+    }
+  }
+  return toolkitKey;
+}
+
 /**
  * Loads and formats tools from the specified tool directory.
  *
@@ -108,7 +133,7 @@ function loadAndFormatTools({ directory, adminFilter = [], adminIncluded = [] })
     tools.push(formattedTool);
   }
 
-  /** Basic Tools; schema: { input: string } */
+  /** Basic Tools & Toolkits; schema: { input: string } */
   const basicToolInstances = [
     new Calculator(),
     ...createOpenAIImageTools({ override: true }),
@@ -117,9 +142,7 @@ function loadAndFormatTools({ directory, adminFilter = [], adminIncluded = [] })
   for (const toolInstance of basicToolInstances) {
     const formattedTool = formatToOpenAIAssistantTool(toolInstance);
     let toolName = formattedTool[Tools.function].name;
-    toolName = toolkits.some((toolkit) => toolName.startsWith(toolkit.pluginKey))
-      ? toolName.split('_')[0]
-      : toolName;
+    toolName = getToolkitKey(toolName) ?? toolName;
     if (filter.has(toolName) && included.size === 0) {
       continue;
     }
@@ -682,6 +705,7 @@ async function loadAgentTools({ req, res, agent, tool_resources, openAIApiKey })
 }
 
 module.exports = {
+  getToolkitKey,
   loadAgentTools,
   loadAndFormatTools,
   processRequiredActions,

api/server/services/start/turnstile.js

@@ -0,0 +1,35 @@
+const { removeNullishValues } = require('librechat-data-provider');
+const { logger } = require('~/config');
+
+/**
+ * Loads and maps the Cloudflare Turnstile configuration.
+ *
+ * Expected config structure:
+ *
+ * turnstile:
+ *   siteKey: "your-site-key-here"
+ *   options:
+ *     language: "auto"    // "auto" or an ISO 639-1 language code (e.g. en)
+ *     size: "normal"      // Options: "normal", "compact", "flexible", or "invisible"
+ *
+ * @param {TCustomConfig | undefined} config - The loaded custom configuration.
+ * @param {TConfigDefaults} configDefaults - The custom configuration default values.
+ * @returns {TCustomConfig['turnstile']} The mapped Turnstile configuration.
+ */
+function loadTurnstileConfig(config, configDefaults) {
+  const { turnstile: customTurnstile = {} } = config ?? {};
+  const { turnstile: defaults = {} } = configDefaults;
+
+  /** @type {TCustomConfig['turnstile']} */
+  const loadedTurnstile = removeNullishValues({
+    siteKey: customTurnstile.siteKey ?? defaults.siteKey,
+    options: customTurnstile.options ?? defaults.options,
+  });
+
+  logger.info('Turnstile configuration loaded:\n' + JSON.stringify(loadedTurnstile, null, 2));
+  return loadedTurnstile;
+}
+
+module.exports = {
+  loadTurnstileConfig,
+};

api/server/utils/streamResponse.js

@@ -70,7 +70,13 @@ const sendError = async (req, res, options, callback) => {
   }
 
   if (shouldSaveMessage) {
-    await saveMessage(req, { ...errorMessage, user });
+    await saveMessage(
+      req,
+      { ...errorMessage, user },
+      {
+        context: 'api/server/utils/streamResponse.js - sendError',
+      },
+    );
   }
 
   if (!errorMessage.error) {

api/strategies/OpenId/openidDataMapper.js

@@ -0,0 +1,165 @@
+const fetch = require('node-fetch');
+const { HttpsProxyAgent } = require('https-proxy-agent');
+const { logger } = require('~/config');
+
+// Microsoft SDK
+const { Client: MicrosoftGraphClient } = require('@microsoft/microsoft-graph-client');
+
+/**
+ * Base class for provider-specific data mappers.
+ */
+class BaseDataMapper {
+  /**
+   * Map custom OpenID data.
+   * @param {string} accessToken - The access token to authenticate the request.
+   * @param {string|Array<string>} customQuery - Either a full query string (if it contains operators)
+   *   or an array of fields to select.
+   * @returns {Promise<Record<string, unknown>>} A promise that resolves to an object of custom fields.
+   * @throws {Error} Throws an error if not implemented in the subclass.
+   */
+  async mapCustomData(accessToken, customQuery) {
+    throw new Error('mapCustomData() must be implemented by subclasses');
+  }
+
+  /**
+   * Optionally handle proxy settings for HTTP requests.
+   * @returns {Object} Configuration object with proxy settings if PROXY is set.
+   */
+  getProxyOptions() {
+    if (process.env.PROXY) {
+      const agent = new HttpsProxyAgent(process.env.PROXY);
+      return { agent };
+    }
+    return {};
+  }
+}
+
+/**
+ * Microsoft-specific data mapper using the Microsoft Graph SDK.
+ */
+class MicrosoftDataMapper extends BaseDataMapper {
+  /**
+   * Initializes the MicrosoftGraphClient once for reuse.
+   */
+  constructor() {
+    super();
+    this.accessToken = null;
+
+    this.client = MicrosoftGraphClient.init({
+      defaultVersion: 'beta',
+      authProvider: (done) => {
+        // The authProvider will be called for each request to get the token
+        if (this.accessToken) {
+          done(null, this.accessToken);
+        } else {
+          done(new Error('Access token is not set.'), null);
+        }
+      },
+      fetch: fetch,
+      ...this.getProxyOptions(),
+    });
+
+    // Bind methods to maintain context
+    this.mapCustomData = this.mapCustomData.bind(this);
+    this.cleanData = this.cleanData.bind(this);
+  }
+
+  /**
+   * Set the access token for the client.
+   * This method should be called before making any requests.
+   *
+   * @param {string} accessToken - The access token.
+   */
+  setAccessToken(accessToken) {
+    if (!accessToken || typeof accessToken !== 'string') {
+      throw new Error('[MicrosoftDataMapper] Invalid access token provided.');
+    }
+    this.accessToken = accessToken;
+  }
+
+  /**
+   * Map custom OpenID data using the Microsoft Graph SDK.
+   *
+   * @param {string} accessToken - The access token to authenticate the request.
+   * @param {string|Array<string>} customQuery - Fields to select from the Microsoft Graph API.
+   * @returns {Promise<Record<string, unknown>>} A promise that resolves to an object of custom fields.
+   */
+  async mapCustomData(accessToken, customQuery) {
+    try {
+      this.setAccessToken(accessToken);
+
+      if (!customQuery) {
+        logger.warn('[MicrosoftDataMapper] No customQuery provided.');
+        return {};
+      }
+
+      // Convert customQuery to a comma-separated string if it's an array
+      const fields = Array.isArray(customQuery) ? customQuery.join(',') : customQuery;
+
+      if (!fields) {
+        logger.warn('[MicrosoftDataMapper] No fields specified in customQuery.');
+        return {};
+      }
+
+      const result = await this.client.api('/me').select(fields).get();
+
+      // Clean and return the data as a plain object
+      return this.cleanData(result);
+    } catch (error) {
+      // Handle specific Microsoft Graph errors if needed
+      logger.error(`[MicrosoftDataMapper] Error fetching user data: ${error.message}`, {
+        stack: error.stack,
+      });
+      return {};
+    }
+  }
+
+  /**
+   * Recursively remove all keys starting with @odata. from an object or array.
+   *
+   * @param {object|Array} obj - The object or array to clean.
+   * @returns {object|Array} - The cleaned object or array.
+   */
+  cleanData(obj) {
+    if (Array.isArray(obj)) {
+      return obj.map(this.cleanData);
+    } else if (obj && typeof obj === 'object') {
+      return Object.entries(obj).reduce((acc, [key, value]) => {
+        if (!key.startsWith('@odata.')) {
+          acc[key] = this.cleanData(value);
+        }
+        return acc;
+      }, {});
+    }
+    return obj;
+  }
+}
+
+/**
+ * Map provider names to their specific data mappers.
+ */
+const PROVIDER_MAPPERS = {
+  microsoft: MicrosoftDataMapper,
+};
+
+/**
+ * Abstraction layer that returns a provider-specific mapper instance.
+ */
+class OpenIdDataMapper {
+  /**
+   * Retrieve an instance of the mapper for the specified provider.
+   *
+   * @param {string} provider - The name of the provider (e.g., 'microsoft').
+   * @returns {BaseDataMapper} An instance of the specific data mapper for the provider.
+   * @throws {Error} Throws an error if no mapper is found for the specified provider.
+   */
+  static getMapper(provider) {
+    const MapperClass = PROVIDER_MAPPERS[provider.toLowerCase()];
+    if (!MapperClass) {
+      throw new Error(`No mapper found for provider: ${provider}`);
+    }
+    return new MapperClass();
+  }
+}
+
+module.exports = OpenIdDataMapper;

api/strategies/openidStrategy.js

@@ -8,6 +8,8 @@ const { findUser, createUser, updateUser } = require('~/models/userMethods');
 const { hashToken } = require('~/server/utils/crypto');
 const { isEnabled } = require('~/server/utils');
 const { logger } = require('~/config');
+const { SystemRoles } = require('librechat-data-provider');
+const OpenIdDataMapper = require('./OpenId/openidDataMapper');
 
 let crypto;
 try {
@@ -20,37 +22,27 @@ try {
  * Downloads an image from a URL using an access token.
  * @param {string} url
  * @param {string} accessToken
- * @returns {Promise<Buffer>}
+ * @returns {Promise<Buffer|string>}
  */
 const downloadImage = async (url, accessToken) => {
   if (!url) {
     return '';
   }
 
+  const options = {
+    method: 'GET',
+    headers: { Authorization: `Bearer ${accessToken}` },
+    ...(process.env.PROXY && { agent: new HttpsProxyAgent(process.env.PROXY) }),
+  };
+
   try {
-    const options = {
-      method: 'GET',
-      headers: {
-        Authorization: `Bearer ${accessToken}`,
-      },
-    };
-
-    if (process.env.PROXY) {
-      options.agent = new HttpsProxyAgent(process.env.PROXY);
-    }
-
     const response = await fetch(url, options);
-
-    if (response.ok) {
-      const buffer = await response.buffer();
-      return buffer;
-    } else {
+    if (!response.ok) {
       throw new Error(`${response.statusText} (HTTP ${response.status})`);
     }
+    return await response.buffer();
   } catch (error) {
-    logger.error(
-      `[openidStrategy] downloadImage: Error downloading image at URL "${url}": ${error}`,
-    );
+    logger.error(`[openidStrategy] Error downloading image at URL "${url}": ${error}`);
     return '';
   }
 };
@@ -65,25 +57,21 @@ const downloadImage = async (url, accessToken) => {
  * @param {string} [userinfo.email] - The user's email address
  * @returns {string} The determined full name of the user
  */
-function getFullName(userinfo) {
+const getFullName = (userinfo) => {
   if (process.env.OPENID_NAME_CLAIM) {
     return userinfo[process.env.OPENID_NAME_CLAIM];
   }
-
   if (userinfo.given_name && userinfo.family_name) {
     return `${userinfo.given_name} ${userinfo.family_name}`;
   }
-
   if (userinfo.given_name) {
     return userinfo.given_name;
   }
-
   if (userinfo.family_name) {
     return userinfo.family_name;
   }
-
   return userinfo.username || userinfo.email;
-}
+};
 
 /**
  * Converts an input into a string suitable for a username.
@@ -95,26 +83,93 @@ function getFullName(userinfo) {
  * @param {string} [defaultValue=''] - The default value to return if the input is falsy.
  * @returns {string} The processed input as a string suitable for a username.
  */
-function convertToUsername(input, defaultValue = '') {
+const convertToUsername = (input, defaultValue = '') => {
   if (typeof input === 'string') {
     return input;
-  } else if (Array.isArray(input)) {
+  }
+  if (Array.isArray(input)) {
     return input.join('_');
   }
-
   return defaultValue;
-}
+};
+
+/**
+ * Safely decodes a JWT token.
+ * @param {string} token
+ * @returns {Object|null}
+ */
+const safeDecode = (token) => {
+  try {
+    const decoded = jwtDecode(token);
+    if (decoded && typeof decoded === 'object') {
+      return decoded;
+    }
+    logger.error('[openidStrategy] Decoded token is not an object.');
+  } catch (error) {
+    logger.error('[openidStrategy] Error decoding token:', error);
+  }
+  return null;
+};
+
+/**
+ * Extracts roles from a decoded token based on the provided path.
+ * @param {Object} decodedToken
+ * @param {string} parameterPath
+ * @returns {string[]}
+ */
+const extractRolesFromToken = (decodedToken, parameterPath) => {
+  if (!decodedToken) {
+    return [];
+  }
+  if (!parameterPath) {
+    return [];
+  }
+  const roles = parameterPath.split('.').reduce((obj, key) => obj?.[key] ?? null, decodedToken);
+  if (!Array.isArray(roles)) {
+    logger.error('[openidStrategy] Roles extracted from token are not in array format.');
+    return [];
+  }
+  return roles;
+};
+
+/**
+ * Updates the user's avatar if a valid picture URL is provided.
+ * @param {Object} user
+ * @param {string | undefined} pictureUrl - The URL of the user's avatar.
+ * @param {string} accessToken
+ * @returns {Promise<Object>} The updated user object.
+ */
+const updateUserAvatar = async (user, pictureUrl, accessToken) => {
+  if (!pictureUrl || (user.avatar && user.avatar.includes('manual=true'))) {
+    return user;
+  }
+
+  const fileName = crypto ? (await hashToken(user.openidId)) + '.png' : `${user.openidId}.png`;
+
+  const imageBuffer = await downloadImage(pictureUrl, accessToken);
+  if (imageBuffer) {
+    const { saveBuffer } = getStrategyFunctions(process.env.CDN_PROVIDER);
+    const imagePath = await saveBuffer({
+      fileName,
+      userId: user._id.toString(),
+      buffer: imageBuffer,
+    });
+    user.avatar = imagePath ?? '';
+  }
+  return user;
+};
 
 async function setupOpenId() {
   try {
+    // Configure proxy if defined.
     if (process.env.PROXY) {
       const proxyAgent = new HttpsProxyAgent(process.env.PROXY);
-      custom.setHttpOptionsDefaults({
-        agent: proxyAgent,
-      });
-      logger.info(`[openidStrategy] proxy agent added: ${process.env.PROXY}`);
+      custom.setHttpOptionsDefaults({ agent: proxyAgent });
+      logger.info(`[openidStrategy] Proxy agent added: ${process.env.PROXY}`);
     }
+
     const issuer = await Issuer.discover(process.env.OPENID_ISSUER);
+
     /* Supported Algorithms, openid-client v5 doesn't set it automatically as discovered from server.
       - id_token_signed_response_alg      // defaults to 'RS256'
       - request_object_signing_alg        // defaults to 'RS256'
@@ -128,125 +183,113 @@ async function setupOpenId() {
       client_secret: process.env.OPENID_CLIENT_SECRET,
       redirect_uris: [process.env.DOMAIN_SERVER + process.env.OPENID_CALLBACK_URL],
     };
+
     if (isEnabled(process.env.OPENID_SET_FIRST_SUPPORTED_ALGORITHM)) {
       clientMetadata.id_token_signed_response_alg =
         issuer.id_token_signing_alg_values_supported?.[0] || 'RS256';
     }
+
     const client = new issuer.Client(clientMetadata);
+
     const requiredRole = process.env.OPENID_REQUIRED_ROLE;
     const requiredRoleParameterPath = process.env.OPENID_REQUIRED_ROLE_PARAMETER_PATH;
     const requiredRoleTokenKind = process.env.OPENID_REQUIRED_ROLE_TOKEN_KIND;
+    const adminRolesEnv = process.env.OPENID_ADMIN_ROLE;
+    const adminRoles = adminRolesEnv ? adminRolesEnv.split(',').map((role) => role.trim()) : [];
+
     const openidLogin = new OpenIDStrategy(
       {
         client,
-        params: {
-          scope: process.env.OPENID_SCOPE,
-        },
+        params: { scope: process.env.OPENID_SCOPE },
       },
       async (tokenset, userinfo, done) => {
         try {
-          logger.info(`[openidStrategy] verify login openidId: ${userinfo.sub}`);
-          logger.debug('[openidStrategy] very login tokenset and userinfo', { tokenset, userinfo });
+          logger.info(`[openidStrategy] Verifying login for openidId: ${userinfo.sub}`);
+          logger.debug('[openidStrategy] Tokenset and userinfo:', { tokenset, userinfo });
 
-          let user = await findUser({ openidId: userinfo.sub });
-          logger.info(
-            `[openidStrategy] user ${user ? 'found' : 'not found'} with openidId: ${userinfo.sub}`,
-          );
-
-          if (!user) {
-            user = await findUser({ email: userinfo.email });
-            logger.info(
-              `[openidStrategy] user ${user ? 'found' : 'not found'} with email: ${
-                userinfo.email
-              } for openidId: ${userinfo.sub}`,
-            );
-          }
+          // Find an existing user by openidId or email.
+          let user =
+            (await findUser({ openidId: userinfo.sub })) ||
+            (await findUser({ email: userinfo.email }));
 
           const fullName = getFullName(userinfo);
+          const username = process.env.OPENID_USERNAME_CLAIM
+            ? userinfo[process.env.OPENID_USERNAME_CLAIM]
+            : convertToUsername(userinfo.username || userinfo.given_name || userinfo.email);
 
-          if (requiredRole) {
-            let decodedToken = '';
-            if (requiredRoleTokenKind === 'access') {
-              decodedToken = jwtDecode(tokenset.access_token);
-            } else if (requiredRoleTokenKind === 'id') {
-              decodedToken = jwtDecode(tokenset.id_token);
-            }
-            const pathParts = requiredRoleParameterPath.split('.');
-            let found = true;
-            let roles = pathParts.reduce((o, key) => {
-              if (o === null || o === undefined || !(key in o)) {
-                found = false;
-                return [];
-              }
-              return o[key];
-            }, decodedToken);
+          // Use the token specified by configuration to extract roles.
+          const token =
+            requiredRoleTokenKind === 'access' ? tokenset.access_token : tokenset.id_token;
+          const decodedToken = safeDecode(token);
+          const tokenBasedRoles = extractRolesFromToken(decodedToken, requiredRoleParameterPath);
 
-            if (!found) {
-              logger.error(
-                `[openidStrategy] Key '${requiredRoleParameterPath}' not found in ${requiredRoleTokenKind} token!`,
-              );
-            }
-
-            if (!roles.includes(requiredRole)) {
-              return done(null, false, {
-                message: `You must have the "${requiredRole}" role to log in.`,
-              });
-            }
+          // Ensure the required role exists.
+          if (requiredRole && !tokenBasedRoles.includes(requiredRole)) {
+            return done(null, false, {
+              message: `You must have the "${requiredRole}" role to log in.`,
+            });
           }
 
-          let username = '';
-          if (process.env.OPENID_USERNAME_CLAIM) {
-            username = userinfo[process.env.OPENID_USERNAME_CLAIM];
-          } else {
-            username = convertToUsername(
-              userinfo.username || userinfo.given_name || userinfo.email,
+          // Determine system role.
+          const isAdmin = tokenBasedRoles.some((role) => adminRoles.includes(role));
+          const assignedRole = isAdmin ? SystemRoles.ADMIN : SystemRoles.USER;
+          logger.debug(
+            `[openidStrategy] Assigned system role: ${assignedRole} (isAdmin: ${isAdmin})`,
+          );
+
+          // Map custom OpenID data if configured.
+          let customOpenIdData = {};
+          if (process.env.OPENID_CUSTOM_DATA) {
+            const dataMapper = OpenIdDataMapper.getMapper(
+              process.env.OPENID_PROVIDER.toLowerCase(),
             );
+            customOpenIdData = await dataMapper.mapCustomData(
+              tokenset.access_token,
+              process.env.OPENID_CUSTOM_DATA,
+            );
+            if (tokenBasedRoles.length) {
+              customOpenIdData.roles = tokenBasedRoles;
+            } else {
+              logger.warn('[openidStrategy] tokenBasedRoles is missing or invalid.');
+            }
           }
 
+          // Create or update the user.
           if (!user) {
+            user = await createUser(
+              {
+                provider: 'openid',
+                openidId: userinfo.sub,
+                username,
+                email: userinfo.email || '',
+                emailVerified: userinfo.email_verified || false,
+                name: fullName,
+                role: assignedRole,
+                customOpenIdData,
+              },
+              true,
+              true,
+            );
+          } else {
             user = {
+              ...user,
               provider: 'openid',
               openidId: userinfo.sub,
               username,
-              email: userinfo.email || '',
-              emailVerified: userinfo.email_verified || false,
               name: fullName,
+              role: assignedRole,
+              customOpenIdData,
             };
-            user = await createUser(user, true, true);
-          } else {
-            user.provider = 'openid';
-            user.openidId = userinfo.sub;
-            user.username = username;
-            user.name = fullName;
           }
 
-          if (userinfo.picture && !user.avatar?.includes('manual=true')) {
-            /** @type {string | undefined} */
-            const imageUrl = userinfo.picture;
-
-            let fileName;
-            if (crypto) {
-              fileName = (await hashToken(userinfo.sub)) + '.png';
-            } else {
-              fileName = userinfo.sub + '.png';
-            }
-
-            const imageBuffer = await downloadImage(imageUrl, tokenset.access_token);
-            if (imageBuffer) {
-              const { saveBuffer } = getStrategyFunctions(process.env.CDN_PROVIDER);
-              const imagePath = await saveBuffer({
-                fileName,
-                userId: user._id.toString(),
-                buffer: imageBuffer,
-              });
-              user.avatar = imagePath ?? '';
-            }
-          }
+          // Update the user's avatar if available.
+          user = await updateUserAvatar(user, userinfo.picture, tokenset.access_token);
 
+          // Persist updated user data.
           user = await updateUser(user._id, user);
 
           logger.info(
-            `[openidStrategy] login success openidId: ${user.openidId} | email: ${user.email} | username: ${user.username} `,
+            `[openidStrategy] Login success for openidId: ${user.openidId} | email: ${user.email} | username: ${user.username}`,
             {
               user: {
                 openidId: user.openidId,
@@ -256,10 +299,9 @@ async function setupOpenId() {
               },
             },
           );
-
           done(null, user);
         } catch (err) {
-          logger.error('[openidStrategy] login failed', err);
+          logger.error('[openidStrategy] Login failed', err);
           done(err);
         }
       },

api/strategies/openidStrategy.spec.js

@@ -3,6 +3,7 @@ const jwtDecode = require('jsonwebtoken/decode');
 const { Issuer, Strategy: OpenIDStrategy } = require('openid-client');
 const { findUser, createUser, updateUser } = require('~/models/userMethods');
 const setupOpenId = require('./openidStrategy');
+const OpenIdDataMapper = require('./OpenId/openidDataMapper');
 
 // --- Mocks ---
 jest.mock('node-fetch');
@@ -10,7 +11,6 @@ jest.mock('openid-client');
 jest.mock('jsonwebtoken/decode');
 jest.mock('~/server/services/Files/strategies', () => ({
   getStrategyFunctions: jest.fn(() => ({
-    // You can modify this mock as needed (here returning a dummy function)
     saveBuffer: jest.fn().mockResolvedValue('/fake/path/to/avatar.png'),
   })),
 }));
@@ -23,7 +23,7 @@ jest.mock('~/server/utils/crypto', () => ({
   hashToken: jest.fn().mockResolvedValue('hashed-token'),
 }));
 jest.mock('~/server/utils', () => ({
-  isEnabled: jest.fn(() => false), // default to false, override per test if needed
+  isEnabled: jest.fn(() => false),
 }));
 jest.mock('~/config', () => ({
   logger: {
@@ -43,7 +43,7 @@ Issuer.discover = jest.fn().mockResolvedValue({
   }),
 });
 
-// To capture the verify callback from the strategy, we grab it from the mock constructor
+// Capture the verify callback from the strategy via the mock constructor
 let verifyCallback;
 OpenIDStrategy.mockImplementation((options, verify) => {
   verifyCallback = verify;
@@ -80,7 +80,6 @@ describe('setupOpenId', () => {
   };
 
   beforeEach(async () => {
-    // Clear previous mock calls and reset implementations
     jest.clearAllMocks();
 
     // Reset environment variables needed by the strategy
@@ -96,6 +95,8 @@ describe('setupOpenId', () => {
     delete process.env.OPENID_USERNAME_CLAIM;
     delete process.env.OPENID_NAME_CLAIM;
     delete process.env.PROXY;
+    delete process.env.OPENID_CUSTOM_DATA;
+    delete process.env.OPENID_PROVIDER;
 
     // Default jwtDecode mock returns a token that includes the required role.
     jwtDecode.mockReturnValue({
@@ -125,13 +126,8 @@ describe('setupOpenId', () => {
   });
 
   it('should create a new user with correct username when username claim exists', async () => {
-    // Arrange – our userinfo already has username 'flast'
     const userinfo = { ...baseUserinfo };
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert
     expect(user.username).toBe(userinfo.username);
     expect(createUser).toHaveBeenCalledWith(
       expect.objectContaining({
@@ -147,16 +143,10 @@ describe('setupOpenId', () => {
   });
 
   it('should use given_name as username when username claim is missing', async () => {
-    // Arrange – remove username from userinfo
     const userinfo = { ...baseUserinfo };
     delete userinfo.username;
-    // Expect the username to be the given name (unchanged case)
     const expectUsername = userinfo.given_name;
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert
     expect(user.username).toBe(expectUsername);
     expect(createUser).toHaveBeenCalledWith(
       expect.objectContaining({ username: expectUsername }),
@@ -166,16 +156,11 @@ describe('setupOpenId', () => {
   });
 
   it('should use email as username when username and given_name are missing', async () => {
-    // Arrange – remove username and given_name
     const userinfo = { ...baseUserinfo };
     delete userinfo.username;
     delete userinfo.given_name;
     const expectUsername = userinfo.email;
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert
     expect(user.username).toBe(expectUsername);
     expect(createUser).toHaveBeenCalledWith(
       expect.objectContaining({ username: expectUsername }),
@@ -185,14 +170,9 @@ describe('setupOpenId', () => {
   });
 
   it('should override username with OPENID_USERNAME_CLAIM when set', async () => {
-    // Arrange – set OPENID_USERNAME_CLAIM so that the sub claim is used
     process.env.OPENID_USERNAME_CLAIM = 'sub';
     const userinfo = { ...baseUserinfo };
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert – username should equal the sub (converted as-is)
     expect(user.username).toBe(userinfo.sub);
     expect(createUser).toHaveBeenCalledWith(
       expect.objectContaining({ username: userinfo.sub }),
@@ -202,31 +182,20 @@ describe('setupOpenId', () => {
   });
 
   it('should set the full name correctly when given_name and family_name exist', async () => {
-    // Arrange
     const userinfo = { ...baseUserinfo };
     const expectedFullName = `${userinfo.given_name} ${userinfo.family_name}`;
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert
     expect(user.name).toBe(expectedFullName);
   });
 
   it('should override full name with OPENID_NAME_CLAIM when set', async () => {
-    // Arrange – use the name claim as the full name
     process.env.OPENID_NAME_CLAIM = 'name';
     const userinfo = { ...baseUserinfo, name: 'Custom Name' };
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert
     expect(user.name).toBe('Custom Name');
   });
 
   it('should update an existing user on login', async () => {
-    // Arrange – simulate that a user already exists
     const existingUser = {
       _id: 'existingUserId',
       provider: 'local',
@@ -241,13 +210,8 @@ describe('setupOpenId', () => {
       }
       return null;
     });
-
     const userinfo = { ...baseUserinfo };
-
-    // Act
     await validate(tokenset, userinfo);
-
-    // Assert – updateUser should be called and the user object updated
     expect(updateUser).toHaveBeenCalledWith(
       existingUser._id,
       expect.objectContaining({
@@ -260,43 +224,41 @@ describe('setupOpenId', () => {
   });
 
   it('should enforce the required role and reject login if missing', async () => {
-    // Arrange – simulate a token without the required role.
     jwtDecode.mockReturnValue({
       roles: ['SomeOtherRole'],
     });
     const userinfo = { ...baseUserinfo };
-
-    // Act
     const { user, details } = await validate(tokenset, userinfo);
-
-    // Assert – verify that the strategy rejects login
     expect(user).toBe(false);
     expect(details.message).toBe('You must have the "requiredRole" role to log in.');
   });
 
   it('should attempt to download and save the avatar if picture is provided', async () => {
-    // Arrange – ensure userinfo contains a picture URL
     const userinfo = { ...baseUserinfo };
-
-    // Act
     const { user } = await validate(tokenset, userinfo);
-
-    // Assert – verify that download was attempted and the avatar field was set via updateUser
     expect(fetch).toHaveBeenCalled();
-    // Our mock getStrategyFunctions.saveBuffer returns '/fake/path/to/avatar.png'
     expect(user.avatar).toBe('/fake/path/to/avatar.png');
   });
 
   it('should not attempt to download avatar if picture is not provided', async () => {
-    // Arrange – remove picture
     const userinfo = { ...baseUserinfo };
     delete userinfo.picture;
-
-    // Act
-    await validate(tokenset, userinfo);
-
-    // Assert – fetch should not be called and avatar should remain undefined or empty
+    const { user } = await validate(tokenset, userinfo);
     expect(fetch).not.toHaveBeenCalled();
-    // Depending on your implementation, user.avatar may be undefined or an empty string.
+    expect(user.avatar).toBeFalsy();
+  });
+
+  it('should map customOpenIdData as an object when OPENID_CUSTOM_DATA is set', async () => {
+    process.env.OPENID_CUSTOM_DATA = 'some,fields';
+    process.env.OPENID_PROVIDER = 'microsoft';
+    const fakeCustomData = { foo: 'bar' };
+    const fakeDataMapper = { mapCustomData: jest.fn().mockResolvedValue(fakeCustomData) };
+    OpenIdDataMapper.getMapper = jest.fn(() => fakeDataMapper);
+
+    const userinfo = { ...baseUserinfo };
+    const { user } = await validate(tokenset, userinfo);
+    expect(OpenIdDataMapper.getMapper).toHaveBeenCalledWith('microsoft');
+    expect(fakeDataMapper.mapCustomData).toHaveBeenCalledWith(tokenset.access_token, 'some,fields');
+    expect(user.customOpenIdData).toEqual({ ...fakeCustomData, roles: ['requiredRole'] });
   });
 });

api/typedefs.js

@@ -43,6 +43,60 @@
  * @memberof typedefs
  */
 
+/**
+ * @exports Graph
+ * @typedef {import('@librechat/agents').Graph} Graph
+ * @memberof typedefs
+ */
+
+/**
+ * @exports StandardGraph
+ * @typedef {import('@librechat/agents').StandardGraph} StandardGraph
+ * @memberof typedefs
+ */
+
+/**
+ * @exports EventHandler
+ * @typedef {import('@librechat/agents').EventHandler} EventHandler
+ * @memberof typedefs
+ */
+
+/**
+ * @exports ModelEndData
+ * @typedef {import('@librechat/agents').ModelEndData} ModelEndData
+ * @memberof typedefs
+ */
+
+/**
+ * @exports ToolEndData
+ * @typedef {import('@librechat/agents').ToolEndData} ToolEndData
+ * @memberof typedefs
+ */
+
+/**
+ * @exports ToolEndCallback
+ * @typedef {import('@librechat/agents').ToolEndCallback} ToolEndCallback
+ * @memberof typedefs
+ */
+
+/**
+ * @exports ChatModelStreamHandler
+ * @typedef {import('@librechat/agents').ChatModelStreamHandler} ChatModelStreamHandler
+ * @memberof typedefs
+ */
+
+/**
+ * @exports ContentAggregator
+ * @typedef {import('@librechat/agents').ContentAggregatorResult['aggregateContent']} ContentAggregator
+ * @memberof typedefs
+ */
+
+/**
+ * @exports GraphEvents
+ * @typedef {import('@librechat/agents').GraphEvents} GraphEvents
+ * @memberof typedefs
+ */
+
 /**
  * @exports AgentRun
  * @typedef {import('@librechat/agents').Run} AgentRun
@@ -97,12 +151,6 @@
  * @memberof typedefs
  */
 
-/**
- * @exports ToolEndData
- * @typedef {import('@librechat/agents').ToolEndData} ToolEndData
- * @memberof typedefs
- */
-
 /**
  * @exports BaseMessage
  * @typedef {import('@langchain/core/messages').BaseMessage} BaseMessage

api/utils/tokens.js

@@ -60,10 +60,16 @@ const cohereModels = {
 
 const googleModels = {
   /* Max I/O is combined so we subtract the amount from max response tokens for actual total */
+  gemma: 8196,
+  'gemma-2': 32768,
+  'gemma-3': 32768,
+  'gemma-3-27b': 131072,
   gemini: 30720, // -2048 from max
   'gemini-pro-vision': 12288,
   'gemini-exp': 2000000,
   'gemini-2.5': 1000000, // 1M input tokens, 64k output tokens
+  'gemini-2.5-pro': 1000000,
+  'gemini-2.5-flash': 1000000,
   'gemini-2.0': 2000000,
   'gemini-2.0-flash': 1000000,
   'gemini-2.0-flash-lite': 1000000,
@@ -235,12 +241,15 @@ const modelMaxOutputs = {
   system_default: 1024,
 };
 
+/** Outputs from https://docs.anthropic.com/en/docs/about-claude/models/all-models#model-names */
 const anthropicMaxOutputs = {
   'claude-3-haiku': 4096,
   'claude-3-sonnet': 4096,
   'claude-3-opus': 4096,
   'claude-3.5-sonnet': 8192,
   'claude-3-5-sonnet': 8192,
+  'claude-3.7-sonnet': 128000,
+  'claude-3-7-sonnet': 128000,
 };
 
 const maxOutputTokensMap = {

client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@librechat/frontend",
-  "version": "v0.7.7",
+  "version": "v0.7.8",
   "description": "",
   "type": "module",
   "scripts": {
@@ -34,6 +34,7 @@
     "@dicebear/collection": "^9.2.2",
     "@dicebear/core": "^9.2.2",
     "@headlessui/react": "^2.1.2",
+    "@marsidev/react-turnstile": "^1.1.0",
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-alert-dialog": "^1.0.2",
     "@radix-ui/react-checkbox": "^1.0.3",
@@ -141,7 +142,7 @@
     "tailwindcss": "^3.4.1",
     "ts-jest": "^29.2.5",
     "typescript": "^5.3.3",
-    "vite": "^6.2.5",
+    "vite": "^6.3.4",
     "vite-plugin-compression2": "^1.3.3",
     "vite-plugin-node-polyfills": "^0.23.0",
     "vite-plugin-pwa": "^0.21.2"

client/public/assets/xai.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false" fill="currentColor" class="bg-white"><path d="m3.005 8.858 8.783 12.544h3.904L6.908 8.858zM6.905 15.825 3 21.402h3.907l1.951-2.788zM16.585 2l-6.75 9.64 1.953 2.79L20.492 2zM17.292 7.965v13.437h3.2V3.395z"></path></svg>

client/src/common/types.ts

@@ -508,7 +508,10 @@ export interface ModelItemProps {
   className?: string;
 }
 
-export type ContextType = { navVisible: boolean; setNavVisible: (visible: boolean) => void };
+export type ContextType = {
+  navVisible: boolean;
+  setNavVisible: React.Dispatch<React.SetStateAction<boolean>>;
+};
 
 export interface SwitcherProps {
   endpoint?: t.EModelEndpoint | null;

client/src/components/Artifacts/Artifact.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useCallback, useRef, useState } from 'react';
 import throttle from 'lodash/throttle';
 import { visit } from 'unist-util-visit';
 import { useSetRecoilState } from 'recoil';
+import { useLocation } from 'react-router-dom';
 import type { Pluggable } from 'unified';
 import type { Artifact } from '~/common';
 import { useMessageContext, useArtifactContext } from '~/Providers';
@@ -45,6 +46,7 @@ export function Artifact({
   children: React.ReactNode | { props: { children: React.ReactNode } };
   node: unknown;
 }) {
+  const location = useLocation();
   const { messageId } = useMessageContext();
   const { getNextIndex, resetCounter } = useArtifactContext();
   const artifactIndex = useRef(getNextIndex(false)).current;
@@ -86,6 +88,10 @@ export function Artifact({
         lastUpdateTime: now,
       };
 
+      if (!location.pathname.includes('/c/')) {
+        return setArtifact(currentArtifact);
+      }
+
       setArtifacts((prevArtifacts) => {
         if (
           prevArtifacts?.[artifactKey] != null &&
@@ -110,6 +116,7 @@ export function Artifact({
     props.identifier,
     messageId,
     artifactIndex,
+    location.pathname,
   ]);
 
   useEffect(() => {

client/src/components/Artifacts/ArtifactButton.tsx

@@ -1,15 +1,52 @@
-import { useSetRecoilState, useResetRecoilState } from 'recoil';
+import { useEffect, useRef } from 'react';
+import debounce from 'lodash/debounce';
+import { useLocation } from 'react-router-dom';
+import { useRecoilState, useSetRecoilState, useResetRecoilState } from 'recoil';
 import type { Artifact } from '~/common';
 import FilePreview from '~/components/Chat/Input/Files/FilePreview';
+import { getFileType, logger } from '~/utils';
 import { useLocalize } from '~/hooks';
-import { getFileType } from '~/utils';
 import store from '~/store';
 
 const ArtifactButton = ({ artifact }: { artifact: Artifact | null }) => {
   const localize = useLocalize();
-  const setVisible = useSetRecoilState(store.artifactsVisible);
+  const location = useLocation();
+  const setVisible = useSetRecoilState(store.artifactsVisibility);
+  const [artifacts, setArtifacts] = useRecoilState(store.artifactsState);
   const setCurrentArtifactId = useSetRecoilState(store.currentArtifactId);
   const resetCurrentArtifactId = useResetRecoilState(store.currentArtifactId);
+  const [visibleArtifacts, setVisibleArtifacts] = useRecoilState(store.visibleArtifacts);
+
+  const debouncedSetVisibleRef = useRef(
+    debounce((artifactToSet: Artifact) => {
+      logger.log(
+        'artifacts_visibility',
+        'Setting artifact to visible state from Artifact button',
+        artifactToSet,
+      );
+      setVisibleArtifacts((prev) => ({
+        ...prev,
+        [artifactToSet.id]: artifactToSet,
+      }));
+    }, 750),
+  );
+
+  useEffect(() => {
+    if (artifact == null || artifact?.id == null || artifact.id === '') {
+      return;
+    }
+
+    if (!location.pathname.includes('/c/')) {
+      return;
+    }
+
+    const debouncedSetVisible = debouncedSetVisibleRef.current;
+    debouncedSetVisible(artifact);
+    return () => {
+      debouncedSetVisible.cancel();
+    };
+  }, [artifact, location.pathname]);
+
   if (artifact === null || artifact === undefined) {
     return null;
   }
@@ -20,8 +57,14 @@ const ArtifactButton = ({ artifact }: { artifact: Artifact | null }) => {
       <button
         type="button"
         onClick={() => {
+          if (!location.pathname.includes('/c/')) {
+            return;
+          }
           resetCurrentArtifactId();
           setVisible(true);
+          if (artifacts?.[artifact.id] == null) {
+            setArtifacts(visibleArtifacts);
+          }
           setTimeout(() => {
             setCurrentArtifactId(artifact.id);
           }, 15);

client/src/components/Artifacts/Artifacts.tsx

@@ -1,7 +1,7 @@
 import { useRef, useState, useEffect } from 'react';
-import { RefreshCw } from 'lucide-react';
 import { useSetRecoilState } from 'recoil';
 import * as Tabs from '@radix-ui/react-tabs';
+import { ArrowLeft, ChevronLeft, ChevronRight, RefreshCw, X } from 'lucide-react';
 import type { SandpackPreviewRef, CodeEditorRef } from '@codesandbox/sandpack-react';
 import useArtifacts from '~/hooks/Artifacts/useArtifacts';
 import DownloadArtifact from './DownloadArtifact';
@@ -18,7 +18,7 @@ export default function Artifacts() {
   const previewRef = useRef<SandpackPreviewRef>();
   const [isVisible, setIsVisible] = useState(false);
   const [isRefreshing, setIsRefreshing] = useState(false);
-  const setArtifactsVisible = useSetRecoilState(store.artifactsVisible);
+  const setArtifactsVisible = useSetRecoilState(store.artifactsVisibility);
 
   useEffect(() => {
     setIsVisible(true);
@@ -48,37 +48,26 @@ export default function Artifacts() {
     setTimeout(() => setIsRefreshing(false), 750);
   };
 
+  const closeArtifacts = () => {
+    setIsVisible(false);
+    setTimeout(() => setArtifactsVisible(false), 300);
+  };
+
   return (
     <Tabs.Root value={activeTab} onValueChange={setActiveTab} asChild>
       {/* Main Parent */}
       <div className="flex h-full w-full items-center justify-center">
         {/* Main Container */}
         <div
-          className={`flex h-full w-full flex-col overflow-hidden border border-border-medium bg-surface-primary text-xl text-text-primary shadow-xl transition-all duration-300 ease-in-out ${
-            isVisible
-              ? 'translate-x-0 scale-100 opacity-100'
-              : 'translate-x-full scale-95 opacity-0'
+          className={`flex h-full w-full flex-col overflow-hidden border border-border-medium bg-surface-primary text-xl text-text-primary shadow-xl transition-all duration-500 ease-in-out ${
+            isVisible ? 'scale-100 opacity-100 blur-0' : 'scale-105 opacity-0 blur-sm'
           }`}
         >
           {/* Header */}
           <div className="flex items-center justify-between border-b border-border-medium bg-surface-primary-alt p-2">
             <div className="flex items-center">
-              <button
-                className="mr-2 text-text-secondary"
-                onClick={() => {
-                  setIsVisible(false);
-                  setTimeout(() => setArtifactsVisible(false), 300);
-                }}
-              >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="16"
-                  height="16"
-                  fill="currentColor"
-                  viewBox="0 0 256 256"
-                >
-                  <path d="M224,128a8,8,0,0,1-8,8H59.31l58.35,58.34a8,8,0,0,1-11.32,11.32l-72-72a8,8,0,0,1,0-11.32l72-72a8,8,0,0,1,11.32,11.32L59.31,120H216A8,8,0,0,1,224,128Z" />
-                </svg>
+              <button className="mr-2 text-text-secondary" onClick={closeArtifacts}>
+                <ArrowLeft className="h-4 w-4" />
               </button>
               <h3 className="truncate text-sm text-text-primary">{currentArtifact.title}</h3>
             </div>
@@ -118,22 +107,8 @@ export default function Artifacts() {
                   {localize('com_ui_code')}
                 </Tabs.Trigger>
               </Tabs.List>
-              <button
-                className="text-text-secondary"
-                onClick={() => {
-                  setIsVisible(false);
-                  setTimeout(() => setArtifactsVisible(false), 300);
-                }}
-              >
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="16"
-                  height="16"
-                  fill="currentColor"
-                  viewBox="0 0 256 256"
-                >
-                  <path d="M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z" />
-                </svg>
+              <button className="text-text-secondary" onClick={closeArtifacts}>
+                <X className="h-4 w-4" />
               </button>
             </div>
           </div>
@@ -149,29 +124,13 @@ export default function Artifacts() {
           <div className="flex items-center justify-between border-t border-border-medium bg-surface-primary-alt p-2 text-sm text-text-secondary">
             <div className="flex items-center">
               <button onClick={() => cycleArtifact('prev')} className="mr-2 text-text-secondary">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="16"
-                  height="16"
-                  fill="currentColor"
-                  viewBox="0 0 256 256"
-                >
-                  <path d="M165.66,202.34a8,8,0,0,1-11.32,11.32l-80-80a8,8,0,0,1,0-11.32l80-80a8,8,0,0,1,11.32,11.32L91.31,128Z" />
-                </svg>
+                <ChevronLeft className="h-4 w-4" />
               </button>
               <span className="text-xs">{`${currentIndex + 1} / ${
                 orderedArtifactIds.length
               }`}</span>
               <button onClick={() => cycleArtifact('next')} className="ml-2 text-text-secondary">
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width="16"
-                  height="16"
-                  fill="currentColor"
-                  viewBox="0 0 256 256"
-                >
-                  <path d="M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z" />
-                </svg>
+                <ChevronRight className="h-4 w-4" />
               </button>
             </div>
             <div className="flex items-center gap-2">

client/src/components/Artifacts/Code.tsx

@@ -35,7 +35,7 @@ export const CodeMarkdown = memo(
     const [userScrolled, setUserScrolled] = useState(false);
     const currentContent = content;
     const rehypePlugins = [
-      [rehypeKatex, { output: 'mathml' }],
+      [rehypeKatex],
       [
         rehypeHighlight,
         {

client/src/components/Auth/LoginForm.tsx

@@ -1,9 +1,10 @@
 import { useForm } from 'react-hook-form';
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useContext } from 'react';
+import { Turnstile } from '@marsidev/react-turnstile';
 import type { TLoginUser, TStartupConfig } from 'librechat-data-provider';
 import type { TAuthContext } from '~/common';
 import { useResendVerificationEmail, useGetStartupConfig } from '~/data-provider';
-import { useLocalize } from '~/hooks';
+import { ThemeContext, useLocalize } from '~/hooks';
 
 type TLoginFormProps = {
   onSubmit: (data: TLoginUser) => void;
@@ -14,6 +15,7 @@ type TLoginFormProps = {
 
 const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error, setError }) => {
   const localize = useLocalize();
+  const { theme } = useContext(ThemeContext);
   const {
     register,
     getValues,
@@ -21,9 +23,11 @@ const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error,
     formState: { errors },
   } = useForm<TLoginUser>();
   const [showResendLink, setShowResendLink] = useState<boolean>(false);
+  const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
 
   const { data: config } = useGetStartupConfig();
   const useUsernameLogin = config?.ldap?.username;
+  const validTheme = theme === 'dark' ? 'dark' : 'light';
 
   useEffect(() => {
     if (error && error.includes('422') && !showResendLink) {
@@ -159,11 +163,29 @@ const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error,
             {localize('com_auth_password_forgot')}
           </a>
         )}
+
+        {/* Render Turnstile only if enabled in startupConfig */}
+        {startupConfig.turnstile && (
+          <div className="my-4 flex justify-center">
+            <Turnstile
+              siteKey={startupConfig.turnstile.siteKey}
+              options={{
+                ...startupConfig.turnstile.options,
+                theme: validTheme,
+              }}
+              onSuccess={(token) => setTurnstileToken(token)}
+              onError={() => setTurnstileToken(null)}
+              onExpire={() => setTurnstileToken(null)}
+            />
+          </div>
+        )}
+
         <div className="mt-6">
           <button
             aria-label={localize('com_auth_continue')}
             data-testid="login-button"
             type="submit"
+            disabled={startupConfig.turnstile ? !turnstileToken : false}
             className="
             w-full rounded-2xl bg-green-600 px-4 py-3 text-sm font-medium text-white
             transition-colors hover:bg-green-700 dark:bg-green-600 dark:hover:bg-green-700

client/src/components/Auth/Registration.tsx

@@ -1,16 +1,18 @@
 import { useForm } from 'react-hook-form';
-import React, { useState } from 'react';
+import React, { useContext, useState } from 'react';
+import { Turnstile } from '@marsidev/react-turnstile';
 import { useNavigate, useOutletContext, useLocation } from 'react-router-dom';
 import { useRegisterUserMutation } from 'librechat-data-provider/react-query';
 import type { TRegisterUser, TError } from 'librechat-data-provider';
 import type { TLoginLayoutContext } from '~/common';
 import { ErrorMessage } from './ErrorMessage';
 import { Spinner } from '~/components/svg';
-import { useLocalize, TranslationKeys } from '~/hooks';
+import { useLocalize, TranslationKeys, ThemeContext } from '~/hooks';
 
 const Registration: React.FC = () => {
   const navigate = useNavigate();
   const localize = useLocalize();
+  const { theme } = useContext(ThemeContext);
   const { startupConfig, startupConfigError, isFetching } = useOutletContext<TLoginLayoutContext>();
 
   const {
@@ -24,10 +26,12 @@ const Registration: React.FC = () => {
   const [errorMessage, setErrorMessage] = useState<string>('');
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [countdown, setCountdown] = useState<number>(3);
+  const [turnstileToken, setTurnstileToken] = useState<string | null>(null);
 
   const location = useLocation();
   const queryParams = new URLSearchParams(location.search);
   const token = queryParams.get('token');
+  const validTheme = theme === 'dark' ? 'dark' : 'light';
 
   const registerUser = useRegisterUserMutation({
     onMutate: () => {
@@ -178,17 +182,38 @@ const Registration: React.FC = () => {
               validate: (value: string) =>
                 value === password || localize('com_auth_password_not_match'),
             })}
+
+            {/* Render Turnstile only if enabled in startupConfig */}
+            {startupConfig?.turnstile && (
+              <div className="my-4 flex justify-center">
+                <Turnstile
+                  siteKey={startupConfig.turnstile.siteKey}
+                  options={{
+                    ...startupConfig.turnstile.options,
+                    theme: validTheme,
+                  }}
+                  onSuccess={(token) => setTurnstileToken(token)}
+                  onError={() => setTurnstileToken(null)}
+                  onExpire={() => setTurnstileToken(null)}
+                />
+              </div>
+            )}
+
             <div className="mt-6">
               <button
-                disabled={Object.keys(errors).length > 0}
+                disabled={
+                  Object.keys(errors).length > 0 ||
+                  isSubmitting ||
+                  (startupConfig?.turnstile ? !turnstileToken : false)
+                }
                 type="submit"
                 aria-label="Submit registration"
                 className="
-            w-full rounded-2xl bg-green-600 px-4 py-3 text-sm font-medium text-white
-            transition-colors hover:bg-green-700 focus:outline-none focus:ring-2
-            focus:ring-green-500 focus:ring-offset-2 disabled:opacity-50
-            disabled:hover:bg-green-600 dark:bg-green-600 dark:hover:bg-green-700
-          "
+                  w-full rounded-2xl bg-green-600 px-4 py-3 text-sm font-medium text-white
+                  transition-colors hover:bg-green-700 focus:outline-none focus:ring-2
+                  focus:ring-green-500 focus:ring-offset-2 disabled:opacity-50
+                  disabled:hover:bg-green-600 dark:bg-green-600 dark:hover:bg-green-700
+                "
               >
                 {isSubmitting ? <Spinner /> : localize('com_auth_continue')}
               </button>

client/src/components/Chat/ChatView.tsx

@@ -2,22 +2,33 @@ import { memo, useCallback } from 'react';
 import { useRecoilValue } from 'recoil';
 import { useForm } from 'react-hook-form';
 import { useParams } from 'react-router-dom';
-import { useGetMessagesByConvoId } from 'librechat-data-provider/react-query';
+import { Constants } from 'librechat-data-provider';
 import type { TMessage } from 'librechat-data-provider';
 import type { ChatFormValues } from '~/common';
 import { ChatContext, AddedChatContext, useFileMapContext, ChatFormProvider } from '~/Providers';
 import { useChatHelpers, useAddedResponse, useSSE } from '~/hooks';
 import ConversationStarters from './Input/ConversationStarters';
+import { useGetMessagesByConvoId } from '~/data-provider';
 import MessagesView from './Messages/MessagesView';
 import { Spinner } from '~/components/svg';
 import Presentation from './Presentation';
+import { buildTree, cn } from '~/utils';
 import ChatForm from './Input/ChatForm';
-import { buildTree } from '~/utils';
 import Landing from './Landing';
 import Header from './Header';
 import Footer from './Footer';
 import store from '~/store';
 
+function LoadingSpinner() {
+  return (
+    <div className="relative flex-1 overflow-hidden overflow-y-auto">
+      <div className="relative flex h-full items-center justify-center">
+        <Spinner className="text-text-primary" />
+      </div>
+    </div>
+  );
+}
+
 function ChatView({ index = 0 }: { index?: number }) {
   const { conversationId } = useParams();
   const rootSubmission = useRecoilValue(store.submissionByIndex(index));
@@ -48,16 +59,15 @@ function ChatView({ index = 0 }: { index?: number }) {
   });
 
   let content: JSX.Element | null | undefined;
-  const isLandingPage = !messagesTree || messagesTree.length === 0;
+  const isLandingPage =
+    (!messagesTree || messagesTree.length === 0) &&
+    (conversationId === Constants.NEW_CONVO || !conversationId);
+  const isNavigating = (!messagesTree || messagesTree.length === 0) && conversationId != null;
 
-  if (isLoading && conversationId !== 'new') {
-    content = (
-      <div className="relative flex-1 overflow-hidden overflow-y-auto">
-        <div className="relative flex h-full items-center justify-center">
-          <Spinner className="text-text-primary" />
-        </div>
-      </div>
-    );
+  if (isLoading && conversationId !== Constants.NEW_CONVO) {
+    content = <LoadingSpinner />;
+  } else if ((isLoading || isNavigating) && !isLandingPage) {
+    content = <LoadingSpinner />;
   } else if (!isLandingPage) {
     content = <MessagesView messagesTree={messagesTree} />;
   } else {
@@ -71,27 +81,28 @@ function ChatView({ index = 0 }: { index?: number }) {
           <Presentation>
             <div className="flex h-full w-full flex-col">
               {!isLoading && <Header />}
-
-              {isLandingPage ? (
-                <>
-                  <div className="flex flex-1 flex-col items-center justify-end sm:justify-center">
-                    {content}
-                    <div className="w-full max-w-3xl transition-all duration-200 xl:max-w-4xl">
-                      <ChatForm index={index} />
-                      <ConversationStarters />
-                    </div>
-                  </div>
-                  <Footer />
-                </>
-              ) : (
-                <div className="flex h-full flex-col overflow-y-auto">
+              <>
+                <div
+                  className={cn(
+                    'flex flex-col',
+                    isLandingPage
+                      ? 'flex-1 items-center justify-end sm:justify-center'
+                      : 'h-full overflow-y-auto',
+                  )}
+                >
                   {content}
-                  <div className="w-full">
+                  <div
+                    className={cn(
+                      'w-full',
+                      isLandingPage && 'max-w-3xl transition-all duration-200 xl:max-w-4xl',
+                    )}
+                  >
                     <ChatForm index={index} />
-                    <Footer />
+                    {isLandingPage ? <ConversationStarters /> : <Footer />}
                   </div>
                 </div>
-              )}
+                {isLandingPage && <Footer />}
+              </>
             </div>
           </Presentation>
         </AddedChatContext.Provider>

client/src/components/Chat/ExportAndShareMenu.tsx

@@ -44,15 +44,6 @@ export default function ExportAndShareMenu({
   };
 
   const dropdownItems: t.MenuItemProps[] = [
-    {
-      label: localize('com_endpoint_export'),
-      onClick: exportHandler,
-      icon: <Upload className="icon-md mr-2 text-text-secondary" />,
-      /** NOTE: THE FOLLOWING PROPS ARE REQUIRED FOR MENU ITEMS THAT OPEN DIALOGS */
-      hideOnClick: false,
-      ref: exportButtonRef,
-      render: (props) => <button {...props} />,
-    },
     {
       label: localize('com_ui_share'),
       onClick: shareHandler,
@@ -63,6 +54,15 @@ export default function ExportAndShareMenu({
       ref: shareButtonRef,
       render: (props) => <button {...props} />,
     },
+    {
+      label: localize('com_endpoint_export'),
+      onClick: exportHandler,
+      icon: <Upload className="icon-md mr-2 text-text-secondary" />,
+      /** NOTE: THE FOLLOWING PROPS ARE REQUIRED FOR MENU ITEMS THAT OPEN DIALOGS */
+      hideOnClick: false,
+      ref: exportButtonRef,
+      render: (props) => <button {...props} />,
+    },
   ];
 
   return (
@@ -70,6 +70,7 @@ export default function ExportAndShareMenu({
       <DropdownPopup
         menuId={menuId}
         focusLoop={true}
+        unmountOnHide={true}
         isOpen={isPopoverActive}
         setIsOpen={setIsPopoverActive}
         trigger={
@@ -81,7 +82,7 @@ export default function ExportAndShareMenu({
                 aria-label="Export options"
                 className="inline-flex size-10 flex-shrink-0 items-center justify-center rounded-xl border border-border-light bg-transparent text-text-primary transition-all ease-in-out hover:bg-surface-tertiary disabled:pointer-events-none disabled:opacity-50 radix-state-open:bg-surface-tertiary"
               >
-                <Upload
+                <Share2
                   className="icon-md text-text-secondary"
                   aria-hidden="true"
                   focusable="false"

client/src/components/Chat/Header.tsx

@@ -3,7 +3,7 @@ import { useOutletContext } from 'react-router-dom';
 import { getConfigDefaults, PermissionTypes, Permissions } from 'librechat-data-provider';
 import type { ContextType } from '~/common';
 import ModelSelector from './Menus/Endpoints/ModelSelector';
-import { PresetsMenu, HeaderNewChat } from './Menus';
+import { PresetsMenu, HeaderNewChat, OpenSidebar } from './Menus';
 import { useGetStartupConfig } from '~/data-provider';
 import ExportAndShareMenu from './ExportAndShareMenu';
 import { useMediaQuery, useHasAccess } from '~/hooks';
@@ -15,7 +15,7 @@ const defaultInterface = getConfigDefaults().interface;
 
 export default function Header() {
   const { data: startupConfig } = useGetStartupConfig();
-  const { navVisible } = useOutletContext<ContextType>();
+  const { navVisible, setNavVisible } = useOutletContext<ContextType>();
   const interfaceConfig = useMemo(
     () => startupConfig?.interface ?? defaultInterface,
     [startupConfig],
@@ -36,7 +36,8 @@ export default function Header() {
   return (
     <div className="sticky top-0 z-10 flex h-14 w-full items-center justify-between bg-white p-2 font-semibold text-text-primary dark:bg-gray-800">
       <div className="hide-scrollbar flex w-full items-center justify-between gap-2 overflow-x-auto">
-        <div className="mx-2 flex items-center gap-2">
+        <div className="mx-1 flex items-center gap-2">
+          {!navVisible && <OpenSidebar setNavVisible={setNavVisible} />}
           {!navVisible && <HeaderNewChat />}
           {<ModelSelector startupConfig={startupConfig} />}
           {interfaceConfig.presets === true && interfaceConfig.modelSelect && <PresetsMenu />}

client/src/components/Chat/Input/ChatForm.tsx

@@ -15,6 +15,7 @@ import {
   useHandleKeyUp,
   useQueryParams,
   useSubmitMessage,
+  useFocusChatEffect,
 } from '~/hooks';
 import { mainTextareaId, BadgeItem } from '~/common';
 import AttachFileChat from './Files/AttachFileChat';
@@ -36,6 +37,7 @@ import store from '~/store';
 const ChatForm = memo(({ index = 0 }: { index?: number }) => {
   const submitButtonRef = useRef<HTMLButtonElement>(null);
   const textAreaRef = useRef<HTMLTextAreaElement>(null);
+  useFocusChatEffect(textAreaRef);
 
   const [isCollapsed, setIsCollapsed] = useState(false);
   const [, setIsScrollable] = useState(false);
@@ -43,7 +45,6 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
   const [isTextAreaFocused, setIsTextAreaFocused] = useState(false);
   const [backupBadges, setBackupBadges] = useState<Pick<BadgeItem, 'id'>[]>([]);
 
-  const search = useRecoilValue(store.search);
   const SpeechToText = useRecoilValue(store.speechToText);
   const TextToSpeech = useRecoilValue(store.textToSpeech);
   const chatDirection = useRecoilValue(store.chatDirection);
@@ -107,6 +108,10 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
   );
 
   const handleContainerClick = useCallback(() => {
+    /** Check if the device is a touchscreen */
+    if (window.matchMedia?.('(pointer: coarse)').matches) {
+      return;
+    }
     textAreaRef.current?.focus();
   }, []);
 
@@ -125,13 +130,20 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
   });
 
   const { submitMessage, submitPrompt } = useSubmitMessage();
+
   const handleKeyUp = useHandleKeyUp({
     index,
     textAreaRef,
     setShowPlusPopover,
     setShowMentionPopover,
   });
-  const { handlePaste, handleKeyDown, handleCompositionStart, handleCompositionEnd } = useTextarea({
+  const {
+    isNotAppendable,
+    handlePaste,
+    handleKeyDown,
+    handleCompositionStart,
+    handleCompositionEnd,
+  } = useTextarea({
     textAreaRef,
     submitButtonRef,
     setIsScrollable,
@@ -151,12 +163,6 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
 
   const textValue = useWatch({ control: methods.control, name: 'text' });
 
-  useEffect(() => {
-    if (!search.isSearching && textAreaRef.current && !disableInputs) {
-      textAreaRef.current.focus();
-    }
-  }, [search.isSearching, disableInputs]);
-
   useEffect(() => {
     if (textAreaRef.current) {
       const style = window.getComputedStyle(textAreaRef.current);
@@ -256,7 +262,7 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
                     ref(e);
                     (textAreaRef as React.MutableRefObject<HTMLTextAreaElement | null>).current = e;
                   }}
-                  disabled={disableInputs}
+                  disabled={disableInputs || isNotAppendable}
                   onPaste={handlePaste}
                   onKeyDown={handleKeyDown}
                   onKeyUp={handleKeyUp}
@@ -276,7 +282,7 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
                   className={cn(
                     baseClasses,
                     removeFocusRings,
-                    'transition-[max-height] duration-200',
+                    'transition-[max-height] duration-200 disabled:cursor-not-allowed',
                   )}
                 />
                 <div className="flex flex-col items-start justify-start pt-1.5">
@@ -311,7 +317,7 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
                   methods={methods}
                   ask={submitMessage}
                   textAreaRef={textAreaRef}
-                  disabled={disableInputs}
+                  disabled={disableInputs || isNotAppendable}
                   isSubmitting={isSubmitting}
                 />
               )}
@@ -323,7 +329,7 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
                     <SendButton
                       ref={submitButtonRef}
                       control={methods.control}
-                      disabled={filesLoading || isSubmitting || disableInputs}
+                      disabled={filesLoading || isSubmitting || disableInputs || isNotAppendable}
                     />
                   )
                 )}

client/src/components/Chat/Input/CollapseChat.tsx

@@ -41,9 +41,9 @@ const CollapseChat = ({
             )}
           >
             {isCollapsed ? (
-              <ChevronDown className="h-full w-full" />
-            ) : (
               <ChevronUp className="h-full w-full" />
+            ) : (
+              <ChevronDown className="h-full w-full" />
             )}
           </button>
         }

client/src/components/Chat/Input/Files/AttachFileMenu.tsx

@@ -119,6 +119,7 @@ const AttachFile = ({ disabled }: AttachFileProps) => {
         isOpen={isPopoverActive}
         setIsOpen={setIsPopoverActive}
         modal={true}
+        unmountOnHide={true}
         trigger={menuTrigger}
         items={dropdownItems}
         iconClassName="mr-0"

client/src/components/Chat/Input/Files/DragDropModal.tsx

@@ -34,7 +34,7 @@ const DragDropModal = ({ onOptionSelect, setShowModal, files, isVisible }: DragD
         label: localize('com_ui_upload_image_input'),
         value: undefined,
         icon: <ImageUpIcon className="icon-md" />,
-        condition: files.every((file) => file.type.startsWith('image/')),
+        condition: files.every((file) => file.type?.startsWith('image/')),
       },
     ];
     for (const capability of capabilities) {

client/src/components/Chat/Input/Files/Table/Columns.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-hooks/rules-of-hooks */
 
 import { ArrowUpDown, Database } from 'lucide-react';
 import { FileSources, FileContext } from 'librechat-data-provider';
@@ -68,7 +69,7 @@ export const columns: ColumnDef<TFile>[] = [
     },
     cell: ({ row }) => {
       const file = row.original;
-      if (file.type.startsWith('image')) {
+      if (file.type?.startsWith('image')) {
         return (
           <div className="flex gap-2">
             <ImagePreview
@@ -76,7 +77,7 @@ export const columns: ColumnDef<TFile>[] = [
               className="relative h-10 w-10 shrink-0 overflow-hidden rounded-md"
               source={file.source}
             />
-            <span className="self-center truncate ">{file.filename}</span>
+            <span className="self-center truncate">{file.filename}</span>
           </div>
         );
       }
@@ -212,4 +213,4 @@ export const columns: ColumnDef<TFile>[] = [
       return `${value}${suffix}`;
     },
   },
-];
+];

client/src/components/Chat/Input/MCPSelect.tsx

@@ -31,7 +31,8 @@ function MCPSelect({ conversationId }: { conversationId?: string | null }) {
     select: (data) => {
       const serverNames = new Set<string>();
       data.forEach((tool) => {
-        if (tool.pluginKey.includes(Constants.mcp_delimiter)) {
+        const isMCP = tool.pluginKey.includes(Constants.mcp_delimiter);
+        if (isMCP && tool.chatMenu !== false) {
           const parts = tool.pluginKey.split(Constants.mcp_delimiter);
           serverNames.add(parts[parts.length - 1]);
         }

client/src/components/Chat/Input/PopoverButtons.tsx

@@ -44,7 +44,7 @@ export default function PopoverButtons({
   const endpoint = overrideEndpoint ?? endpointType ?? _endpoint ?? '';
   const model = overrideModel ?? _model;
 
-  const isGenerativeModel = model?.toLowerCase().includes('gemini') ?? false;
+  const isGenerativeModel = /gemini|learnlm|gemma/.test(model ?? '') ?? false;
   const isChatModel = (!isGenerativeModel && model?.toLowerCase().includes('chat')) ?? false;
   const isTextModel = !isGenerativeModel && !isChatModel && /code|text/.test(model ?? '');
 
@@ -133,7 +133,6 @@ export default function PopoverButtons({
           </Button>
         ))}
       </div>
-      {/* eslint-disable-next-line @typescript-eslint/no-unnecessary-condition */}
       {disabled ? null : (
         <div className="flex w-[150px] items-center justify-end">
           {additionalButtons[settingsView].map((button, index) => (

client/src/components/Chat/Input/PromptsCommand.tsx

@@ -201,7 +201,7 @@ function PromptsCommand({
         <div className="popover border-token-border-light rounded-2xl border bg-surface-tertiary-alt p-2 shadow-lg">
           <input
             // The user expects focus to transition to the input field when the popover is opened
-
+            // eslint-disable-next-line jsx-a11y/no-autofocus
             autoFocus
             ref={inputRef}
             placeholder={localize('com_ui_command_usage_placeholder')}

client/src/components/Chat/Landing.tsx

@@ -9,7 +9,7 @@ import { useLocalize, useAuthContext } from '~/hooks';
 import { getIconEndpoint, getEntity } from '~/utils';
 
 const containerClassName =
-  'shadow-stroke relative flex h-full items-center justify-center rounded-full bg-white text-black';
+  'shadow-stroke relative flex h-full items-center justify-center rounded-full bg-white dark:bg-presentation dark:text-white text-black dark:after:shadow-none ';
 
 function getTextSizeClass(text: string | undefined | null) {
   if (!text) {
@@ -149,7 +149,7 @@ export default function Landing({ centerFormOnLanding }: { centerFormOnLanding:
     >
       <div ref={contentRef} className="flex flex-col items-center gap-0 p-2">
         <div
-          className={`flex ${textHasMultipleLines ? 'flex-col' : 'flex-col md:flex-row'} items-center justify-center gap-4`}
+          className={`flex ${textHasMultipleLines ? 'flex-col' : 'flex-col md:flex-row'} items-center justify-center gap-2`}
         >
           <div className={`relative size-10 justify-center ${textHasMultipleLines ? 'mb-2' : ''}`}>
             <ConvoIcon
@@ -159,7 +159,7 @@ export default function Landing({ centerFormOnLanding }: { centerFormOnLanding:
               endpointsConfig={endpointsConfig}
               containerClassName={containerClassName}
               context="landing"
-              className="h-2/3 w-2/3"
+              className="h-2/3 w-2/3 text-black dark:text-white"
               size={41}
             />
             {startupConfig?.showBirthdayIcon && (

client/src/components/Chat/Menus/BookmarkMenu.tsx

@@ -160,6 +160,7 @@ const BookmarkMenu: FC = () => {
         focusLoop={true}
         menuId={menuId}
         isOpen={isMenuOpen}
+        unmountOnHide={true}
         setIsOpen={setIsMenuOpen}
         keyPrefix={`${conversationId}-bookmark-`}
         trigger={

client/src/components/Chat/Menus/HeaderNewChat.tsx

@@ -1,36 +1,44 @@
 import { useQueryClient } from '@tanstack/react-query';
 import { QueryKeys, Constants } from 'librechat-data-provider';
 import type { TMessage } from 'librechat-data-provider';
-import { useMediaQuery, useLocalize } from '~/hooks';
-import { Button, NewChatIcon } from '~/components';
+import { TooltipAnchor, Button } from '~/components/ui';
+import { NewChatIcon } from '~/components/svg';
 import { useChatContext } from '~/Providers';
+import { useLocalize } from '~/hooks';
 
 export default function HeaderNewChat() {
+  const localize = useLocalize();
   const queryClient = useQueryClient();
   const { conversation, newConversation } = useChatContext();
-  const isSmallScreen = useMediaQuery('(max-width: 768px)');
-  const localize = useLocalize();
 
-  if (isSmallScreen) {
-    return null;
-  }
+  const clickHandler: React.MouseEventHandler<HTMLButtonElement> = (e) => {
+    if (e.button === 0 && (e.ctrlKey || e.metaKey)) {
+      window.open('/c/new', '_blank');
+      return;
+    }
+    queryClient.setQueryData<TMessage[]>(
+      [QueryKeys.messages, conversation?.conversationId ?? Constants.NEW_CONVO],
+      [],
+    );
+    queryClient.invalidateQueries([QueryKeys.messages]);
+    newConversation();
+  };
 
   return (
-    <Button
-      size="icon"
-      variant="outline"
-      data-testid="wide-header-new-chat-button"
-      aria-label={localize('com_ui_new_chat')}
-      className="rounded-xl border border-border-light bg-surface-secondary p-2 hover:bg-surface-hover"
-      onClick={() => {
-        queryClient.setQueryData<TMessage[]>(
-          [QueryKeys.messages, conversation?.conversationId ?? Constants.NEW_CONVO],
-          [],
-        );
-        newConversation();
-      }}
-    >
-      <NewChatIcon />
-    </Button>
+    <TooltipAnchor
+      description={localize('com_ui_new_chat')}
+      render={
+        <Button
+          size="icon"
+          variant="outline"
+          data-testid="wide-header-new-chat-button"
+          aria-label={localize('com_ui_new_chat')}
+          className="rounded-xl border border-border-light bg-surface-secondary p-2 hover:bg-surface-hover max-md:hidden"
+          onClick={clickHandler}
+        >
+          <NewChatIcon />
+        </Button>
+      }
+    />
   );
 }

client/src/components/Chat/Menus/OpenSidebar.tsx

@@ -0,0 +1,33 @@
+import { TooltipAnchor, Button } from '~/components/ui';
+import { Sidebar } from '~/components/svg';
+import { useLocalize } from '~/hooks';
+
+export default function OpenSidebar({
+  setNavVisible,
+}: {
+  setNavVisible: React.Dispatch<React.SetStateAction<boolean>>;
+}) {
+  const localize = useLocalize();
+  return (
+    <TooltipAnchor
+      description={localize('com_nav_open_sidebar')}
+      render={
+        <Button
+          size="icon"
+          variant="outline"
+          data-testid="open-sidebar-button"
+          aria-label={localize('com_nav_open_sidebar')}
+          className="rounded-xl border border-border-light bg-surface-secondary p-2 hover:bg-surface-hover max-md:hidden"
+          onClick={() =>
+            setNavVisible((prev) => {
+              localStorage.setItem('navVisible', JSON.stringify(!prev));
+              return !prev;
+            })
+          }
+        >
+          <Sidebar />
+        </Button>
+      }
+    />
+  );
+}

client/src/components/Chat/Menus/index.ts

@@ -1,2 +1,3 @@
 export { default as PresetsMenu } from './PresetsMenu';
+export { default as OpenSidebar } from './OpenSidebar';
 export { default as HeaderNewChat } from './HeaderNewChat';

client/src/components/Chat/Messages/Content/EditMessage.tsx

@@ -113,9 +113,9 @@ const EditMessage = ({
         messages.map((msg) =>
           msg.messageId === messageId
             ? {
-              ...msg,
-              text: data.text,
-            }
+                ...msg,
+                text: data.text,
+              }
             : msg,
         ),
       );

client/src/components/Chat/Messages/Content/Markdown.tsx

@@ -150,7 +150,7 @@ export const a: React.ElementType = memo(({ href, children }: TAnchorProps) => {
 
   return (
     <a
-      href={filepath.startsWith('files/') ? `/api/${filepath}` : `/api/files/${filepath}`}
+      href={filepath?.startsWith('files/') ? `/api/${filepath}` : `/api/files/${filepath}`}
       {...props}
     >
       {children}
@@ -184,7 +184,7 @@ const Markdown = memo(({ content = '', isLatestMessage }: TContentProps) => {
 
   const rehypePlugins = useMemo(
     () => [
-      [rehypeKatex, { output: 'mathml' }],
+      [rehypeKatex],
       [
         rehypeHighlight,
         {

client/src/components/Chat/Messages/Content/MarkdownLite.tsx

@@ -13,7 +13,7 @@ import { langSubset } from '~/utils';
 const MarkdownLite = memo(
   ({ content = '', codeExecution = true }: { content?: string; codeExecution?: boolean }) => {
     const rehypePlugins: PluggableList = [
-      [rehypeKatex, { output: 'mathml' }],
+      [rehypeKatex],
       [
         rehypeHighlight,
         {

client/src/components/Chat/Messages/Content/Parts/Text.tsx

@@ -35,7 +35,7 @@ const TextPart = memo(({ text, isCreatedByUser, showCursor }: TextPartProps) =>
     } else {
       return <>{text}</>;
     }
-  }, [isCreatedByUser, enableUserMsgMarkdown, text, showCursorState, isLatestMessage]);
+  }, [isCreatedByUser, enableUserMsgMarkdown, text, isLatestMessage]);
 
   return (
     <div

client/src/components/Chat/Messages/MessagesView.tsx

@@ -14,10 +14,9 @@ export default function MessagesView({
   messagesTree?: TMessage[] | null;
 }) {
   const localize = useLocalize();
-  const scrollButtonPreference = useRecoilValue(store.showScrollButton);
-  const maximizeChatSpace = useRecoilValue(store.maximizeChatSpace);
   const fontSize = useRecoilValue(store.fontSize);
   const { screenshotTargetRef } = useScreenshot();
+  const scrollButtonPreference = useRecoilValue(store.showScrollButton);
   const [currentEditId, setCurrentEditId] = useState<number | string | null>(-1);
 
   const {

client/src/components/Chat/Messages/SearchButtons.tsx

@@ -13,7 +13,7 @@ export default function SearchButtons({ message }: { message: TMessage }) {
   const localize = useLocalize();
   const queryClient = useQueryClient();
   const search = useRecoilValue(store.search);
-  const { navigateWithLastTools } = useNavigateToConvo();
+  const { navigateToConvo } = useNavigateToConvo();
   const conversationId = message.conversationId ?? '';
 
   const clickHandler = async (event: React.MouseEvent<HTMLButtonElement>) => {
@@ -39,14 +39,13 @@ export default function SearchButtons({ message }: { message: TMessage }) {
     }
 
     document.title = title;
-    navigateWithLastTools(
+    navigateToConvo(
       cachedConvo ??
         ({
           conversationId,
           title,
         } as TConversation),
-      true,
-      true,
+      { resetLatestMessage: true },
     );
   };
 

client/src/components/Chat/Presentation.tsx

@@ -12,7 +12,7 @@ import store from '~/store';
 
 export default function Presentation({ children }: { children: React.ReactNode }) {
   const artifacts = useRecoilValue(store.artifactsState);
-  const artifactsVisible = useRecoilValue(store.artifactsVisible);
+  const artifactsVisibility = useRecoilValue(store.artifactsVisibility);
 
   const setFilesToDelete = useSetFilesToDelete();
 
@@ -64,7 +64,7 @@ export default function Presentation({ children }: { children: React.ReactNode }
         fullPanelCollapse={fullCollapse}
         defaultCollapsed={defaultCollapsed}
         artifacts={
-          artifactsVisible === true && Object.keys(artifacts ?? {}).length > 0 ? (
+          artifactsVisibility === true && Object.keys(artifacts ?? {}).length > 0 ? (
             <EditorProvider>
               <Artifacts />
             </EditorProvider>

client/src/components/Conversations/Conversations.tsx

@@ -220,6 +220,7 @@ const Conversations: FC<ConversationsProps> = ({
                 role="list"
                 aria-label="Conversations"
                 onRowsRendered={handleRowsRendered}
+                tabIndex={-1}
               />
             )}
           </AutoSizer>

client/src/components/Conversations/Convo.tsx

@@ -31,11 +31,11 @@ export default function Conversation({
   const params = useParams();
   const localize = useLocalize();
   const { showToast } = useToastContext();
+  const { navigateToConvo } = useNavigateToConvo();
+  const { data: endpointsConfig } = useGetEndpointsQuery();
   const currentConvoId = useMemo(() => params.conversationId, [params.conversationId]);
   const updateConvoMutation = useUpdateConversationMutation(currentConvoId ?? '');
   const activeConvos = useRecoilValue(store.allConversationsSelector);
-  const { data: endpointsConfig } = useGetEndpointsQuery();
-  const { navigateWithLastTools } = useNavigateToConvo();
   const isSmallScreen = useMediaQuery('(max-width: 768px)');
   const { conversationId, title = '' } = conversation;
 
@@ -102,6 +102,9 @@ export default function Conversation({
   const handleNavigation = (ctrlOrMetaKey: boolean) => {
     if (ctrlOrMetaKey) {
       toggleNav();
+      const baseUrl = window.location.origin;
+      const path = `/c/${conversationId}`;
+      window.open(baseUrl + path, '_blank');
       return;
     }
 
@@ -115,10 +118,10 @@ export default function Conversation({
       document.title = title;
     }
 
-    navigateWithLastTools(
-      conversation,
-      !(conversationId ?? '') || conversationId === Constants.NEW_CONVO,
-    );
+    navigateToConvo(conversation, {
+      currentConvoId,
+      resetLatestMessage: !(conversationId ?? '') || conversationId === Constants.NEW_CONVO,
+    });
   };
 
   const convoOptionsProps = {

client/src/components/Conversations/ConvoLink.tsx

@@ -41,7 +41,7 @@ const ConvoLink: React.FC<ConvoLinkProps> = ({
           onRename();
         }}
         role="button"
-        aria-label={isSmallScreen ? undefined : localize('com_ui_double_click_to_rename')}
+        aria-label={isSmallScreen ? undefined : title || localize('com_ui_untitled')}
       >
         {title || localize('com_ui_untitled')}
       </div>

client/src/components/Conversations/ConvoOptions/ConvoOptions.tsx

@@ -235,10 +235,11 @@ function ConvoOptions({
         <DeleteButton
           title={title ?? ''}
           retainView={retainView}
-          conversationId={conversationId ?? ''}
-          showDeleteDialog={showDeleteDialog}
-          setShowDeleteDialog={setShowDeleteDialog}
           triggerRef={deleteButtonRef}
+          setMenuOpen={setIsPopoverActive}
+          showDeleteDialog={showDeleteDialog}
+          conversationId={conversationId ?? ''}
+          setShowDeleteDialog={setShowDeleteDialog}
         />
       )}
     </>

client/src/components/Conversations/ConvoOptions/DeleteButton.tsx

@@ -4,13 +4,12 @@ import { useQueryClient } from '@tanstack/react-query';
 import { useParams, useNavigate } from 'react-router-dom';
 import type { TMessage } from 'librechat-data-provider';
 import {
-  Label,
-  OGDialog,
-  OGDialogTitle,
-  OGDialogContent,
-  OGDialogHeader,
   Button,
   Spinner,
+  OGDialog,
+  OGDialogTitle,
+  OGDialogHeader,
+  OGDialogContent,
 } from '~/components';
 import { useDeleteConversationMutation } from '~/data-provider';
 import { useLocalize, useNewConvo } from '~/hooks';
@@ -24,14 +23,17 @@ type DeleteButtonProps = {
   showDeleteDialog?: boolean;
   setShowDeleteDialog?: (value: boolean) => void;
   triggerRef?: React.RefObject<HTMLButtonElement>;
+  setMenuOpen?: React.Dispatch<React.SetStateAction<boolean>>;
 };
 
 export function DeleteConversationDialog({
   setShowDeleteDialog,
   conversationId,
+  setMenuOpen,
   retainView,
   title,
 }: {
+  setMenuOpen?: React.Dispatch<React.SetStateAction<boolean>>;
   setShowDeleteDialog: (value: boolean) => void;
   conversationId: string;
   retainView: () => void;
@@ -51,6 +53,7 @@ export function DeleteConversationDialog({
         newConversation();
         navigate('/c/new', { replace: true });
       }
+      setMenuOpen?.(false);
       retainView();
     },
     onError: () => {
@@ -98,6 +101,7 @@ export default function DeleteButton({
   conversationId,
   retainView,
   title,
+  setMenuOpen,
   showDeleteDialog,
   setShowDeleteDialog,
   triggerRef,
@@ -115,6 +119,7 @@ export default function DeleteButton({
       <DeleteConversationDialog
         setShowDeleteDialog={setShowDeleteDialog}
         conversationId={conversationId}
+        setMenuOpen={setMenuOpen}
         retainView={retainView}
         title={title}
       />

client/src/components/Conversations/Fork.tsx

@@ -1,21 +1,13 @@
 import React, { useState, useRef } from 'react';
 import { useRecoilState } from 'recoil';
+import * as Ariakit from '@ariakit/react';
+import { VisuallyHidden } from '@ariakit/react';
 import { GitFork, InfoIcon } from 'lucide-react';
-import * as Popover from '@radix-ui/react-popover';
 import { ForkOptions } from 'librechat-data-provider';
 import { GitCommit, GitBranchPlus, ListTree } from 'lucide-react';
-import {
-  Checkbox,
-  HoverCard,
-  HoverCardTrigger,
-  HoverCardPortal,
-  HoverCardContent,
-} from '~/components/ui';
-import OptionHover from '~/components/SidePanel/Parameters/OptionHover';
 import { TranslationKeys, useLocalize, useNavigateToConvo } from '~/hooks';
 import { useForkConvoMutation } from '~/data-provider';
 import { useToastContext } from '~/Providers';
-import { ESide } from '~/common';
 import { cn } from '~/utils';
 import store from '~/store';
 
@@ -24,11 +16,11 @@ interface PopoverButtonProps {
   setting: ForkOptions;
   onClick: (setting: ForkOptions) => void;
   setActiveSetting: React.Dispatch<React.SetStateAction<TranslationKeys>>;
-  sideOffset?: number;
   timeoutRef: React.MutableRefObject<NodeJS.Timeout | null>;
   hoverInfo?: React.ReactNode | string;
   hoverTitle?: React.ReactNode | string;
   hoverDescription?: React.ReactNode | string;
+  label: string;
 }
 
 const optionLabels: Record<ForkOptions, TranslationKeys> = {
@@ -38,57 +30,84 @@ const optionLabels: Record<ForkOptions, TranslationKeys> = {
   [ForkOptions.DEFAULT]: 'com_ui_fork_from_message',
 };
 
+const chevronDown = (
+  <svg width="1em" height="1em" viewBox="0 0 20 20" fill="currentColor">
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
+    />
+  </svg>
+);
+
 const PopoverButton: React.FC<PopoverButtonProps> = ({
   children,
   setting,
   onClick,
   setActiveSetting,
-  sideOffset = 30,
   timeoutRef,
   hoverInfo,
   hoverTitle,
   hoverDescription,
+  label,
 }) => {
+  const localize = useLocalize();
   return (
-    <HoverCard openDelay={200}>
-      <Popover.Close
-        onClick={() => onClick(setting)}
-        onMouseEnter={() => {
-          if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-            timeoutRef.current = null;
+    <Ariakit.HovercardProvider>
+      <div className="flex flex-col items-center">
+        <Ariakit.HovercardAnchor
+          render={
+            <Ariakit.Button
+              onClick={() => onClick(setting)}
+              onMouseEnter={() => {
+                if (timeoutRef.current) {
+                  clearTimeout(timeoutRef.current);
+                  timeoutRef.current = null;
+                }
+                setActiveSetting(optionLabels[setting]);
+              }}
+              onMouseLeave={() => {
+                if (timeoutRef.current) {
+                  clearTimeout(timeoutRef.current);
+                }
+                timeoutRef.current = setTimeout(() => {
+                  setActiveSetting(optionLabels[ForkOptions.DEFAULT]);
+                }, 175);
+              }}
+              className="mx-1 max-w-14 flex-1 rounded-lg border-2 border-border-medium bg-surface-secondary text-text-secondary transition duration-300 ease-in-out hover:border-border-xheavy hover:bg-surface-hover hover:text-text-primary"
+              aria-label={label}
+            >
+              {children}
+              <VisuallyHidden>{label}</VisuallyHidden>
+            </Ariakit.Button>
           }
-          setActiveSetting(optionLabels[setting]);
-        }}
-        onMouseLeave={() => {
-          if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-          }
-          timeoutRef.current = setTimeout(() => {
-            setActiveSetting(optionLabels[ForkOptions.DEFAULT]);
-          }, 175);
-        }}
-        className="mx-1 max-w-14 flex-1 rounded-lg border-2 bg-white text-gray-700 transition duration-300 ease-in-out hover:bg-gray-200 hover:text-gray-900 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-400 dark:hover:bg-gray-600 dark:hover:text-gray-100"
-        type="button"
-      >
-        {children}
-      </Popover.Close>
-      {((hoverInfo != null && hoverInfo !== '') ||
-        (hoverTitle != null && hoverTitle !== '') ||
-        (hoverDescription != null && hoverDescription !== '')) && (
-        <HoverCardPortal>
-          <HoverCardContent side="right" className="z-[999] w-80 dark:bg-gray-700" sideOffset={sideOffset}>
+        />
+        <Ariakit.HovercardDisclosure className="rounded-full text-text-secondary focus:outline-none focus:ring-2 focus:ring-ring">
+          <VisuallyHidden>
+            {localize('com_ui_fork_more_details_about', { 0: label })}
+          </VisuallyHidden>
+          {chevronDown}
+        </Ariakit.HovercardDisclosure>
+        {((hoverInfo != null && hoverInfo !== '') ||
+          (hoverTitle != null && hoverTitle !== '') ||
+          (hoverDescription != null && hoverDescription !== '')) && (
+          <Ariakit.Hovercard
+            gutter={16}
+            className="z-[999] w-80 rounded-md border border-border-medium bg-surface-secondary p-4 text-text-primary shadow-md"
+            portal={true}
+            unmountOnHide={true}
+          >
             <div className="space-y-2">
-              <p className="flex flex-col gap-2 text-sm text-gray-600 dark:text-gray-300">
+              <p className="flex flex-col gap-2 text-sm text-text-secondary">
                 {hoverInfo && hoverInfo}
                 {hoverTitle && <span className="flex flex-wrap gap-1 font-bold">{hoverTitle}</span>}
                 {hoverDescription && hoverDescription}
               </p>
             </div>
-          </HoverCardContent>
-        </HoverCardPortal>
-      )}
-    </HoverCard>
+          </Ariakit.Hovercard>
+        )}
+      </div>
+    </Ariakit.HovercardProvider>
   );
 };
 
@@ -114,6 +133,9 @@ export default function Fork({
   const [activeSetting, setActiveSetting] = useState(optionLabels.default);
   const [splitAtTarget, setSplitAtTarget] = useRecoilState(store.splitAtTarget);
   const [rememberGlobal, setRememberGlobal] = useRecoilState(store.rememberDefaultFork);
+  const popoverStore = Ariakit.usePopoverStore({
+    placement: 'top',
+  });
   const forkConvo = useForkConvoMutation({
     onSuccess: (data) => {
       navigateToConvo(data.conversation);
@@ -157,173 +179,230 @@ export default function Fork({
   };
 
   return (
-    <Popover.Root>
-      <Popover.Trigger asChild>
-        <button
-          className={cn(
-            'hover-button active rounded-md p-1 text-gray-500 hover:bg-gray-100 hover:text-gray-500 dark:text-gray-400/70 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:invisible md:group-hover:visible ',
-            'data-[state=open]:active focus:opacity-100 data-[state=open]:bg-gray-100 data-[state=open]:text-gray-500 data-[state=open]:dark:bg-gray-700  data-[state=open]:dark:text-gray-200',
-            !isLast ? 'data-[state=open]:opacity-100 md:opacity-0 md:group-hover:opacity-100' : '',
-          )}
-          onClick={(e) => {
-            if (rememberGlobal) {
-              e.preventDefault();
-              forkConvo.mutate({
-                messageId,
-                splitAtTarget,
-                conversationId,
-                option: forkSetting,
-                latestMessageId,
-              });
-            }
-          }}
-          type="button"
-          title={localize('com_ui_fork')}
-        >
-          <GitFork className="h-4 w-4 hover:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400" />
-        </button>
-      </Popover.Trigger>
-      <Popover.Portal>
-        <div dir="ltr">
-          <Popover.Content
-            side="top"
-            role="menu"
-            className="bg-token-surface-primary flex min-h-[120px] min-w-[215px] flex-col gap-3 overflow-hidden rounded-lg bg-white p-2 px-3 shadow-lg dark:bg-gray-700"
-            style={{ outline: 'none', pointerEvents: 'auto', boxSizing: 'border-box' }}
-            tabIndex={-1}
-            sideOffset={5}
-            align="center"
+    <>
+      <Ariakit.PopoverAnchor
+        store={popoverStore}
+        render={
+          <button
+            className={cn(
+              'hover-button active rounded-md p-1 text-gray-500 hover:bg-gray-100 hover:text-gray-500 dark:text-gray-400/70 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:invisible md:group-hover:visible',
+              'data-[state=open]:active focus:opacity-100 data-[state=open]:bg-gray-100 data-[state=open]:text-gray-500 data-[state=open]:dark:bg-gray-700 data-[state=open]:dark:text-gray-200',
+              !isLast
+                ? 'data-[state=open]:opacity-100 md:opacity-0 md:group-hover:opacity-100'
+                : '',
+            )}
+            onClick={(e) => {
+              if (rememberGlobal) {
+                e.preventDefault();
+                forkConvo.mutate({
+                  messageId,
+                  splitAtTarget,
+                  conversationId,
+                  option: forkSetting,
+                  latestMessageId,
+                });
+              } else {
+                popoverStore.toggle();
+              }
+            }}
+            type="button"
+            aria-label={localize('com_ui_fork')}
           >
-            <div className="flex h-6 w-full items-center justify-center text-sm dark:text-gray-200">
-              {localize(activeSetting )}
-              <HoverCard openDelay={50}>
-                <HoverCardTrigger asChild>
-                  <InfoIcon className="ml-auto flex h-4 w-4 gap-2 text-gray-500 dark:text-white/50" />
-                </HoverCardTrigger>
-                <HoverCardPortal>
-                  <HoverCardContent
-                    side="right"
-                    className="z-[999] w-80 dark:bg-gray-700"
-                    sideOffset={19}
+            <GitFork className="h-4 w-4 hover:text-gray-500 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400" />
+          </button>
+        }
+      />
+      <Ariakit.Popover
+        store={popoverStore}
+        gutter={5}
+        className="flex min-h-[120px] min-w-[215px] flex-col gap-3 overflow-hidden rounded-lg border border-border-heavy bg-surface-secondary p-2 px-3 shadow-lg"
+        style={{
+          outline: 'none',
+          pointerEvents: 'auto',
+          zIndex: 50,
+        }}
+        portal={true}
+        unmountOnHide={true}
+      >
+        <div className="flex h-8 w-full items-center justify-center text-sm text-text-primary">
+          {localize(activeSetting)}
+          <Ariakit.HovercardProvider>
+            <div className="ml-auto flex h-6 w-6 items-center justify-center gap-1">
+              <Ariakit.HovercardAnchor
+                render={
+                  <button
+                    className="flex h-5 w-5 items-center rounded-full text-text-secondary"
+                    aria-label={localize('com_ui_fork_info_button_label')}
                   >
-                    <div className="flex flex-col gap-2 space-y-2 text-sm text-gray-600 dark:text-gray-300">
-                      <span>{localize('com_ui_fork_info_1')}</span>
-                      <span>{localize('com_ui_fork_info_2')}</span>
-                      <span>
-                        {localize('com_ui_fork_info_3', {
-                          0: localize('com_ui_fork_split_target'),
-                        })}
-                      </span>
-                    </div>
-                  </HoverCardContent>
-                </HoverCardPortal>
-              </HoverCard>
-            </div>
-            <div className="flex h-full w-full items-center justify-center gap-1">
-              <PopoverButton
-                sideOffset={155}
-                setActiveSetting={setActiveSetting}
-                timeoutRef={timeoutRef}
-                onClick={onClick}
-                setting={ForkOptions.DIRECT_PATH}
-                hoverTitle={
-                  <>
-                    <GitCommit className="h-5 w-5 rotate-90" />
-                    {localize(optionLabels[ForkOptions.DIRECT_PATH])}
-                  </>
+                    <InfoIcon />
+                  </button>
                 }
-                hoverDescription={localize('com_ui_fork_info_visible')}
-              >
-                <HoverCardTrigger asChild>
-                  <GitCommit className="h-full w-full rotate-90 p-2" />
-                </HoverCardTrigger>
-              </PopoverButton>
-              <PopoverButton
-                sideOffset={90}
-                setActiveSetting={setActiveSetting}
-                timeoutRef={timeoutRef}
-                onClick={onClick}
-                setting={ForkOptions.INCLUDE_BRANCHES}
-                hoverTitle={
-                  <>
-                    <GitBranchPlus className="h-4 w-4 rotate-180" />
-                    {localize(optionLabels[ForkOptions.INCLUDE_BRANCHES])}
-                  </>
-                }
-                hoverDescription={localize('com_ui_fork_info_branches')}
-              >
-                <HoverCardTrigger asChild>
-                  <GitBranchPlus className="h-full w-full rotate-180 p-2" />
-                </HoverCardTrigger>
-              </PopoverButton>
-              <PopoverButton
-                sideOffset={25}
-                setActiveSetting={setActiveSetting}
-                timeoutRef={timeoutRef}
-                onClick={onClick}
-                setting={ForkOptions.TARGET_LEVEL}
-                hoverTitle={
-                  <>
-                    <ListTree className="h-5 w-5" />
-                    {`${localize(
-                      optionLabels[ForkOptions.TARGET_LEVEL],
-                    )} (${localize('com_endpoint_default')})`}
-                  </>
-                }
-                hoverDescription={localize('com_ui_fork_info_target')}
-              >
-                <HoverCardTrigger asChild>
-                  <ListTree className="h-full w-full p-2" />
-                </HoverCardTrigger>
-              </PopoverButton>
-            </div>
-            <HoverCard openDelay={50}>
-              <HoverCardTrigger asChild>
-                <div className="flex h-6 w-full items-center justify-start text-sm dark:text-gray-300 dark:hover:text-gray-200">
-                  <Checkbox
-                    checked={splitAtTarget}
-                    onCheckedChange={(checked: boolean) => setSplitAtTarget(checked)}
-                    className="m-2 transition duration-300 ease-in-out"
-                  />
-                  {localize('com_ui_fork_split_target')}
-                </div>
-              </HoverCardTrigger>
-              <OptionHover
-                side={ESide.Right}
-                description="com_ui_fork_info_start"
-                langCode={true}
-                sideOffset={20}
               />
-            </HoverCard>
-            <HoverCard openDelay={50}>
-              <HoverCardTrigger asChild>
-                <div className="flex h-6 w-full items-center justify-start text-sm dark:text-gray-300 dark:hover:text-gray-200">
-                  <Checkbox
+              <Ariakit.HovercardDisclosure className="rounded-full text-text-secondary focus:outline-none focus:ring-2 focus:ring-ring">
+                <VisuallyHidden>{localize('com_ui_fork_more_info_options')}</VisuallyHidden>
+                {chevronDown}
+              </Ariakit.HovercardDisclosure>
+            </div>
+            <Ariakit.Hovercard
+              gutter={19}
+              className="z-[999] w-80 rounded-md border border-border-medium bg-surface-secondary p-4 text-text-primary shadow-md"
+              portal={true}
+              unmountOnHide={true}
+            >
+              <div className="flex flex-col gap-2 space-y-2 text-sm text-text-secondary">
+                <span>{localize('com_ui_fork_info_1')}</span>
+                <span>{localize('com_ui_fork_info_2')}</span>
+                <span>
+                  {localize('com_ui_fork_info_3', {
+                    0: localize('com_ui_fork_split_target'),
+                  })}
+                </span>
+              </div>
+            </Ariakit.Hovercard>
+          </Ariakit.HovercardProvider>
+        </div>
+        <div className="flex h-full w-full items-center justify-center gap-1">
+          <PopoverButton
+            setActiveSetting={setActiveSetting}
+            timeoutRef={timeoutRef}
+            onClick={onClick}
+            setting={ForkOptions.DIRECT_PATH}
+            label={localize(optionLabels[ForkOptions.DIRECT_PATH])}
+            hoverTitle={
+              <>
+                <GitCommit className="h-5 w-5 rotate-90" />
+                {localize(optionLabels[ForkOptions.DIRECT_PATH])}
+              </>
+            }
+            hoverDescription={localize('com_ui_fork_info_visible')}
+          >
+            <GitCommit className="h-full w-full rotate-90 p-2" />
+          </PopoverButton>
+          <PopoverButton
+            setActiveSetting={setActiveSetting}
+            timeoutRef={timeoutRef}
+            onClick={onClick}
+            setting={ForkOptions.INCLUDE_BRANCHES}
+            label={localize(optionLabels[ForkOptions.INCLUDE_BRANCHES])}
+            hoverTitle={
+              <>
+                <GitBranchPlus className="h-4 w-4 rotate-180" />
+                {localize(optionLabels[ForkOptions.INCLUDE_BRANCHES])}
+              </>
+            }
+            hoverDescription={localize('com_ui_fork_info_branches')}
+          >
+            <GitBranchPlus className="h-full w-full rotate-180 p-2" />
+          </PopoverButton>
+          <PopoverButton
+            setActiveSetting={setActiveSetting}
+            timeoutRef={timeoutRef}
+            onClick={onClick}
+            setting={ForkOptions.TARGET_LEVEL}
+            label={localize(optionLabels[ForkOptions.TARGET_LEVEL])}
+            hoverTitle={
+              <>
+                <ListTree className="h-5 w-5" />
+                {`${localize(
+                  optionLabels[ForkOptions.TARGET_LEVEL],
+                )} (${localize('com_endpoint_default')})`}
+              </>
+            }
+            hoverDescription={localize('com_ui_fork_info_target')}
+          >
+            <ListTree className="h-full w-full p-2" />
+          </PopoverButton>
+        </div>
+        <Ariakit.HovercardProvider>
+          <div className="flex items-center">
+            <Ariakit.HovercardAnchor
+              render={
+                <div className="flex h-6 w-full select-none items-center justify-start rounded-md text-sm text-text-secondary hover:text-text-primary">
+                  <Ariakit.Checkbox
+                    id="split-target-checkbox"
+                    checked={splitAtTarget}
+                    onChange={(event) => setSplitAtTarget(event.target.checked)}
+                    className="m-2 h-4 w-4 rounded-sm border border-primary ring-offset-background transition duration-300 ease-in-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground"
+                    aria-label={localize('com_ui_fork_split_target')}
+                  />
+                  <label htmlFor="split-target-checkbox" className="ml-2 cursor-pointer">
+                    {localize('com_ui_fork_split_target')}
+                  </label>
+                </div>
+              }
+            />
+            <Ariakit.HovercardDisclosure className="rounded-full text-text-secondary focus:outline-none focus:ring-2 focus:ring-ring">
+              <VisuallyHidden>
+                {localize('com_ui_fork_more_info_split_target', {
+                  0: localize('com_ui_fork_split_target'),
+                })}
+              </VisuallyHidden>
+              {chevronDown}
+            </Ariakit.HovercardDisclosure>
+          </div>
+          <Ariakit.Hovercard
+            gutter={32}
+            className="z-[999] w-80 select-none rounded-md border border-border-medium bg-surface-secondary p-4 text-text-primary shadow-md"
+            portal={true}
+            unmountOnHide={true}
+          >
+            <div className="space-y-2">
+              <p className="text-sm text-text-secondary">{localize('com_ui_fork_info_start')}</p>
+            </div>
+          </Ariakit.Hovercard>
+        </Ariakit.HovercardProvider>
+        <Ariakit.HovercardProvider>
+          <div className="flex items-center">
+            <Ariakit.HovercardAnchor
+              render={
+                <div
+                  onClick={() => setRemember((prev) => !prev)}
+                  className="flex h-6 w-full select-none items-center justify-start rounded-md text-sm text-text-secondary hover:text-text-primary"
+                >
+                  <Ariakit.Checkbox
+                    id="remember-checkbox"
                     checked={remember}
-                    onCheckedChange={(checked: boolean) => {
+                    onChange={(event) => {
+                      const checked = event.target.checked;
+                      console.log('checked', checked);
                       if (checked) {
                         showToast({
                           message: localize('com_ui_fork_remember_checked'),
                           status: 'info',
                         });
                       }
-                      setRemember(checked);
+                      return setRemember(checked);
                     }}
-                    className="m-2 transition duration-300 ease-in-out"
+                    className="m-2 h-4 w-4 rounded-sm border border-primary ring-offset-background transition duration-300 ease-in-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground"
+                    aria-label={localize('com_ui_fork_remember')}
                   />
-                  {localize('com_ui_fork_remember')}
+                  <label htmlFor="remember-checkbox" className="ml-2 cursor-pointer">
+                    {localize('com_ui_fork_remember')}
+                  </label>
                 </div>
-              </HoverCardTrigger>
-              <OptionHover
-                side={ESide.Right}
-                description="com_ui_fork_info_remember"
-                langCode={true}
-                sideOffset={20}
-              />
-            </HoverCard>
-          </Popover.Content>
-        </div>
-      </Popover.Portal>
-    </Popover.Root>
+              }
+            />
+            <Ariakit.HovercardDisclosure className="rounded-full text-text-secondary focus:outline-none focus:ring-2 focus:ring-ring">
+              <VisuallyHidden>
+                {localize('com_ui_fork_more_info_remember', {
+                  0: localize('com_ui_fork_remember'),
+                })}
+              </VisuallyHidden>
+              {chevronDown}
+            </Ariakit.HovercardDisclosure>
+          </div>
+          <Ariakit.Hovercard
+            gutter={14}
+            className="z-[999] w-80 rounded-md border border-border-medium bg-surface-secondary p-4 text-text-primary shadow-md"
+            portal={true}
+            unmountOnHide={true}
+          >
+            <div className="space-y-2">
+              <p className="text-sm text-text-secondary">{localize('com_ui_fork_info_remember')}</p>
+            </div>
+          </Ariakit.Hovercard>
+        </Ariakit.HovercardProvider>
+      </Ariakit.Popover>
+    </>
   );
 }

client/src/components/Endpoints/EndpointIcon.tsx

@@ -63,7 +63,6 @@ export default function EndpointIcon({
         isCreatedByUser={false}
         chatGptLabel={undefined}
         modelLabel={undefined}
-        jailbreak={undefined}
       />
     );
   }

client/src/components/Endpoints/MessageEndpointIcon.tsx

@@ -34,10 +34,7 @@ function getOpenAIColor(_model: string | null | undefined) {
 function getGoogleIcon(model: string | null | undefined, size: number) {
   if (model?.toLowerCase().includes('code') === true) {
     return <CodeyIcon size={size * 0.75} />;
-  } else if (
-    model?.toLowerCase().includes('gemini') === true ||
-    model?.toLowerCase().includes('learnlm') === true
-  ) {
+  } else if (/gemini|learnlm|gemma/.test(model?.toLowerCase() ?? '')) {
     return <GeminiIcon size={size * 0.7} />;
   } else {
     return <PaLMIcon size={size * 0.7} />;
@@ -52,6 +49,8 @@ function getGoogleModelName(model: string | null | undefined) {
     model?.toLowerCase().includes('learnlm') === true
   ) {
     return 'Gemini';
+  } else if (model?.toLowerCase().includes('gemma') === true) {
+    return 'Gemma';
   } else {
     return 'PaLM2';
   }

client/src/components/Nav/Bookmarks/BookmarkNav.tsx

@@ -1,10 +1,12 @@
-import { type FC } from 'react';
+import { useMemo } from 'react';
+import type { FC } from 'react';
 import { useRecoilValue } from 'recoil';
 import { Menu, MenuButton, MenuItems } from '@headlessui/react';
 import { BookmarkFilledIcon, BookmarkIcon } from '@radix-ui/react-icons';
 import { BookmarkContext } from '~/Providers/BookmarkContext';
 import { useGetConversationTags } from '~/data-provider';
 import BookmarkNavItems from './BookmarkNavItems';
+import { TooltipAnchor } from '~/components/ui';
 import { useLocalize } from '~/hooks';
 import { cn } from '~/utils';
 import store from '~/store';
@@ -19,33 +21,48 @@ const BookmarkNav: FC<BookmarkNavProps> = ({ tags, setTags, isSmallScreen }: Boo
   const localize = useLocalize();
   const { data } = useGetConversationTags();
   const conversation = useRecoilValue(store.conversationByIndex(0));
+  const label = useMemo(
+    () => (tags.length > 0 ? tags.join(', ') : localize('com_ui_bookmarks')),
+    [tags, localize],
+  );
 
   return (
     <Menu as="div" className="group relative">
       {({ open }) => (
         <>
-          <MenuButton
-            className={cn(
-              'mt-text-sm flex h-10 w-full items-center gap-2 rounded-lg p-2 text-sm transition-colors duration-200 hover:bg-surface-active-alt',
-              open ? 'bg-surface-active-alt' : '',
-              isSmallScreen ? 'h-12' : '',
-            )}
-            data-testid="bookmark-menu"
-          >
-            <div className="h-7 w-7 flex-shrink-0">
-              <div className="relative flex h-full items-center justify-center text-text-primary">
-                {tags.length > 0 ? (
-                  <BookmarkFilledIcon className="h-4 w-4" aria-hidden="true" />
-                ) : (
-                  <BookmarkIcon className="h-4 w-4" aria-hidden="true" />
+          <TooltipAnchor
+            description={label}
+            render={
+              <MenuButton
+                id="bookmark-menu-button"
+                aria-label={localize('com_ui_bookmarks')}
+                className={cn(
+                  'flex items-center justify-center',
+                  'size-10 border-none text-text-primary hover:bg-accent hover:text-accent-foreground',
+                  'rounded-full border-none p-2 hover:bg-surface-hover md:rounded-xl',
+                  open ? 'bg-surface-hover' : '',
                 )}
-              </div>
-            </div>
-            <div className="grow overflow-hidden whitespace-nowrap text-left text-sm font-medium text-text-primary">
-              {tags.length > 0 ? tags.join(', ') : localize('com_ui_bookmarks')}
-            </div>
-          </MenuButton>
-          <MenuItems className="absolute left-0 top-full z-[100] mt-1 w-full translate-y-0 overflow-hidden rounded-lg bg-surface-secondary p-1.5 shadow-lg outline-none">
+                data-testid="bookmark-menu"
+              >
+                {tags.length > 0 ? (
+                  <BookmarkFilledIcon
+                    /** `isSmallScreen` is used because lazy loading is not influencing `md:` prefix for some reason */
+                    className={cn('text-text-primary', isSmallScreen ? 'icon-md-heavy' : 'icon-lg')}
+                    aria-hidden="true"
+                  />
+                ) : (
+                  <BookmarkIcon
+                    className={cn('text-text-primary', isSmallScreen ? 'icon-md-heavy' : 'icon-lg')}
+                    aria-hidden="true"
+                  />
+                )}
+              </MenuButton>
+            }
+          />
+          <MenuItems
+            anchor="bottom"
+            className="absolute left-0 top-full z-[100] mt-1 w-60 translate-y-0 overflow-hidden rounded-lg bg-surface-secondary p-1.5 shadow-lg outline-none"
+          >
             {data && conversation && (
               <BookmarkContext.Provider value={{ bookmarks: data.filter((tag) => tag.count > 0) }}>
                 <BookmarkNavItems

client/src/components/Nav/MobileNav.tsx

@@ -61,6 +61,7 @@ export default function MobileNav({
             [QueryKeys.messages, conversation?.conversationId ?? Constants.NEW_CONVO],
             [],
           );
+          queryClient.invalidateQueries([QueryKeys.messages]);
           newConversation();
         }}
       >

client/src/components/Nav/Nav.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useState, useMemo, memo, lazy, Suspense, useRef } from 'react';
 import { useRecoilValue } from 'recoil';
 import { PermissionTypes, Permissions } from 'librechat-data-provider';
-import type { TConversation, ConversationListResponse } from 'librechat-data-provider';
+import type { ConversationListResponse } from 'librechat-data-provider';
 import type { InfiniteQueryObserverResult } from '@tanstack/react-query';
 import {
   useLocalize,
@@ -13,7 +13,6 @@ import {
 } from '~/hooks';
 import { useConversationsInfiniteQuery } from '~/data-provider';
 import { Conversations } from '~/components/Conversations';
-import NavToggle from './NavToggle';
 import SearchBar from './SearchBar';
 import NewChat from './NewChat';
 import { cn } from '~/utils';
@@ -59,7 +58,6 @@ const Nav = memo(
     const [navWidth, setNavWidth] = useState(NAV_WIDTH_DESKTOP);
     const isSmallScreen = useMediaQuery('(max-width: 768px)');
     const [newUser, setNewUser] = useLocalStorage('newUser', true);
-    const [isToggleHovering, setIsToggleHovering] = useState(false);
     const [showLoading, setShowLoading] = useState(false);
     const [tags, setTags] = useState<string[]>([]);
 
@@ -152,20 +150,21 @@ const Nav = memo(
     }, [isFetchingNextPage, computedHasNextPage, fetchNextPage]);
 
     const subHeaders = useMemo(
-      () => (
-        <>
-          {search.enabled === true && <SearchBar isSmallScreen={isSmallScreen} />}
-          {hasAccessToBookmarks && (
-            <>
-              <div className="mt-1.5" />
-              <Suspense fallback={null}>
-                <BookmarkNav tags={tags} setTags={setTags} isSmallScreen={isSmallScreen} />
-              </Suspense>
-            </>
-          )}
-        </>
-      ),
-      [search.enabled, hasAccessToBookmarks, isSmallScreen, tags, setTags],
+      () => search.enabled === true && <SearchBar isSmallScreen={isSmallScreen} />,
+      [search.enabled, isSmallScreen],
+    );
+
+    const headerButtons = useMemo(
+      () =>
+        hasAccessToBookmarks && (
+          <>
+            <div className="mt-1.5" />
+            <Suspense fallback={null}>
+              <BookmarkNav tags={tags} setTags={setTags} isSmallScreen={isSmallScreen} />
+            </Suspense>
+          </>
+        ),
+      [hasAccessToBookmarks, tags, isSmallScreen],
     );
 
     const [isSearchLoading, setIsSearchLoading] = useState(
@@ -198,23 +197,19 @@ const Nav = memo(
         >
           <div className="h-full w-[320px] md:w-[260px]">
             <div className="flex h-full flex-col">
-              <div
-                className={cn(
-                  'flex h-full flex-col transition-opacity',
-                  isToggleHovering && !isSmallScreen ? 'opacity-50' : 'opacity-100',
-                )}
-              >
+              <div className="flex h-full flex-col transition-opacity">
                 <div className="flex h-full flex-col">
                   <nav
                     id="chat-history-nav"
                     aria-label={localize('com_ui_chat_history')}
-                    className="flex h-full flex-col px-3 pb-3.5"
+                    className="flex h-full flex-col px-2 pb-3.5 md:px-3"
                   >
                     <div className="flex flex-1 flex-col" ref={outerContainerRef}>
                       <MemoNewChat
-                        toggleNav={itemToggleNav}
-                        isSmallScreen={isSmallScreen}
                         subHeaders={subHeaders}
+                        toggleNav={toggleNavVisible}
+                        headerButtons={headerButtons}
+                        isSmallScreen={isSmallScreen}
                       />
                       <Conversations
                         conversations={conversations}
@@ -235,15 +230,6 @@ const Nav = memo(
             </div>
           </div>
         </div>
-
-        <NavToggle
-          isHovering={isToggleHovering}
-          setIsHovering={setIsToggleHovering}
-          onToggle={toggleNavVisible}
-          navVisible={navVisible}
-          className="fixed left-0 top-1/2 z-40 hidden md:flex"
-        />
-
         {isSmallScreen && <NavMask navVisible={navVisible} toggleNavVisible={toggleNavVisible} />}
       </>
     );

client/src/components/Nav/NewChat.tsx

@@ -1,88 +1,27 @@
-import React, { useMemo, useCallback } from 'react';
-import { Search } from 'lucide-react';
+import React, { useCallback } from 'react';
 import { useRecoilValue } from 'recoil';
 import { useNavigate } from 'react-router-dom';
 import { useQueryClient } from '@tanstack/react-query';
 import { QueryKeys, Constants } from 'librechat-data-provider';
-import type { TConversation, TMessage } from 'librechat-data-provider';
-import { getEndpointField, getIconEndpoint, getIconKey } from '~/utils';
-import ConvoIconURL from '~/components/Endpoints/ConvoIconURL';
-import { useGetEndpointsQuery } from '~/data-provider';
+import type { TMessage, TStartupConfig } from 'librechat-data-provider';
+import { NewChatIcon, MobileSidebar, Sidebar } from '~/components/svg';
+import { getDefaultModelSpec, getModelSpecPreset } from '~/utils';
+import { TooltipAnchor, Button } from '~/components/ui';
 import { useLocalize, useNewConvo } from '~/hooks';
-import { icons } from '~/hooks/Endpoint/Icons';
-import { NewChatIcon } from '~/components/svg';
-import { cn } from '~/utils';
 import store from '~/store';
 
-const NewChatButtonIcon = React.memo(({ conversation }: { conversation: TConversation | null }) => {
-  const { data: endpointsConfig } = useGetEndpointsQuery();
-  const search = useRecoilValue(store.search);
-  const searchQuery = search.debouncedQuery;
-
-  const computedIcon = useMemo(() => {
-    if (searchQuery) {
-      return null;
-    }
-    let { endpoint = '' } = conversation ?? {};
-    const iconURL = conversation?.iconURL ?? '';
-    endpoint = getIconEndpoint({ endpointsConfig, iconURL, endpoint });
-    const endpointType = getEndpointField(endpointsConfig, endpoint, 'type');
-    const endpointIconURL = getEndpointField(endpointsConfig, endpoint, 'iconURL');
-    const iconKey = getIconKey({ endpoint, endpointsConfig, endpointType, endpointIconURL });
-    const Icon = icons[iconKey];
-    return { iconURL, endpoint, endpointType, endpointIconURL, Icon };
-  }, [searchQuery, conversation, endpointsConfig]);
-
-  if (searchQuery) {
-    return (
-      <div className="shadow-stroke relative flex h-7 w-7 items-center justify-center rounded-full bg-white text-black dark:bg-white">
-        <Search className="h-5 w-5" />
-      </div>
-    );
-  }
-
-  if (!computedIcon) {
-    return null;
-  }
-
-  const { iconURL, endpoint, endpointIconURL, Icon } = computedIcon;
-
-  return (
-    <div className="h-7 w-7 flex-shrink-0">
-      {iconURL && iconURL.includes('http') ? (
-        <ConvoIconURL
-          iconURL={iconURL}
-          modelLabel={conversation?.chatGptLabel ?? conversation?.modelLabel ?? ''}
-          endpointIconURL={iconURL}
-          context="nav"
-        />
-      ) : (
-        <div className="shadow-stroke relative flex h-full items-center justify-center rounded-full bg-white text-black">
-          {endpoint && Icon && (
-            <Icon
-              size={41}
-              context="nav"
-              className="h-2/3 w-2/3"
-              endpoint={endpoint}
-              iconURL={endpointIconURL}
-            />
-          )}
-        </div>
-      )}
-    </div>
-  );
-});
-
 export default function NewChat({
   index = 0,
   toggleNav,
   subHeaders,
   isSmallScreen,
+  headerButtons,
 }: {
   index?: number;
   toggleNav: () => void;
+  isSmallScreen?: boolean;
   subHeaders?: React.ReactNode;
-  isSmallScreen: boolean;
+  headerButtons?: React.ReactNode;
 }) {
   const queryClient = useQueryClient();
   /** Note: this component needs an explicit index passed if using more than one */
@@ -91,48 +30,65 @@ export default function NewChat({
   const localize = useLocalize();
   const { conversation } = store.useCreateConversationAtom(index);
 
-  const clickHandler = useCallback(
-    (event: React.MouseEvent<HTMLAnchorElement>) => {
-      if (event.button === 0 && !(event.ctrlKey || event.metaKey)) {
-        event.preventDefault();
-        queryClient.setQueryData<TMessage[]>(
-          [QueryKeys.messages, conversation?.conversationId ?? Constants.NEW_CONVO],
-          [],
-        );
-        newConvo();
-        navigate('/c/new');
+  const clickHandler: React.MouseEventHandler<HTMLButtonElement> = useCallback(
+    (e) => {
+      if (e.button === 0 && (e.ctrlKey || e.metaKey)) {
+        window.open('/c/new', '_blank');
+        return;
+      }
+      queryClient.setQueryData<TMessage[]>(
+        [QueryKeys.messages, conversation?.conversationId ?? Constants.NEW_CONVO],
+        [],
+      );
+      queryClient.invalidateQueries([QueryKeys.messages]);
+      newConvo();
+      navigate('/c/new', { state: { focusChat: true } });
+      if (isSmallScreen) {
         toggleNav();
       }
     },
-    [queryClient, conversation, newConvo, navigate, toggleNav],
+    [queryClient, conversation, newConvo, navigate, toggleNav, isSmallScreen],
   );
 
   return (
-    <div className="sticky left-0 right-0 top-0 z-50 bg-surface-primary-alt pt-3.5">
-      <div className="pb-0.5 last:pb-0" style={{ transform: 'none' }}>
-        <a
-          href="/"
-          tabIndex={0}
-          data-testid="nav-new-chat-button"
-          onClick={clickHandler}
-          className={cn(
-            'group flex h-10 items-center gap-2 rounded-lg px-2 font-medium transition-colors duration-200 hover:bg-surface-hover',
-            isSmallScreen ? 'h-14' : '',
-          )}
-          aria-label={localize('com_ui_new_chat')}
-        >
-          <NewChatButtonIcon conversation={conversation} />
-          <div className="grow overflow-hidden text-ellipsis whitespace-nowrap text-sm text-text-primary">
-            {localize('com_ui_new_chat')}
-          </div>
-          <div className="flex gap-3">
-            <span className="flex items-center" data-state="closed">
-              <NewChatIcon className="size-5" />
-            </span>
-          </div>
-        </a>
+    <>
+      <div className="flex items-center justify-between py-[2px] md:py-2">
+        <TooltipAnchor
+          description={localize('com_nav_close_sidebar')}
+          render={
+            <Button
+              size="icon"
+              variant="outline"
+              data-testid="close-sidebar-button"
+              aria-label={localize('com_nav_close_sidebar')}
+              className="rounded-full border-none bg-transparent p-2 hover:bg-surface-hover md:rounded-xl"
+              onClick={toggleNav}
+            >
+              <Sidebar className="max-md:hidden" />
+              <MobileSidebar className="m-1 inline-flex size-10 items-center justify-center md:hidden" />
+            </Button>
+          }
+        />
+        <div className="flex">
+          {headerButtons}
+          <TooltipAnchor
+            description={localize('com_ui_new_chat')}
+            render={
+              <Button
+                size="icon"
+                variant="outline"
+                data-testid="nav-new-chat-button"
+                aria-label={localize('com_ui_new_chat')}
+                className="rounded-full border-none bg-transparent p-2 hover:bg-surface-hover md:rounded-xl"
+                onClick={clickHandler}
+              >
+                <NewChatIcon className="icon-md md:h-6 md:w-6" />
+              </Button>
+            }
+          />
+        </div>
       </div>
       {subHeaders != null ? subHeaders : null}
-    </div>
+    </>
   );
 }

client/src/components/Nav/SearchBar.tsx

@@ -1,7 +1,7 @@
-import { forwardRef, useState, useCallback, useMemo, useEffect, Ref } from 'react';
+import React, { forwardRef, useState, useCallback, useMemo, useEffect, useRef } from 'react';
 import debounce from 'lodash/debounce';
+import { useRecoilState } from 'recoil';
 import { Search, X } from 'lucide-react';
-import { useSetRecoilState, useRecoilValue } from 'recoil';
 import { QueryKeys } from 'librechat-data-provider';
 import { useQueryClient } from '@tanstack/react-query';
 import { useLocation, useNavigate } from 'react-router-dom';
@@ -13,7 +13,7 @@ type SearchBarProps = {
   isSmallScreen?: boolean;
 };
 
-const SearchBar = forwardRef((props: SearchBarProps, ref: Ref<HTMLDivElement>) => {
+const SearchBar = forwardRef((props: SearchBarProps, ref: React.Ref<HTMLDivElement>) => {
   const localize = useLocalize();
   const location = useLocation();
   const queryClient = useQueryClient();
@@ -21,11 +21,11 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: Ref<HTMLDivElement>) =
   const { isSmallScreen } = props;
 
   const [text, setText] = useState('');
+  const inputRef = useRef<HTMLInputElement>(null);
   const [showClearIcon, setShowClearIcon] = useState(false);
 
   const { newConversation } = useNewConvo();
-  const setSearchState = useSetRecoilState(store.search);
-  const search = useRecoilValue(store.search);
+  const [search, setSearchState] = useRecoilState(store.search);
 
   const clearSearch = useCallback(() => {
     if (location.pathname.includes('/search')) {
@@ -44,6 +44,7 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: Ref<HTMLDivElement>) =
       isTyping: false,
     }));
     clearSearch();
+    inputRef.current?.focus();
   }, [setSearchState, clearSearch]);
 
   const handleKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {
@@ -108,6 +109,7 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: Ref<HTMLDivElement>) =
       <Search className="absolute left-3 h-4 w-4 text-text-secondary group-focus-within:text-text-primary group-hover:text-text-primary" />
       <input
         type="text"
+        ref={inputRef}
         className="m-0 mr-0 w-full border-none bg-transparent p-0 pl-7 text-sm leading-tight placeholder-text-secondary placeholder-opacity-100 focus-visible:outline-none group-focus-within:placeholder-text-primary group-hover:placeholder-text-primary"
         value={text}
         onChange={onChange}
@@ -122,14 +124,20 @@ const SearchBar = forwardRef((props: SearchBarProps, ref: Ref<HTMLDivElement>) =
         autoComplete="off"
         dir="auto"
       />
-      <X
+      <button
+        type="button"
+        aria-label={`${localize('com_ui_clear')} ${localize('com_ui_search')}`}
         className={cn(
-          'absolute right-[7px] h-5 w-5 cursor-pointer transition-opacity duration-200',
+          'absolute right-[7px] flex h-5 w-5 items-center justify-center rounded-full border-none bg-transparent p-0 transition-opacity duration-200',
           showClearIcon ? 'opacity-100' : 'opacity-0',
           isSmallScreen === true ? 'right-[16px]' : '',
         )}
         onClick={clearText}
-      />
+        tabIndex={showClearIcon ? 0 : -1}
+        disabled={!showClearIcon}
+      >
+        <X className="h-5 w-5 cursor-pointer" />
+      </button>
     </div>
   );
 });

client/src/components/Nav/SettingsTabs/Chat/ForkSettings.tsx

@@ -44,6 +44,7 @@ export const ForkSettings = () => {
               options={forkOptions}
               sizeClasses="w-[200px]"
               testId="fork-setting-dropdown"
+              className="z-[50]"
             />
           </div>
         </div>

client/src/components/Nav/SettingsTabs/General/General.tsx

@@ -80,8 +80,10 @@ export const LangSelector = ({
     { value: 'zh-Hans', label: localize('com_nav_lang_chinese') },
     { value: 'zh-Hant', label: localize('com_nav_lang_traditional_chinese') },
     { value: 'ar-EG', label: localize('com_nav_lang_arabic') },
+    { value: 'da-DK', label: localize('com_nav_lang_danish') },
     { value: 'de-DE', label: localize('com_nav_lang_german') },
     { value: 'es-ES', label: localize('com_nav_lang_spanish') },
+    { value: 'ca-ES', label: localize('com_nav_lang_catalan') },
     { value: 'et-EE', label: localize('com_nav_lang_estonian') },
     { value: 'fa-IR', label: localize('com_nav_lang_persian') },
     { value: 'fr-FR', label: localize('com_nav_lang_french') },
@@ -94,6 +96,7 @@ export const LangSelector = ({
     { value: 'ru-RU', label: localize('com_nav_lang_russian') },
     { value: 'ja-JP', label: localize('com_nav_lang_japanese') },
     { value: 'ka-GE', label: localize('com_nav_lang_georgian') },
+    { value: 'cs-CZ', label: localize('com_nav_lang_czech') },
     { value: 'sv-SE', label: localize('com_nav_lang_swedish') },
     { value: 'ko-KR', label: localize('com_nav_lang_korean') },
     { value: 'vi-VN', label: localize('com_nav_lang_vietnamese') },

client/src/components/Nav/SettingsTabs/Speech/STT/LanguageSTTDropdown.tsx

@@ -102,8 +102,8 @@ export default function LanguageSTTDropdown() {
         onChange={handleSelect}
         options={languageOptions}
         sizeClasses="[--anchor-max-height:256px]"
-        anchor="bottom start"
         testId="LanguageSTTDropdown"
+        className="z-50"
       />
     </div>
   );

client/src/components/Prompts/AdminSettings.tsx

@@ -66,7 +66,7 @@ const AdminSettings = () => {
   const [confirmAdminUseChange, setConfirmAdminUseChange] = useState<{
     newValue: boolean;
     callback: (value: boolean) => void;
-      } | null>(null);
+  } | null>(null);
   const { mutate, isLoading } = useUpdatePromptPermissionsMutation({
     onSuccess: () => {
       showToast({ status: 'success', message: localize('com_ui_saved') });
@@ -166,6 +166,7 @@ const AdminSettings = () => {
             <div className="flex items-center gap-2">
               <span className="font-medium">{localize('com_ui_role_select')}:</span>
               <DropdownPopup
+                unmountOnHide={true}
                 menuId="prompt-role-dropdown"
                 isOpen={isRoleMenuOpen}
                 setIsOpen={setIsRoleMenuOpen}
@@ -191,11 +192,11 @@ const AdminSettings = () => {
                       setValue={setValue}
                       {...(selectedRole === SystemRoles.ADMIN && promptPerm === Permissions.USE
                         ? {
-                          confirmChange: (
-                            newValue: boolean,
-                            onChange: (value: boolean) => void,
-                          ) => setConfirmAdminUseChange({ newValue, callback: onChange }),
-                        }
+                            confirmChange: (
+                              newValue: boolean,
+                              onChange: (value: boolean) => void,
+                            ) => setConfirmAdminUseChange({ newValue, callback: onChange }),
+                          }
                         : {})}
                     />
                     {selectedRole === SystemRoles.ADMIN && promptPerm === Permissions.USE && (