mirror of
https://github.com/danny-avila/LibreChat.git
synced 2026-07-04 05:13:52 +00:00
40d2f682a4
Custom icons (MCP server iconPath, model spec groupIcon) were rendered as plain <img>, so monochrome SVGs kept fixed dark colors and were nearly invisible in dark theme. Introduce a shared CustomIcon component that detects monochrome SVG glyphs and tints them with currentColor so they follow the active theme, while multi-color SVG logos and raster images keep their original colors. The monochrome decision parses the SVG's color tokens; content is fetched once, cached, and any failure falls back to the original image. Monochrome SVGs render via CSS mask, never inlined, so no SVG markup reaches the DOM. Apply across all custom-icon surfaces: MCP settings cards, the chat MCP dropdown, stacked MCP icons, tool-call headers, and model group icons. Also support SVG in the MCP avatar uploader: add SVG to the accepted file types and sanitize uploaded SVGs with DOMPurify before storing them, and make the dialog preview theme-adaptive via the same component. Add unit tests for SVG detection, monochrome analysis, sanitization, and CustomIcon rendering. |
||
|---|---|---|
| .. | ||
| __tests__ | ||
| Agents | ||
| Artifacts | ||
| Audio | ||
| Auth | ||
| Banners | ||
| Bookmarks | ||
| Chat | ||
| Conversations | ||
| Endpoints | ||
| Files | ||
| Input | ||
| MCP | ||
| MCPUIResource | ||
| Messages | ||
| Nav | ||
| OAuth | ||
| Plugins/Store | ||
| Projects | ||
| Prompts | ||
| Share | ||
| SharePoint | ||
| Sharing | ||
| SidePanel | ||
| Skills | ||
| System | ||
| Tools | ||
| ui | ||
| UnifiedSidebar | ||
| Web | ||
| index.ts | ||
| QueryDevtoolsGate.tsx | ||