mcp example, mock i/o for client-to-server communications

* feat: Add configurable retention period for temporary chats

* Addressing eslint errors

* Fix: failing test due to missing registration

* Update: variable name and use hours instead of days for chat retention

* Addressing comments

* chore: fix import order in Conversation.js

* chore: import order in Message.js

* chore: fix import order in config.ts

* chore: move common methods to packages/api to reduce potential for circular dependencies

* refactor: update temp chat retention config type to Partial<TCustomConfig>

* refactor: remove unused config variable from AppService and update loadCustomConfig tests with logger mock

* refactor: handle model undefined edge case by moving Session model initialization inside methods

---------

Co-authored-by: Rakshit Tiwari <rak1729e@gmail.com>

.env.example

@@ -142,10 +142,10 @@ GOOGLE_KEY=user_provided
 # GOOGLE_AUTH_HEADER=true
 
 # Gemini API (AI Studio)
-# 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_MODELS=gemini-2.5-pro,gemini-2.5-flash,gemini-2.5-flash-lite-preview-06-17,gemini-2.0-flash,gemini-2.0-flash-lite
 
 # Vertex AI
-# 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_MODELS=gemini-2.5-pro,gemini-2.5-flash,gemini-2.5-flash-lite-preview-06-17,gemini-2.0-flash-001,gemini-2.0-flash-lite-001
 
 # GOOGLE_TITLE_MODEL=gemini-2.0-flash-lite-001
 
@@ -657,4 +657,4 @@ OPENWEATHER_API_KEY=
 # Reranker (Required)
 # JINA_API_KEY=your_jina_api_key
 # or
-# COHERE_API_KEY=your_cohere_api_key
+# COHERE_API_KEY=your_cohere_api_key

api/app/clients/GoogleClient.js

@@ -1,7 +1,7 @@
 const { google } = require('googleapis');
-const { Tokenizer } = require('@librechat/api');
 const { concat } = require('@langchain/core/utils/stream');
 const { ChatVertexAI } = require('@langchain/google-vertexai');
+const { Tokenizer, getSafetySettings } = require('@librechat/api');
 const { ChatGoogleGenerativeAI } = require('@langchain/google-genai');
 const { GoogleGenerativeAI: GenAI } = require('@google/generative-ai');
 const { HumanMessage, SystemMessage } = require('@langchain/core/messages');
@@ -12,13 +12,13 @@ const {
   endpointSettings,
   parseTextParts,
   EModelEndpoint,
+  googleSettings,
   ContentTypes,
   VisionModes,
   ErrorTypes,
   Constants,
   AuthKeys,
 } = require('librechat-data-provider');
-const { getSafetySettings } = require('~/server/services/Endpoints/google/llm');
 const { encodeAndFormat } = require('~/server/services/Files/images');
 const { spendTokens } = require('~/models/spendTokens');
 const { getModelMaxTokens } = require('~/utils');
@@ -166,6 +166,16 @@ class GoogleClient extends BaseClient {
       );
     }
 
+    // Add thinking configuration
+    this.modelOptions.thinkingConfig = {
+      thinkingBudget:
+        (this.modelOptions.thinking ?? googleSettings.thinking.default)
+          ? this.modelOptions.thinkingBudget
+          : 0,
+    };
+    delete this.modelOptions.thinking;
+    delete this.modelOptions.thinkingBudget;
+
     this.sender =
       this.options.sender ??
       getResponseSender({

api/cache/banViolation.js

@@ -1,7 +1,8 @@
 const { logger } = require('@librechat/data-schemas');
+const { isEnabled, math } = require('@librechat/api');
 const { ViolationTypes } = require('librechat-data-provider');
-const { isEnabled, math, removePorts } = require('~/server/utils');
 const { deleteAllUserSessions } = require('~/models');
+const { removePorts } = require('~/server/utils');
 const getLogStores = require('./getLogStores');
 
 const { BAN_VIOLATIONS, BAN_INTERVAL } = process.env ?? {};

api/cache/getLogStores.js

@@ -1,7 +1,7 @@
 const { Keyv } = require('keyv');
+const { isEnabled, math } = require('@librechat/api');
 const { CacheKeys, ViolationTypes, Time } = require('librechat-data-provider');
 const { logFile, violationFile } = require('./keyvFiles');
-const { isEnabled, math } = require('~/server/utils');
 const keyvRedis = require('./keyvRedis');
 const keyvMongo = require('./keyvMongo');
 

api/models/Conversation.js

@@ -1,4 +1,6 @@
 const { logger } = require('@librechat/data-schemas');
+const { createTempChatExpirationDate } = require('@librechat/api');
+const getCustomConfig = require('~/server/services/Config/loadCustomConfig');
 const { getMessages, deleteMessages } = require('./Message');
 const { Conversation } = require('~/db/models');
 
@@ -98,10 +100,15 @@ module.exports = {
         update.conversationId = newConversationId;
       }
 
-      if (req.body.isTemporary) {
-        const expiredAt = new Date();
-        expiredAt.setDate(expiredAt.getDate() + 30);
-        update.expiredAt = expiredAt;
+      if (req?.body?.isTemporary) {
+        try {
+          const customConfig = await getCustomConfig();
+          update.expiredAt = createTempChatExpirationDate(customConfig);
+        } catch (err) {
+          logger.error('Error creating temporary chat expiration date:', err);
+          logger.info(`---\`saveConvo\` context: ${metadata?.context}`);
+          update.expiredAt = null;
+        }
       } else {
         update.expiredAt = null;
       }

api/models/Message.js

@@ -1,5 +1,7 @@
 const { z } = require('zod');
 const { logger } = require('@librechat/data-schemas');
+const { createTempChatExpirationDate } = require('@librechat/api');
+const getCustomConfig = require('~/server/services/Config/loadCustomConfig');
 const { Message } = require('~/db/models');
 
 const idSchema = z.string().uuid();
@@ -54,9 +56,14 @@ async function saveMessage(req, params, metadata) {
     };
 
     if (req?.body?.isTemporary) {
-      const expiredAt = new Date();
-      expiredAt.setDate(expiredAt.getDate() + 30);
-      update.expiredAt = expiredAt;
+      try {
+        const customConfig = await getCustomConfig();
+        update.expiredAt = createTempChatExpirationDate(customConfig);
+      } catch (err) {
+        logger.error('Error creating temporary chat expiration date:', err);
+        logger.info(`---\`saveMessage\` context: ${metadata?.context}`);
+        update.expiredAt = null;
+      }
     } else {
       update.expiredAt = null;
     }

api/package.json

@@ -48,7 +48,7 @@
     "@langchain/google-genai": "^0.2.13",
     "@langchain/google-vertexai": "^0.2.13",
     "@langchain/textsplitters": "^0.1.0",
-    "@librechat/agents": "^2.4.42",
+    "@librechat/agents": "^2.4.46",
     "@librechat/api": "*",
     "@librechat/data-schemas": "*",
     "@node-saml/passport-saml": "^5.0.0",

api/server/controllers/AuthController.js

@@ -1,17 +1,17 @@
 const cookies = require('cookie');
 const jwt = require('jsonwebtoken');
 const openIdClient = require('openid-client');
+const { isEnabled } = require('@librechat/api');
 const { logger } = require('@librechat/data-schemas');
 const {
-  registerUser,
-  resetPassword,
-  setAuthTokens,
   requestPasswordReset,
   setOpenIDAuthTokens,
+  resetPassword,
+  setAuthTokens,
+  registerUser,
 } = require('~/server/services/AuthService');
 const { findUser, getUserById, deleteAllUserSessions, findSession } = require('~/models');
 const { getOpenIdConfig } = require('~/strategies');
-const { isEnabled } = require('~/server/utils');
 
 const registrationController = async (req, res) => {
   try {

api/server/controllers/EditController.js

@@ -1,3 +1,5 @@
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const { getResponseSender } = require('librechat-data-provider');
 const {
   handleAbortError,
@@ -10,9 +12,8 @@ const {
   clientRegistry,
   requestDataMap,
 } = require('~/server/cleanup');
-const { sendMessage, createOnProgress } = require('~/server/utils');
+const { createOnProgress } = require('~/server/utils');
 const { saveMessage } = require('~/models');
-const { logger } = require('~/config');
 
 const EditController = async (req, res, next, initializeClient) => {
   let {
@@ -198,7 +199,7 @@ const EditController = async (req, res, next, initializeClient) => {
       const finalUserMessage = reqDataContext.userMessage;
       const finalResponseMessage = { ...response };
 
-      sendMessage(res, {
+      sendEvent(res, {
         final: true,
         conversation,
         title: conversation.title,

api/server/controllers/agents/client.js

@@ -44,6 +44,17 @@ const BaseClient = require('~/app/clients/BaseClient');
 const { loadAgent } = require('~/models/Agent');
 const { getMCPManager } = require('~/config');
 
+const omitTitleOptions = new Set([
+  'stream',
+  'thinking',
+  'streaming',
+  'clientOptions',
+  'thinkingConfig',
+  'thinkingBudget',
+  'includeThoughts',
+  'maxOutputTokens',
+]);
+
 /**
  * @param {ServerRequest} req
  * @param {Agent} agent
@@ -1038,6 +1049,16 @@ class AgentClient extends BaseClient {
       delete clientOptions.maxTokens;
     }
 
+    clientOptions = Object.assign(
+      Object.fromEntries(
+        Object.entries(clientOptions).filter(([key]) => !omitTitleOptions.has(key)),
+      ),
+    );
+
+    if (provider === Providers.GOOGLE) {
+      clientOptions.json = true;
+    }
+
     try {
       const titleResult = await this.run.generateTitle({
         provider,

api/server/controllers/agents/errors.js

@@ -1,10 +1,10 @@
 // errorHandler.js
-const { logger } = require('~/config');
-const getLogStores = require('~/cache/getLogStores');
+const { logger } = require('@librechat/data-schemas');
 const { CacheKeys, ViolationTypes } = require('librechat-data-provider');
+const { sendResponse } = require('~/server/middleware/error');
 const { recordUsage } = require('~/server/services/Threads');
 const { getConvo } = require('~/models/Conversation');
-const { sendResponse } = require('~/server/utils');
+const getLogStores = require('~/cache/getLogStores');
 
 /**
  * @typedef {Object} ErrorHandlerContext
@@ -75,7 +75,7 @@ const createErrorHandler = ({ req, res, getContext, originPath = '/assistants/ch
     } else if (/Files.*are invalid/.test(error.message)) {
       const errorMessage = `Files are invalid, or may not have uploaded yet.${
         endpoint === '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);

api/server/controllers/agents/request.js

@@ -1,3 +1,5 @@
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const { Constants } = require('librechat-data-provider');
 const {
   handleAbortError,
@@ -5,9 +7,7 @@ const {
   cleanupAbortController,
 } = require('~/server/middleware');
 const { disposeClient, clientRegistry, requestDataMap } = require('~/server/cleanup');
-const { sendMessage } = require('~/server/utils');
 const { saveMessage } = require('~/models');
-const { logger } = require('~/config');
 
 const AgentController = async (req, res, next, initializeClient, addTitle) => {
   let {
@@ -206,7 +206,7 @@ const AgentController = async (req, res, next, initializeClient, addTitle) => {
       // Create a new response object with minimal copies
       const finalResponse = { ...response };
 
-      sendMessage(res, {
+      sendEvent(res, {
         final: true,
         conversation,
         title: conversation.title,

api/server/controllers/assistants/chatV1.js

@@ -1,4 +1,7 @@
 const { v4 } = require('uuid');
+const { sleep } = require('@librechat/agents');
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const {
   Time,
   Constants,
@@ -19,20 +22,20 @@ const {
   addThreadMetadata,
   saveAssistantMessage,
 } = require('~/server/services/Threads');
-const { sendResponse, sendMessage, sleep, countTokens } = require('~/server/utils');
 const { runAssistant, createOnTextProgress } = require('~/server/services/AssistantService');
 const validateAuthor = require('~/server/middleware/assistants/validateAuthor');
 const { formatMessage, createVisionPrompt } = require('~/app/clients/prompts');
 const { createRun, StreamRunManager } = require('~/server/services/Runs');
 const { addTitle } = require('~/server/services/Endpoints/assistants');
 const { createRunBody } = require('~/server/services/createRunBody');
+const { sendResponse } = require('~/server/middleware/error');
 const { getTransactions } = require('~/models/Transaction');
 const { checkBalance } = require('~/models/balanceMethods');
 const { getConvo } = require('~/models/Conversation');
 const getLogStores = require('~/cache/getLogStores');
+const { countTokens } = require('~/server/utils');
 const { getModelMaxTokens } = require('~/utils');
 const { getOpenAIClient } = require('./helpers');
-const { logger } = require('~/config');
 
 /**
  * @route POST /
@@ -471,7 +474,7 @@ const chatV1 = async (req, res) => {
     await Promise.all(promises);
 
     const sendInitialResponse = () => {
-      sendMessage(res, {
+      sendEvent(res, {
         sync: true,
         conversationId,
         // messages: previousMessages,
@@ -587,7 +590,7 @@ const chatV1 = async (req, res) => {
       iconURL: endpointOption.iconURL,
     };
 
-    sendMessage(res, {
+    sendEvent(res, {
       final: true,
       conversation,
       requestMessage: {

api/server/controllers/assistants/chatV2.js

@@ -1,4 +1,7 @@
 const { v4 } = require('uuid');
+const { sleep } = require('@librechat/agents');
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const {
   Time,
   Constants,
@@ -22,15 +25,14 @@ const { createErrorHandler } = require('~/server/controllers/assistants/errors')
 const validateAuthor = require('~/server/middleware/assistants/validateAuthor');
 const { createRun, StreamRunManager } = require('~/server/services/Runs');
 const { addTitle } = require('~/server/services/Endpoints/assistants');
-const { sendMessage, sleep, countTokens } = require('~/server/utils');
 const { createRunBody } = require('~/server/services/createRunBody');
 const { getTransactions } = require('~/models/Transaction');
 const { checkBalance } = require('~/models/balanceMethods');
 const { getConvo } = require('~/models/Conversation');
 const getLogStores = require('~/cache/getLogStores');
+const { countTokens } = require('~/server/utils');
 const { getModelMaxTokens } = require('~/utils');
 const { getOpenAIClient } = require('./helpers');
-const { logger } = require('~/config');
 
 /**
  * @route POST /
@@ -309,7 +311,7 @@ const chatV2 = async (req, res) => {
     await Promise.all(promises);
 
     const sendInitialResponse = () => {
-      sendMessage(res, {
+      sendEvent(res, {
         sync: true,
         conversationId,
         // messages: previousMessages,
@@ -432,7 +434,7 @@ const chatV2 = async (req, res) => {
       iconURL: endpointOption.iconURL,
     };
 
-    sendMessage(res, {
+    sendEvent(res, {
       final: true,
       conversation,
       requestMessage: {

api/server/controllers/assistants/errors.js

@@ -1,10 +1,10 @@
 // errorHandler.js
-const { sendResponse } = require('~/server/utils');
-const { logger } = require('~/config');
-const getLogStores = require('~/cache/getLogStores');
+const { logger } = require('@librechat/data-schemas');
 const { CacheKeys, ViolationTypes, ContentTypes } = require('librechat-data-provider');
-const { getConvo } = require('~/models/Conversation');
 const { recordUsage, checkMessageGaps } = require('~/server/services/Threads');
+const { sendResponse } = require('~/server/middleware/error');
+const { getConvo } = require('~/models/Conversation');
+const getLogStores = require('~/cache/getLogStores');
 
 /**
  * @typedef {Object} ErrorHandlerContext
@@ -78,7 +78,7 @@ const createErrorHandler = ({ req, res, getContext, originPath = '/assistants/ch
     } else if (/Files.*are invalid/.test(error.message)) {
       const errorMessage = `Files are invalid, or may not have uploaded yet.${
         endpoint === '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);

api/server/middleware/abortMiddleware.js

@@ -1,13 +1,13 @@
-// abortMiddleware.js
+const { logger } = require('@librechat/data-schemas');
+const { countTokens, isEnabled, sendEvent } = require('@librechat/api');
 const { isAssistantsEndpoint, ErrorTypes } = require('librechat-data-provider');
-const { sendMessage, sendError, countTokens, isEnabled } = require('~/server/utils');
 const { truncateText, smartTruncateText } = require('~/app/clients/prompts');
 const clearPendingReq = require('~/cache/clearPendingReq');
+const { sendError } = require('~/server/middleware/error');
 const { spendTokens } = require('~/models/spendTokens');
 const abortControllers = require('./abortControllers');
 const { saveMessage, getConvo } = require('~/models');
 const { abortRun } = require('./abortRun');
-const { logger } = require('~/config');
 
 const abortDataMap = new WeakMap();
 
@@ -101,7 +101,7 @@ async function abortMessage(req, res) {
   cleanupAbortController(abortKey);
 
   if (res.headersSent && finalEvent) {
-    return sendMessage(res, finalEvent);
+    return sendEvent(res, finalEvent);
   }
 
   res.setHeader('Content-Type', 'application/json');
@@ -174,7 +174,7 @@ const createAbortController = (req, res, getAbortData, getReqData) => {
    * @param {string} responseMessageId
    */
   const onStart = (userMessage, responseMessageId) => {
-    sendMessage(res, { message: userMessage, created: true });
+    sendEvent(res, { message: userMessage, created: true });
 
     const abortKey = userMessage?.conversationId ?? req.user.id;
     getReqData({ abortKey });

api/server/middleware/abortRun.js

@@ -1,11 +1,11 @@
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const { CacheKeys, RunStatus, isUUID } = require('librechat-data-provider');
 const { initializeClient } = require('~/server/services/Endpoints/assistants');
 const { checkMessageGaps, recordUsage } = require('~/server/services/Threads');
 const { deleteMessages } = require('~/models/Message');
 const { getConvo } = require('~/models/Conversation');
 const getLogStores = require('~/cache/getLogStores');
-const { sendMessage } = require('~/server/utils');
-const { logger } = require('~/config');
 
 const three_minutes = 1000 * 60 * 3;
 
@@ -34,7 +34,7 @@ async function abortRun(req, res) {
   const [thread_id, run_id] = runValues.split(':');
 
   if (!run_id) {
-    logger.warn('[abortRun] Couldn\'t find run for cancel request', { thread_id });
+    logger.warn("[abortRun] Couldn't find run for cancel request", { thread_id });
     return res.status(204).send({ message: 'Run not found' });
   } else if (run_id === 'cancelled') {
     logger.warn('[abortRun] Run already cancelled', { thread_id });
@@ -93,7 +93,7 @@ async function abortRun(req, res) {
   };
 
   if (res.headersSent && finalEvent) {
-    return sendMessage(res, finalEvent);
+    return sendEvent(res, finalEvent);
   }
 
   res.json(finalEvent);

api/server/middleware/denyRequest.js

@@ -1,6 +1,7 @@
 const crypto = require('crypto');
+const { sendEvent } = require('@librechat/api');
 const { getResponseSender, Constants } = require('librechat-data-provider');
-const { sendMessage, sendError } = require('~/server/utils');
+const { sendError } = require('~/server/middleware/error');
 const { saveMessage } = require('~/models');
 
 /**
@@ -36,7 +37,7 @@ const denyRequest = async (req, res, errorMessage) => {
     isCreatedByUser: true,
     text,
   };
-  sendMessage(res, { message: userMessage, created: true });
+  sendEvent(res, { message: userMessage, created: true });
 
   const shouldSaveMessage = _convoId && parentMessageId && parentMessageId !== Constants.NO_PARENT;
 

api/server/middleware/error.js

@@ -1,31 +1,9 @@
 const crypto = require('crypto');
+const { logger } = require('@librechat/data-schemas');
 const { parseConvo } = require('librechat-data-provider');
+const { sendEvent, handleError } = require('@librechat/api');
 const { saveMessage, getMessages } = require('~/models/Message');
 const { getConvo } = require('~/models/Conversation');
-const { logger } = require('~/config');
-
-/**
- * Sends error data in Server Sent Events format and ends the response.
- * @param {object} res - The server response.
- * @param {string} message - The error message.
- */
-const handleError = (res, message) => {
-  res.write(`event: error\ndata: ${JSON.stringify(message)}\n\n`);
-  res.end();
-};
-
-/**
- * Sends message data in Server Sent Events format.
- * @param {Express.Response} res - - The server response.
- * @param {string | Object} message - The message to be sent.
- * @param {'message' | 'error' | 'cancel'} event - [Optional] The type of event. Default is 'message'.
- */
-const sendMessage = (res, message, event = 'message') => {
-  if (typeof message === 'string' && message.length === 0) {
-    return;
-  }
-  res.write(`event: ${event}\ndata: ${JSON.stringify(message)}\n\n`);
-};
 
 /**
  * Processes an error with provided options, saves the error message and sends a corresponding SSE response
@@ -91,7 +69,7 @@ const sendError = async (req, res, options, callback) => {
       convo = parseConvo(errorMessage);
     }
 
-    return sendMessage(res, {
+    return sendEvent(res, {
       final: true,
       requestMessage: query?.[0] ? query[0] : requestMessage,
       responseMessage: errorMessage,
@@ -120,12 +98,10 @@ const sendResponse = (req, res, data, errorMessage) => {
   if (errorMessage) {
     return sendError(req, res, { ...data, text: errorMessage });
   }
-  return sendMessage(res, data);
+  return sendEvent(res, data);
 };
 
 module.exports = {
-  sendResponse,
-  handleError,
-  sendMessage,
   sendError,
+  sendResponse,
 };

api/server/routes/agents/tools.js

@@ -1,4 +1,5 @@
 const express = require('express');
+const { addTool } = require('@librechat/api');
 const { callTool, verifyToolAuth, getToolCalls } = require('~/server/controllers/tools');
 const { getAvailableTools } = require('~/server/controllers/PluginController');
 const { toolCallLimiter } = require('~/server/middleware/limiters');
@@ -36,4 +37,12 @@ router.get('/:toolId/auth', verifyToolAuth);
  */
 router.post('/:toolId/call', toolCallLimiter, callTool);
 
+/**
+ * Add a new tool to the system
+ * @route POST /agents/tools/add
+ * @param {object} req.body - Request body containing tool data
+ * @returns {object} Created tool object
+ */
+router.post('/add', addTool);
+
 module.exports = router;

api/server/services/AssistantService.js

@@ -1,4 +1,7 @@
 const { klona } = require('klona');
+const { sleep } = require('@librechat/agents');
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const {
   StepTypes,
   RunStatus,
@@ -11,11 +14,10 @@ const {
 } = require('librechat-data-provider');
 const { retrieveAndProcessFile } = require('~/server/services/Files/process');
 const { processRequiredActions } = require('~/server/services/ToolService');
-const { createOnProgress, sendMessage, sleep } = require('~/server/utils');
 const { RunManager, waitForRun } = require('~/server/services/Runs');
 const { processMessages } = require('~/server/services/Threads');
+const { createOnProgress } = require('~/server/utils');
 const { TextStream } = require('~/app/clients');
-const { logger } = require('~/config');
 
 /**
  * Sorts, processes, and flattens messages to a single string.
@@ -64,7 +66,7 @@ async function createOnTextProgress({
     };
 
     logger.debug('Content data:', contentData);
-    sendMessage(openai.res, contentData);
+    sendEvent(openai.res, contentData);
   };
 }
 

api/server/services/Config/EndpointService.js

@@ -1,5 +1,6 @@
+const { isUserProvided } = require('@librechat/api');
 const { EModelEndpoint } = require('librechat-data-provider');
-const { isUserProvided, generateConfig } = require('~/server/utils');
+const { generateConfig } = require('~/server/utils/handleText');
 
 const {
   OPENAI_API_KEY: openAIApiKey,

api/server/services/Config/loadCustomConfig.js

@@ -1,18 +1,18 @@
 const path = require('path');
-const {
-  CacheKeys,
-  configSchema,
-  EImageOutputType,
-  validateSettingDefinitions,
-  agentParamSettings,
-  paramSettings,
-} = require('librechat-data-provider');
-const getLogStores = require('~/cache/getLogStores');
-const loadYaml = require('~/utils/loadYaml');
-const { logger } = require('~/config');
 const axios = require('axios');
 const yaml = require('js-yaml');
 const keyBy = require('lodash/keyBy');
+const { loadYaml } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
+const {
+  CacheKeys,
+  configSchema,
+  paramSettings,
+  EImageOutputType,
+  agentParamSettings,
+  validateSettingDefinitions,
+} = require('librechat-data-provider');
+const getLogStores = require('~/cache/getLogStores');
 
 const projectRoot = path.resolve(__dirname, '..', '..', '..', '..');
 const defaultConfigPath = path.resolve(projectRoot, 'librechat.yaml');

api/server/services/Config/loadCustomConfig.spec.js

@@ -1,6 +1,9 @@
 jest.mock('axios');
 jest.mock('~/cache/getLogStores');
-jest.mock('~/utils/loadYaml');
+jest.mock('@librechat/api', () => ({
+  ...jest.requireActual('@librechat/api'),
+  loadYaml: jest.fn(),
+}));
 jest.mock('librechat-data-provider', () => {
   const actual = jest.requireActual('librechat-data-provider');
   return {
@@ -30,11 +33,22 @@ jest.mock('librechat-data-provider', () => {
   };
 });
 
+jest.mock('@librechat/data-schemas', () => {
+  return {
+    logger: {
+      info: jest.fn(),
+      warn: jest.fn(),
+      debug: jest.fn(),
+      error: jest.fn(),
+    },
+  };
+});
+
 const axios = require('axios');
+const { loadYaml } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const loadCustomConfig = require('./loadCustomConfig');
 const getLogStores = require('~/cache/getLogStores');
-const loadYaml = require('~/utils/loadYaml');
-const { logger } = require('~/config');
 
 describe('loadCustomConfig', () => {
   const mockSet = jest.fn();

api/server/services/Endpoints/custom/initialize.spec.js

@@ -0,0 +1,93 @@
+const initializeClient = require('./initialize');
+
+jest.mock('@librechat/api', () => ({
+  resolveHeaders: jest.fn(),
+  getOpenAIConfig: jest.fn(),
+  createHandleLLMNewToken: jest.fn(),
+}));
+
+jest.mock('librechat-data-provider', () => ({
+  CacheKeys: { TOKEN_CONFIG: 'token_config' },
+  ErrorTypes: { NO_USER_KEY: 'NO_USER_KEY', NO_BASE_URL: 'NO_BASE_URL' },
+  envVarRegex: /\$\{([^}]+)\}/,
+  FetchTokenConfig: {},
+  extractEnvVariable: jest.fn((value) => value),
+}));
+
+jest.mock('@librechat/agents', () => ({
+  Providers: { OLLAMA: 'ollama' },
+}));
+
+jest.mock('~/server/services/UserService', () => ({
+  getUserKeyValues: jest.fn(),
+  checkUserKeyExpiry: jest.fn(),
+}));
+
+jest.mock('~/server/services/Config', () => ({
+  getCustomEndpointConfig: jest.fn().mockResolvedValue({
+    apiKey: 'test-key',
+    baseURL: 'https://test.com',
+    headers: { 'x-user': '{{LIBRECHAT_USER_ID}}', 'x-email': '{{LIBRECHAT_USER_EMAIL}}' },
+    models: { default: ['test-model'] },
+  }),
+}));
+
+jest.mock('~/server/services/ModelService', () => ({
+  fetchModels: jest.fn(),
+}));
+
+jest.mock('~/app/clients/OpenAIClient', () => {
+  return jest.fn().mockImplementation(() => ({
+    options: {},
+  }));
+});
+
+jest.mock('~/server/utils', () => ({
+  isUserProvided: jest.fn().mockReturnValue(false),
+}));
+
+jest.mock('~/cache/getLogStores', () =>
+  jest.fn().mockReturnValue({
+    get: jest.fn(),
+  }),
+);
+
+describe('custom/initializeClient', () => {
+  const mockRequest = {
+    body: { endpoint: 'test-endpoint' },
+    user: { id: 'user-123', email: 'test@example.com' },
+    app: { locals: {} },
+  };
+  const mockResponse = {};
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('calls resolveHeaders with headers and user', async () => {
+    const { resolveHeaders } = require('@librechat/api');
+    await initializeClient({ req: mockRequest, res: mockResponse, optionsOnly: true });
+    expect(resolveHeaders).toHaveBeenCalledWith(
+      { 'x-user': '{{LIBRECHAT_USER_ID}}', 'x-email': '{{LIBRECHAT_USER_EMAIL}}' },
+      { id: 'user-123', email: 'test@example.com' },
+    );
+  });
+
+  it('throws if endpoint config is missing', async () => {
+    const { getCustomEndpointConfig } = require('~/server/services/Config');
+    getCustomEndpointConfig.mockResolvedValueOnce(null);
+    await expect(
+      initializeClient({ req: mockRequest, res: mockResponse, optionsOnly: true }),
+    ).rejects.toThrow('Config not found for the test-endpoint custom endpoint.');
+  });
+
+  it('throws if user is missing', async () => {
+    await expect(
+      initializeClient({
+        req: { ...mockRequest, user: undefined },
+        res: mockResponse,
+        optionsOnly: true,
+      }),
+    ).rejects.toThrow("Cannot read properties of undefined (reading 'id')");
+  });
+});

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

@@ -1,7 +1,6 @@
+const { getGoogleConfig, isEnabled } = require('@librechat/api');
 const { EModelEndpoint, AuthKeys } = require('librechat-data-provider');
 const { getUserKey, checkUserKeyExpiry } = require('~/server/services/UserService');
-const { getLLMConfig } = require('~/server/services/Endpoints/google/llm');
-const { isEnabled } = require('~/server/utils');
 const { GoogleClient } = require('~/app');
 
 const initializeClient = async ({ req, res, endpointOption, overrideModel, optionsOnly }) => {
@@ -65,7 +64,7 @@ const initializeClient = async ({ req, res, endpointOption, overrideModel, optio
     if (overrideModel) {
       clientOptions.modelOptions.model = overrideModel;
     }
-    return getLLMConfig(credentials, clientOptions);
+    return getGoogleConfig(credentials, clientOptions);
   }
 
   const client = new GoogleClient(credentials, clientOptions);

api/server/services/Runs/StreamRunManager.js

@@ -1,3 +1,6 @@
+const { sleep } = require('@librechat/agents');
+const { sendEvent } = require('@librechat/api');
+const { logger } = require('@librechat/data-schemas');
 const {
   Constants,
   StepTypes,
@@ -8,9 +11,8 @@ const {
 } = require('librechat-data-provider');
 const { retrieveAndProcessFile } = require('~/server/services/Files/process');
 const { processRequiredActions } = require('~/server/services/ToolService');
-const { createOnProgress, sendMessage, sleep } = require('~/server/utils');
 const { processMessages } = require('~/server/services/Threads');
-const { logger } = require('~/config');
+const { createOnProgress } = require('~/server/utils');
 
 /**
  * Implements the StreamRunManager functionality for managing the streaming
@@ -126,7 +128,7 @@ class StreamRunManager {
       conversationId: this.finalMessage.conversationId,
     };
 
-    sendMessage(this.res, contentData);
+    sendEvent(this.res, contentData);
   }
 
   /* <------------------ Misc. Helpers ------------------> */
@@ -302,7 +304,7 @@ class StreamRunManager {
 
           for (const d of delta[key]) {
             if (typeof d === 'object' && !Object.prototype.hasOwnProperty.call(d, 'index')) {
-              logger.warn('Expected an object with an \'index\' for array updates but got:', d);
+              logger.warn("Expected an object with an 'index' for array updates but got:", d);
               continue;
             }
 

api/server/utils/handleText.js

@@ -7,9 +7,9 @@ const {
   defaultAssistantsVersion,
   defaultAgentCapabilities,
 } = require('librechat-data-provider');
+const { sendEvent } = require('@librechat/api');
 const { Providers } = require('@librechat/agents');
 const partialRight = require('lodash/partialRight');
-const { sendMessage } = require('./streamResponse');
 
 /** Helper function to escape special characters in regex
  * @param {string} string - The string to escape.
@@ -37,7 +37,7 @@ const createOnProgress = (
     basePayload.text = basePayload.text + chunk;
 
     const payload = Object.assign({}, basePayload, rest);
-    sendMessage(res, payload);
+    sendEvent(res, payload);
     if (_onProgress) {
       _onProgress(payload);
     }
@@ -50,7 +50,7 @@ const createOnProgress = (
   const sendIntermediateMessage = (res, payload, extraTokens = '') => {
     basePayload.text = basePayload.text + extraTokens;
     const message = Object.assign({}, basePayload, payload);
-    sendMessage(res, message);
+    sendEvent(res, message);
     if (i === 0) {
       basePayload.initial = false;
     }

api/server/utils/index.js

@@ -1,11 +1,9 @@
-const streamResponse = require('./streamResponse');
 const removePorts = require('./removePorts');
 const countTokens = require('./countTokens');
 const handleText = require('./handleText');
 const sendEmail = require('./sendEmail');
 const queue = require('./queue');
 const files = require('./files');
-const math = require('./math');
 
 /**
  * Check if email configuration is set
@@ -28,7 +26,6 @@ function checkEmailConfig() {
 }
 
 module.exports = {
-  ...streamResponse,
   checkEmailConfig,
   ...handleText,
   countTokens,
@@ -36,5 +33,4 @@ module.exports = {
   sendEmail,
   ...files,
   ...queue,
-  math,
 };

api/utils/index.js

@@ -1,11 +1,9 @@
-const loadYaml = require('./loadYaml');
 const tokenHelpers = require('./tokens');
 const deriveBaseURL = require('./deriveBaseURL');
 const extractBaseURL = require('./extractBaseURL');
 const findMessageContent = require('./findMessageContent');
 
 module.exports = {
-  loadYaml,
   deriveBaseURL,
   extractBaseURL,
   ...tokenHelpers,

api/utils/loadYaml.js

@@ -1,13 +0,0 @@
-const fs = require('fs');
-const yaml = require('js-yaml');
-
-function loadYaml(filepath) {
-  try {
-    let fileContents = fs.readFileSync(filepath, 'utf8');
-    return yaml.load(fileContents);
-  } catch (e) {
-    return e;
-  }
-}
-
-module.exports = loadYaml;

client/package.json

@@ -109,9 +109,6 @@
     "tailwindcss-radix": "^2.8.0",
     "zod": "^3.22.4"
   },
-  "peerDependencies": {
-    "jotai": "^2.12.5"
-  },
   "devDependencies": {
     "@babel/plugin-transform-runtime": "^7.22.15",
     "@babel/preset-env": "^7.22.15",

client/src/common/menus.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 export type RenderProp<
   P = React.HTMLAttributes<any> & {
     ref?: React.Ref<any>;

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

@@ -3,7 +3,7 @@ import { SettingsIcon } from 'lucide-react';
 import { Constants } from 'librechat-data-provider';
 import { useUpdateUserPluginsMutation } from 'librechat-data-provider/react-query';
 import type { TUpdateUserPlugins, TPlugin } from 'librechat-data-provider';
-import MCPConfigDialog, { type ConfigFieldDetail } from './MCPConfigDialog';
+import MCPConfigDialog, { type ConfigFieldDetail } from '~/components/ui/MCPConfigDialog';
 import { useToastContext, useBadgeRowContext } from '~/Providers';
 import MultiSelect from '~/components/ui/MultiSelect';
 import { MCPIcon } from '~/components/svg';

client/src/components/Endpoints/Settings/Plugins.tsx

@@ -12,6 +12,7 @@ import {
   InputNumber,
   SelectDropDown,
   HoverCardTrigger,
+  MultiSelectDropDown,
 } from '~/components/ui';
 import {
   removeFocusOutlines,
@@ -24,7 +25,6 @@ import {
 } from '~/utils';
 import OptionHoverAlt from '~/components/SidePanel/Parameters/OptionHover';
 import { useLocalize, useDebouncedInput } from '~/hooks';
-import MultiSelectDropDown from '~/components/Input/ModelSelect/MultiSelectDropDown';
 import OptionHover from './OptionHover';
 import { ESide } from '~/common';
 import store from '~/store';
@@ -165,7 +165,7 @@ export default function Settings({
               )}
               className={cn(
                 defaultTextProps,
-                'flex max-h-[138px] min-h-[100px] w-full resize-none px-3 py-2',
+                'flex max-h-[138px] min-h-[100px] w-full resize-none px-3 py-2 ',
               )}
             />
           </div>

client/src/components/Input/ModelSelect/PluginsByIndex.tsx

@@ -4,10 +4,15 @@ import { useState, useEffect, useMemo } from 'react';
 import { useAvailablePluginsQuery } from 'librechat-data-provider/react-query';
 import type { TPlugin } from 'librechat-data-provider';
 import type { TModelSelectProps } from '~/common';
-import { Button, SelectDropDown, SelectDropDownPop, MultiSelectDropDown } from '~/components/ui';
+import {
+  Button,
+  MultiSelectPop,
+  SelectDropDown,
+  SelectDropDownPop,
+  MultiSelectDropDown,
+} from '~/components/ui';
 import { useSetIndexOptions, useAuthContext, useMediaQuery, useLocalize } from '~/hooks';
 import { cn, cardStyle, selectPlugins, processPlugins } from '~/utils';
-import MultiSelectPop from './MultiSelectPop';
 import store from '~/store';
 
 export default function PluginsByIndex({

client/src/components/Nav/SettingsTabs/Data/SharedLinks.tsx

@@ -1,28 +1,26 @@
 import { useCallback, useState, useMemo, useEffect } from 'react';
-import debounce from 'lodash/debounce';
-import { useRecoilValue } from 'recoil';
 import { Link } from 'react-router-dom';
+import debounce from 'lodash/debounce';
 import { TrashIcon, MessageSquare, ArrowUpDown, ArrowUp, ArrowDown } from 'lucide-react';
 import type { SharedLinkItem, SharedLinksListParams } from 'librechat-data-provider';
 import {
   OGDialog,
-  OGDialogTemplate,
   OGDialogTrigger,
   OGDialogContent,
   OGDialogHeader,
   OGDialogTitle,
   TooltipAnchor,
-  DataTable,
-  Spinner,
   Button,
   Label,
+  Spinner,
 } from '~/components';
 import { useDeleteSharedLinkMutation, useSharedLinksQuery } from '~/data-provider';
+import OGDialogTemplate from '~/components/ui/OGDialogTemplate';
 import { useLocalize, useMediaQuery } from '~/hooks';
+import DataTable from '~/components/ui/DataTable';
 import { NotificationSeverity } from '~/common';
 import { useToastContext } from '~/Providers';
 import { formatDate } from '~/utils';
-import store from '~/store';
 
 const PAGE_SIZE = 25;
 
@@ -38,7 +36,6 @@ export default function SharedLinks() {
   const localize = useLocalize();
   const { showToast } = useToastContext();
   const isSmallScreen = useMediaQuery('(max-width: 768px)');
-  const isSearchEnabled = useRecoilValue(store.search);
   const [queryParams, setQueryParams] = useState<SharedLinksListParams>(DEFAULT_PARAMS);
   const [deleteRow, setDeleteRow] = useState<SharedLinkItem | null>(null);
   const [isDeleteOpen, setIsDeleteOpen] = useState(false);
@@ -311,7 +308,6 @@ export default function SharedLinks() {
             onFilterChange={debouncedFilterChange}
             filterValue={queryParams.search}
             isLoading={isLoading}
-            enableSearch={isSearchEnabled}
           />
         </OGDialogContent>
       </OGDialog>

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

@@ -1,6 +1,5 @@
 import { useState, useCallback, useMemo, useEffect } from 'react';
 import debounce from 'lodash/debounce';
-import { useRecoilValue } from 'recoil';
 import { TrashIcon, ArchiveRestore, ArrowUp, ArrowDown, ArrowUpDown } from 'lucide-react';
 import type { ConversationListParams, TConversation } from 'librechat-data-provider';
 import {
@@ -12,7 +11,6 @@ import {
   Label,
   TooltipAnchor,
   Spinner,
-  DataTable,
 } from '~/components';
 import {
   useArchiveConvoMutation,
@@ -21,10 +19,10 @@ import {
 } from '~/data-provider';
 import { useLocalize, useMediaQuery } from '~/hooks';
 import { MinimalIcon } from '~/components/Endpoints';
+import DataTable from '~/components/ui/DataTable';
 import { NotificationSeverity } from '~/common';
 import { useToastContext } from '~/Providers';
 import { formatDate } from '~/utils';
-import store from '~/store';
 
 const DEFAULT_PARAMS: ConversationListParams = {
   isArchived: true,
@@ -41,7 +39,7 @@ export default function ArchivedChatsTable({
   const localize = useLocalize();
   const isSmallScreen = useMediaQuery('(max-width: 768px)');
   const { showToast } = useToastContext();
-  const isSearchEnabled = useRecoilValue(store.search);
+
   const [isDeleteOpen, setIsDeleteOpen] = useState(false);
   const [queryParams, setQueryParams] = useState<ConversationListParams>(DEFAULT_PARAMS);
   const [deleteConversation, setDeleteConversation] = useState<TConversation | null>(null);
@@ -274,7 +272,6 @@ export default function ArchivedChatsTable({
         isFetchingNextPage={isFetchingNextPage}
         isLoading={isLoading}
         showCheckboxes={false}
-        enableSearch={isSearchEnabled}
       />
 
       <OGDialog open={isDeleteOpen} onOpenChange={onOpenChange}>

client/src/components/SidePanel/MCP/MCPPanel.tsx

@@ -6,6 +6,7 @@ import { useUpdateUserPluginsMutation } from 'librechat-data-provider/react-quer
 import type { TUpdateUserPlugins } from 'librechat-data-provider';
 import { Button, Input, Label } from '~/components/ui';
 import { useGetStartupConfig } from '~/data-provider';
+import { useAddToolMutation } from '~/data-provider/Tools';
 import MCPPanelSkeleton from './MCPPanelSkeleton';
 import { useToastContext } from '~/Providers';
 import { useLocalize } from '~/hooks';
@@ -17,6 +18,12 @@ interface ServerConfigWithVars {
   };
 }
 
+interface AddToolFormData {
+  name: string;
+  description: string;
+  type: 'function' | 'code_interpreter' | 'file_search';
+}
+
 export default function MCPPanel() {
   const localize = useLocalize();
   const { showToast } = useToastContext();
@@ -24,6 +31,7 @@ export default function MCPPanel() {
   const [selectedServerNameForEditing, setSelectedServerNameForEditing] = useState<string | null>(
     null,
   );
+  const [showAddToolForm, setShowAddToolForm] = useState(true);
 
   const mcpServerDefinitions = useMemo(() => {
     if (!startupConfig?.mcpServers) {
@@ -87,19 +95,25 @@ export default function MCPPanel() {
 
   const handleGoBackToList = () => {
     setSelectedServerNameForEditing(null);
+    setShowAddToolForm(false);
+  };
+
+  const handleShowAddToolForm = () => {
+    setShowAddToolForm(true);
+    setSelectedServerNameForEditing(null);
   };
 
   if (startupConfigLoading) {
     return <MCPPanelSkeleton />;
   }
 
-  if (mcpServerDefinitions.length === 0) {
-    return (
-      <div className="p-4 text-center text-sm text-gray-500">
-        {localize('com_sidepanel_mcp_no_servers_with_vars')}
-      </div>
-    );
-  }
+  // if (mcpServerDefinitions.length === 0) {
+  //   return (
+  //     <div className="p-4 text-center text-sm text-gray-500">
+  //       {localize('com_sidepanel_mcp_no_servers_with_vars')}
+  //     </div>
+  //   );
+  // }
 
   if (selectedServerNameForEditing) {
     // Editing View
@@ -138,10 +152,32 @@ export default function MCPPanel() {
         />
       </div>
     );
+  } else if (showAddToolForm) {
+    // Add Tool Form View
+    return (
+      <div className="h-auto max-w-full overflow-x-hidden p-3">
+        <Button
+          variant="outline"
+          onClick={handleGoBackToList}
+          className="mb-3 flex items-center px-3 py-2 text-sm"
+        >
+          <ChevronLeft className="mr-1 h-4 w-4" />
+          {localize('com_ui_back')}
+        </Button>
+        <h3 className="mb-3 text-lg font-medium">{localize('com_ui_add_tool')}</h3>
+        <AddToolForm onCancel={handleGoBackToList} />
+      </div>
+    );
   } else {
     // Server List View
     return (
       <div className="h-auto max-w-full overflow-x-hidden p-3">
+        <div className="mb-3 flex items-center justify-between">
+          <h3 className="text-lg font-medium">{localize('com_ui_mcp_servers')}</h3>
+          <Button variant="outline" onClick={handleShowAddToolForm} className="text-sm">
+            {localize('com_ui_add_tool')}
+          </Button>
+        </div>
         <div className="space-y-2">
           {mcpServerDefinitions.map((server) => (
             <Button
@@ -251,3 +287,131 @@ function MCPVariableEditor({ server, onSave, onRevoke, isSubmitting }: MCPVariab
     </form>
   );
 }
+
+interface AddToolFormProps {
+  onCancel: () => void;
+}
+
+function AddToolForm({ onCancel }: AddToolFormProps) {
+  const localize = useLocalize();
+  const { showToast } = useToastContext();
+
+  const addToolMutation = useAddToolMutation({
+    onSuccess: (data) => {
+      showToast({
+        message: localize('com_ui_tool_added_success', { '0': data.function?.name || 'Unknown' }),
+        status: 'success',
+      });
+      onCancel();
+    },
+    onError: (error) => {
+      console.error('Error adding tool:', error);
+      showToast({
+        message: localize('com_ui_tool_add_error'),
+        status: 'error',
+      });
+    },
+  });
+
+  const {
+    control,
+    handleSubmit,
+    formState: { errors, isDirty },
+  } = useForm<AddToolFormData>({
+    defaultValues: {
+      name: '',
+      description: '',
+      type: 'function',
+    },
+  });
+
+  const onFormSubmit = (data: AddToolFormData) => {
+    addToolMutation.mutate(data);
+  };
+
+  return (
+    <form onSubmit={handleSubmit(onFormSubmit)} className="mb-4 mt-2 space-y-4">
+      <div className="space-y-2">
+        <Label htmlFor="tool-name" className="text-sm font-medium">
+          {localize('com_ui_tool_name')}
+        </Label>
+        <Controller
+          name="name"
+          control={control}
+          rules={{ required: localize('com_ui_tool_name_required') }}
+          render={({ field }) => (
+            <Input
+              id="tool-name"
+              type="text"
+              {...field}
+              placeholder={localize('com_ui_enter_tool_name')}
+              className="w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white sm:text-sm"
+            />
+          )}
+        />
+        {errors.name && <p className="text-xs text-red-500">{errors.name.message}</p>}
+      </div>
+
+      <div className="space-y-2">
+        <Label htmlFor="tool-description" className="text-sm font-medium">
+          {localize('com_ui_description')}
+        </Label>
+        <Controller
+          name="description"
+          control={control}
+          rules={{ required: localize('com_ui_description_required') }}
+          render={({ field }) => (
+            <Input
+              id="tool-description"
+              type="text"
+              {...field}
+              placeholder={localize('com_ui_enter_description')}
+              className="w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white sm:text-sm"
+            />
+          )}
+        />
+        {errors.description && <p className="text-xs text-red-500">{errors.description.message}</p>}
+      </div>
+
+      <div className="space-y-2">
+        <Label htmlFor="tool-type" className="text-sm font-medium">
+          {localize('com_ui_tool_type')}
+        </Label>
+        <Controller
+          name="type"
+          control={control}
+          render={({ field }) => (
+            <select
+              id="tool-type"
+              {...field}
+              className="w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 dark:border-gray-600 dark:bg-gray-700 dark:text-white sm:text-sm"
+            >
+              <option value="function">{localize('com_ui_function')}</option>
+              <option value="code_interpreter">{localize('com_ui_code_interpreter')}</option>
+              <option value="file_search">{localize('com_ui_file_search')}</option>
+            </select>
+          )}
+        />
+        {errors.type && <p className="text-xs text-red-500">{errors.type.message}</p>}
+      </div>
+
+      <div className="flex justify-end gap-2 pt-2">
+        <Button
+          type="button"
+          variant="outline"
+          onClick={onCancel}
+          disabled={addToolMutation.isLoading}
+        >
+          {localize('com_ui_cancel')}
+        </Button>
+        <Button
+          type="submit"
+          className="bg-green-500 text-white hover:bg-green-600"
+          disabled={addToolMutation.isLoading || !isDirty}
+        >
+          {addToolMutation.isLoading ? localize('com_ui_saving') : localize('com_ui_save')}
+        </Button>
+      </div>
+    </form>
+  );
+}

client/src/components/SidePanel/Parameters/DynamicInput.tsx

@@ -46,6 +46,10 @@ function DynamicInput({
     setInputValue(e, !isNaN(Number(e.target.value)));
   };
 
+  const placeholderText = placeholderCode
+    ? localize(placeholder as TranslationKeys) || placeholder
+    : placeholder;
+
   return (
     <div
       className={`flex flex-col items-center justify-start gap-6 ${
@@ -76,11 +80,7 @@ function DynamicInput({
             disabled={readonly}
             value={inputValue ?? defaultValue ?? ''}
             onChange={handleInputChange}
-            placeholder={
-              placeholderCode
-                ? localize(placeholder as TranslationKeys) || placeholder
-                : placeholder
-            }
+            placeholder={placeholderText}
             className={cn(
               'flex h-10 max-h-10 w-full resize-none border-none bg-surface-secondary px-3 py-2',
             )}

client/src/components/SidePanel/Parameters/OptionHover.tsx

@@ -29,7 +29,7 @@ function OptionHover({
     <HoverCardPortal>
       <HoverCardContent side={side} className={`z-[999] w-80 ${className}`} sideOffset={sideOffset}>
         <div className="space-y-2">
-          <p className="text-sm text-gray-600 dark:text-gray-300">{text}</p>
+          <p className="whitespace-pre-wrap text-sm text-text-secondary">{text}</p>
         </div>
       </HoverCardContent>
     </HoverCardPortal>

client/src/components/svg/ListeningIcon.tsx

@@ -1,10 +1,6 @@
 import { cn } from '~/utils/';
 
-type ListeningIconProps = {
-  className?: string;
-};
-
-export default function ListeningIcon({ className }: ListeningIconProps) {
+export default function ListeningIcon({ className }) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"