🔄 fix: Avatar & Error Handling Enhancements (#6687)

* fix: Ensure safe access to agent capabilities in AgentConfig * fix: don't show agent builder if agents endpoint is not enabled * fix: Improve error logging for MCP tool calls * fix: Enhance error message for MCP tool failures * feat: Add optional spec and iconURL properties to TEndpointOption type * chore: Update condition to use constant for new conversation parameter * feat: Enhance abort error handling with additional endpoint options to properly render error message fields * fix: Throw error instead of returning message for failed MCP tool calls * refactor: separate logic to generate new S3 URLs for expired links * feat: Implement S3 URL refresh for user avatars with error handling * fix: authcontext error in chats where agent chain is used * refactor: streamline balance configuration logic in getBalanceConfig function * fix: enhance icon resolution logic in SpecIcon component * fix: allow null values for spec and iconURL in TEndpointOption type * fix: update balance check to allow null tokenCredits
2025-12-16 08:20:14 +01:00 · 2025-04-02 18:44:13 -04:00 · 2025-04-02 18:44:13 -04:00 · c4f1da26b3
commit c4f1da26b3
parent cfa44de1c9
17 changed files with 184 additions and 75 deletions
--- a/api/server/controllers/UserController.js
+++ b/api/server/controllers/UserController.js
@ -1,6 +1,8 @@
+const { FileSources } = require('librechat-data-provider');
 const {
  Balance,
  getFiles,
+  updateUser,
  deleteFiles,
  deleteConvos,
  deletePresets,
@ -12,6 +14,7 @@ const User = require('~/models/User');
 const { updateUserPluginAuth, deleteUserPluginAuth } = require('~/server/services/PluginService');
 const { updateUserPluginsService, deleteUserKey } = require('~/server/services/UserService');
 const { verifyEmail, resendVerificationEmail } = require('~/server/services/AuthService');
+const { needsRefresh, getNewS3URL } = require('~/server/services/Files/S3/crud');
 const { processDeleteRequest } = require('~/server/services/Files/process');
 const { deleteAllSharedLinks } = require('~/models/Share');
 const { deleteToolCalls } = require('~/models/ToolCall');
@ -19,8 +22,23 @@ const { Transaction } = require('~/models/Transaction');
 const { logger } = require('~/config');

 const getUserController = async (req, res) => {
+  /** @type {MongoUser} */
  const userData = req.user.toObject != null ? req.user.toObject() : { ...req.user };
  delete userData.totpSecret;
+  if (req.app.locals.fileStrategy === FileSources.s3 && userData.avatar) {
+    const avatarNeedsRefresh = needsRefresh(userData.avatar, 3600);
+    if (!avatarNeedsRefresh) {
+      return res.status(200).send(userData);
+    }
+    const originalAvatar = userData.avatar;
+    try {
+      userData.avatar = await getNewS3URL(userData.avatar);
+      await updateUser(userData.id, { avatar: userData.avatar });
+    } catch (error) {
+      userData.avatar = originalAvatar;
+      logger.error('Error getting new S3 URL for avatar:', error);
+    }
+  }
  res.status(200).send(userData);
 };

--- a/api/server/middleware/abortMiddleware.js
+++ b/api/server/middleware/abortMiddleware.js
@ -148,6 +148,13 @@ const createAbortController = (req, res, getAbortData, getReqData) => {
  return { abortController, onStart };
 };

+/**
+ * @param {ServerResponse} res
+ * @param {ServerRequest} req
+ * @param {Error | unknown} error
+ * @param {Partial<TMessage> & { partialText?: string }} data
+ * @returns { Promise<void> }
+ */
 const handleAbortError = async (res, req, error, data) => {
  if (error?.message?.includes('base64')) {
    logger.error('[handleAbortError] Error in base64 encoding', {
@ -178,17 +185,30 @@ const handleAbortError = async (res, req, error, data) => {
    errorText = `{"type":"${ErrorTypes.NO_SYSTEM_MESSAGES}"}`;
  }

+  /**
+   * @param {string} partialText
+   * @returns {Promise<void>}
+   */
  const respondWithError = async (partialText) => {
+    const endpointOption = req.body?.endpointOption;
    let options = {
      sender,
      messageId,
      conversationId,
      parentMessageId,
      text: errorText,
-      shouldSaveMessage: true,
      user: req.user.id,
+      shouldSaveMessage: true,
+      spec: endpointOption?.spec,
+      iconURL: endpointOption?.iconURL,
+      modelLabel: endpointOption?.modelLabel,
+      model: endpointOption?.modelOptions?.model || req.body?.model,
    };

+    if (req.body?.agent_id) {
+      options.agent_id = req.body.agent_id;
+    }
+
    if (partialText) {
      options = {
        ...options,
--- a/api/server/services/Config/getCustomConfig.js
+++ b/api/server/services/Config/getCustomConfig.js
@ -31,19 +31,16 @@ async function getCustomConfig() {
 async function getBalanceConfig() {
  const isLegacyEnabled = isEnabled(process.env.CHECK_BALANCE);
  const startBalance = process.env.START_BALANCE;
-  if (isLegacyEnabled || (startBalance != null && startBalance)) {
-    /** @type {TCustomConfig['balance']} */
-    const config = {
-      enabled: isLegacyEnabled,
-      startBalance: startBalance ? parseInt(startBalance, 10) : undefined,
-    };
-    return config;
-  }
+  /** @type {TCustomConfig['balance']} */
+  const config = {
+    enabled: isLegacyEnabled,
+    startBalance: startBalance != null && startBalance ? parseInt(startBalance, 10) : undefined,
+  };
  const customConfig = await getCustomConfig();
  if (!customConfig) {
-    return null;
+    return config;
  }
-  return customConfig?.['balance'] ?? null;
+  return { ...config, ...(customConfig?.['balance'] ?? {}) };
 }

 /**
--- a/api/server/services/Files/S3/crud.js
+++ b/api/server/services/Files/S3/crud.js
@ -303,6 +303,36 @@ function needsRefresh(signedUrl, bufferSeconds) {
  }
 }

+/**
+ * Generates a new URL for an expired S3 URL
+ * @param {string} currentURL - The current file URL
+ * @returns {Promise<string | undefined>}
+ */
+async function getNewS3URL(currentURL) {
+  try {
+    const s3Key = extractKeyFromS3Url(currentURL);
+    if (!s3Key) {
+      return;
+    }
+    const keyParts = s3Key.split('/');
+    if (keyParts.length < 3) {
+      return;
+    }
+
+    const basePath = keyParts[0];
+    const userId = keyParts[1];
+    const fileName = keyParts.slice(2).join('/');
+
+    return await getS3URL({
+      userId,
+      fileName,
+      basePath,
+    });
+  } catch (error) {
+    logger.error('Error getting new S3 URL:', error);
+  }
+}
+
 /**
 * Refreshes S3 URLs for an array of files if they're expired or close to expiring
 *
@ -333,30 +363,15 @@ async function refreshS3FileUrls(files, batchUpdateFiles, bufferSeconds = 3600)
      continue;
    }
    try {
-      const s3Key = extractKeyFromS3Url(file.filepath);
-      if (!s3Key) {
+      const newURL = await getNewS3URL(file.filepath);
+      if (!newURL) {
        continue;
      }
-      const keyParts = s3Key.split('/');
-      if (keyParts.length < 3) {
-        continue;
-      }
-
-      const basePath = keyParts[0];
-      const userId = keyParts[1];
-      const fileName = keyParts.slice(2).join('/');
-
-      const newUrl = await getS3URL({
-        userId,
-        fileName,
-        basePath,
-      });
-
      filesToUpdate.push({
        file_id: file.file_id,
-        filepath: newUrl,
+        filepath: newURL,
      });
-      files[i].filepath = newUrl;
+      files[i].filepath = newURL;
    } catch (error) {
      logger.error(`Error refreshing S3 URL for file ${file.file_id}:`, error);
    }
@ -425,4 +440,6 @@ module.exports = {
  getS3FileStream,
  refreshS3FileUrls,
  refreshS3Url,
+  needsRefresh,
+  getNewS3URL,
 };
--- a/api/server/services/MCP.js
+++ b/api/server/services/MCP.js
@ -69,7 +69,13 @@ async function createMCPTool({ req, toolKey, provider }) {
      }
      return result;
    } catch (error) {
-      return `${toolName} MCP server tool call failed.`;
+      logger.error(
+        `[MCP][User: ${userId}][${serverName}] Error calling "${toolName}" MCP tool:`,
+        error,
+      );
+      throw new Error(
+        `"${toolKey}" tool call failed${error?.message ? `: ${error?.message}` : '.'}`,
+      );
    }
  };

--- a/api/typedefs.js
+++ b/api/typedefs.js
@ -828,6 +828,12 @@
 * @memberof typedefs
 */

+/**
+ * @exports TEndpointOption
+ * @typedef {import('librechat-data-provider').TEndpointOption} TEndpointOption
+ * @memberof typedefs
+ */
+
 /**
 * @exports TAttachment
 * @typedef {import('librechat-data-provider').TAttachment} TAttachment
--- a/client/src/components/Chat/Menus/Endpoints/components/SpecIcon.tsx
+++ b/client/src/components/Chat/Menus/Endpoints/components/SpecIcon.tsx
@ -20,7 +20,7 @@ const SpecIcon: React.FC<SpecIconProps> = ({ currentSpec, endpointsConfig }) =>
  let Icon: IconType;

  if (!iconURL.includes('http')) {
-    Icon = (icons[iconKey] ?? icons.unknown) as IconType;
+    Icon = (icons[iconURL] ?? icons[iconKey] ?? icons.unknown) as IconType;
  } else if (iconURL) {
    return (
      <URLIcon
@ -32,7 +32,7 @@ const SpecIcon: React.FC<SpecIconProps> = ({ currentSpec, endpointsConfig }) =>
      />
    );
  } else {
-    Icon = (icons[endpoint ?? ''] ?? icons.unknown) as IconType;
+    Icon = (icons[endpoint ?? ''] ?? icons[iconKey] ?? icons.unknown) as IconType;
  }

  return (
--- a/client/src/components/Chat/Messages/Content/Parts/AgentUpdate.tsx
+++ b/client/src/components/Chat/Messages/Content/Parts/AgentUpdate.tsx
@ -1,13 +1,16 @@
 import React, { useMemo } from 'react';
 import { EModelEndpoint } from 'librechat-data-provider';
+import type { TMessage } from 'librechat-data-provider';
+import MessageIcon from '~/components/Share/MessageIcon';
 import { useAgentsMapContext } from '~/Providers';
-import Icon from '~/components/Endpoints/Icon';
+import { useLocalize } from '~/hooks';

 interface AgentUpdateProps {
  currentAgentId: string;
 }

 const AgentUpdate: React.FC<AgentUpdateProps> = ({ currentAgentId }) => {
+  const localize = useLocalize();
  const agentsMap = useAgentsMapContext() || {};
  const currentAgent = useMemo(() => agentsMap[currentAgentId], [agentsMap, currentAgentId]);
  if (!currentAgentId) {
@ -23,14 +26,19 @@ const AgentUpdate: React.FC<AgentUpdateProps> = ({ currentAgentId }) => {
      </div>
      <div className="my-4 flex items-center gap-2">
        <div className="flex h-6 w-6 items-center justify-center overflow-hidden rounded-full">
-          <Icon
-            endpoint={EModelEndpoint.agents}
-            agentName={currentAgent?.name ?? ''}
-            iconURL={currentAgent?.avatar?.filepath}
-            isCreatedByUser={false}
+          <MessageIcon
+            message={
+              {
+                endpoint: EModelEndpoint.agents,
+                isCreatedByUser: false,
+              } as TMessage
+            }
+            agent={currentAgent}
          />
        </div>
-        <div className="font-medium text-text-primary">{currentAgent?.name}</div>
+        <div className="text-base font-medium text-text-primary">
+          {currentAgent?.name || localize('com_ui_agent')}
+        </div>
      </div>
    </div>
  );
--- a/client/src/components/Endpoints/ConvoIconURL.tsx
+++ b/client/src/components/Endpoints/ConvoIconURL.tsx
@ -66,7 +66,7 @@ const ConvoIconURL: React.FC<ConvoIconURLProps> = ({
          agentName={agentName}
          iconURL={endpointIconURL}
          assistantName={assistantName}
-          avatar={assistantAvatar ?? agentAvatar}
+          avatar={assistantAvatar || agentAvatar}
        />
      )}
    </div>
--- a/client/src/components/Share/MessageIcon.tsx
+++ b/client/src/components/Share/MessageIcon.tsx
@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import type { TMessage, TPreset, Assistant, Agent } from 'librechat-data-provider';
+import type { TMessage, Assistant, Agent } from 'librechat-data-provider';
 import type { TMessageProps } from '~/common';
 import MessageEndpointIcon from '../Endpoints/MessageEndpointIcon';
 import ConvoIconURL from '~/components/Endpoints/ConvoIconURL';
@ -14,11 +14,6 @@ export default function MessageIcon(
 ) {
  const { message, conversation, assistant, agent } = props;

-  const assistantName = assistant ? (assistant.name as string | undefined) : '';
-  const assistantAvatar = assistant ? (assistant.metadata?.avatar as string | undefined) : '';
-  const agentName = agent ? (agent.name as string | undefined) : '';
-  const agentAvatar = agent ? (agent.metadata?.avatar as string | undefined) : '';
-
  const messageSettings = useMemo(
    () => ({
      ...(conversation ?? {}),
@ -33,7 +28,27 @@ export default function MessageIcon(
  const iconURL = messageSettings.iconURL ?? '';
  let endpoint = messageSettings.endpoint;
  endpoint = getIconEndpoint({ endpointsConfig: undefined, iconURL, endpoint });
-
+  const assistantName = (assistant ? assistant.name : '') ?? '';
+  const assistantAvatar = (assistant ? assistant.metadata?.avatar : '') ?? '';
+  const agentName = (agent ? agent.name : '') ?? '';
+  const agentAvatar = (agent ? agent?.avatar?.filepath : '') ?? '';
+  const avatarURL = useMemo(() => {
+    let result = '';
+    if (assistant) {
+      result = assistantAvatar;
+    } else if (agent) {
+      result = agentAvatar;
+    }
+    return result;
+  }, [assistant, agent, assistantAvatar, agentAvatar]);
+  console.log('MessageIcon', {
+    endpoint,
+    iconURL,
+    assistantName,
+    assistantAvatar,
+    agentName,
+    agentAvatar,
+  });
  if (message?.isCreatedByUser !== true && iconURL && iconURL.includes('http')) {
    return (
      <ConvoIconURL
@ -68,7 +83,7 @@ export default function MessageIcon(
    <MessageEndpointIcon
      {...messageSettings}
      endpoint={endpoint}
-      iconURL={assistant == null ? undefined : assistantAvatar}
+      iconURL={avatarURL}
      model={message?.model ?? conversation?.model}
      assistantName={assistantName}
      agentName={agentName}
--- a/client/src/components/SidePanel/Agents/Advanced/AgentChain.tsx
+++ b/client/src/components/SidePanel/Agents/Advanced/AgentChain.tsx
@ -2,12 +2,13 @@ import { X, Link2, PlusCircle } from 'lucide-react';
 import { EModelEndpoint } from 'librechat-data-provider';
 import React, { useState, useMemo, useCallback, useEffect } from 'react';
 import type { ControllerRenderProps } from 'react-hook-form';
+import type { TMessage } from 'librechat-data-provider';
 import type { AgentForm, OptionWithIcon } from '~/common';
 import ControlCombobox from '~/components/ui/ControlCombobox';
 import { HoverCard, HoverCardPortal, HoverCardContent, HoverCardTrigger } from '~/components/ui';
+import MessageIcon from '~/components/Share/MessageIcon';
 import { CircleHelpIcon } from '~/components/svg';
 import { useAgentsMapContext } from '~/Providers';
-import Icon from '~/components/Endpoints/Icon';
 import { useLocalize } from '~/hooks';
 import { ESide } from '~/common';

@ -37,11 +38,14 @@ const AgentChain: React.FC<AgentChainProps> = ({ field, currentAgentId }) => {
              label: agent?.name || '',
              value: agent?.id,
              icon: (
-                <Icon
-                  endpoint={EModelEndpoint.agents}
-                  agentName={agent?.name ?? ''}
-                  iconURL={agent?.avatar?.filepath}
-                  isCreatedByUser={false}
+                <MessageIcon
+                  message={
+                    {
+                      endpoint: EModelEndpoint.agents,
+                      isCreatedByUser: false,
+                    } as TMessage
+                  }
+                  agent={agent}
                />
              ),
            }) as OptionWithIcon,
@ -88,11 +92,14 @@ const AgentChain: React.FC<AgentChainProps> = ({ field, currentAgentId }) => {
        <div className="flex h-10 items-center justify-between rounded-md border border-border-medium bg-surface-primary-contrast px-3 py-2">
          <div className="flex items-center gap-2">
            <div className="flex h-6 w-6 items-center justify-center overflow-hidden rounded-full">
-              <Icon
-                endpoint={EModelEndpoint.agents}
-                agentName={getAgentDetails(currentAgentId)?.name ?? ''}
-                iconURL={getAgentDetails(currentAgentId)?.avatar?.filepath}
-                isCreatedByUser={false}
+              <MessageIcon
+                message={
+                  {
+                    endpoint: EModelEndpoint.agents,
+                    isCreatedByUser: false,
+                  } as TMessage
+                }
+                agent={currentAgentId ? agentsMap[currentAgentId] : undefined}
              />
            </div>
            <div className="font-medium text-text-primary">
@ -114,11 +121,14 @@ const AgentChain: React.FC<AgentChainProps> = ({ field, currentAgentId }) => {
                items={selectableAgents}
                displayValue={getAgentDetails(agentId)?.name ?? ''}
                SelectIcon={
-                  <Icon
-                    endpoint={EModelEndpoint.agents}
-                    isCreatedByUser={false}
-                    agentName={getAgentDetails(agentId)?.name ?? ''}
-                    iconURL={getAgentDetails(agentId)?.avatar?.filepath}
+                  <MessageIcon
+                    message={
+                      {
+                        endpoint: EModelEndpoint.agents,
+                        isCreatedByUser: false,
+                      } as TMessage
+                    }
+                    agent={agentId ? agentsMap[agentId] : undefined}
                  />
                }
                className="flex-1 border-border-heavy"
--- a/client/src/components/SidePanel/Agents/AgentConfig.tsx
+++ b/client/src/components/SidePanel/Agents/AgentConfig.tsx
@ -53,27 +53,27 @@ export default function AgentConfig({
  const agent_id = useWatch({ control, name: 'id' });

  const toolsEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.tools),
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.tools) ?? false,
    [agentsConfig],
  );
  const actionsEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.actions),
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.actions) ?? false,
    [agentsConfig],
  );
  const artifactsEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.artifacts) ?? false,
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.artifacts) ?? false,
    [agentsConfig],
  );
  const ocrEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.ocr) ?? false,
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.ocr) ?? false,
    [agentsConfig],
  );
  const fileSearchEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.file_search) ?? false,
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.file_search) ?? false,
    [agentsConfig],
  );
  const codeEnabled = useMemo(
-    () => agentsConfig?.capabilities.includes(AgentCapabilities.execute_code) ?? false,
+    () => agentsConfig?.capabilities?.includes(AgentCapabilities.execute_code) ?? false,
    [agentsConfig],
  );

--- a/client/src/components/SidePanel/SidePanel.tsx
+++ b/client/src/components/SidePanel/SidePanel.tsx
@ -91,6 +91,7 @@ const SidePanel = ({
    keyProvided,
    endpointType,
    interfaceConfig,
+    endpointsConfig,
  });

  const toggleNavVisible = useCallback(() => {
--- a/client/src/hooks/Nav/useSideNavLinks.ts
+++ b/client/src/hooks/Nav/useSideNavLinks.ts
@ -8,7 +8,7 @@ import {
  EModelEndpoint,
  Permissions,
 } from 'librechat-data-provider';
-import type { TConfig, TInterfaceConfig } from 'librechat-data-provider';
+import type { TConfig, TInterfaceConfig, TEndpointsConfig } from 'librechat-data-provider';
 import type { NavLink } from '~/common';
 import AgentPanelSwitch from '~/components/SidePanel/Agents/AgentPanelSwitch';
 import BookmarkPanel from '~/components/SidePanel/Bookmarks/BookmarkPanel';
@ -27,6 +27,7 @@ export default function useSideNavLinks({
  endpoint,
  endpointType,
  interfaceConfig,
+  endpointsConfig,
 }: {
  hidePanel: () => void;
  assistants?: TConfig | null;
@ -35,6 +36,7 @@ export default function useSideNavLinks({
  endpoint?: EModelEndpoint | null;
  endpointType?: EModelEndpoint | null;
  interfaceConfig: Partial<TInterfaceConfig>;
+  endpointsConfig: TEndpointsConfig;
 }) {
  const hasAccessToPrompts = useHasAccess({
    permissionType: PermissionTypes.PROMPTS,
@ -70,7 +72,13 @@ export default function useSideNavLinks({
      });
    }

-    if (hasAccessToAgents && hasAccessToCreateAgents && agents && agents.disableBuilder !== true) {
+    if (
+      endpointsConfig?.[EModelEndpoint.agents] &&
+      hasAccessToAgents &&
+      hasAccessToCreateAgents &&
+      agents &&
+      agents.disableBuilder !== true
+    ) {
      links.push({
        title: 'com_sidepanel_agent_builder',
        label: '',
@ -133,6 +141,7 @@ export default function useSideNavLinks({

    return links;
  }, [
+    endpointsConfig?.[EModelEndpoint.agents],
    interfaceConfig.parameters,
    keyProvided,
    assistants,
--- a/client/src/hooks/SSE/useEventHandlers.ts
+++ b/client/src/hooks/SSE/useEventHandlers.ts
@ -598,7 +598,7 @@ export default function useEventHandlers({
      });

      setMessages([...messages, userMessage, errorResponse]);
-      if (receivedConvoId && paramId === 'new' && newConversation) {
+      if (receivedConvoId && paramId === Constants.NEW_CONVO && newConversation) {
        newConversation({
          template: { conversationId: receivedConvoId },
          preset: tPresetSchema.parse(submission.conversation),
--- a/config/set-balance.js
+++ b/config/set-balance.js
@ -98,7 +98,7 @@ const Balance = require('~/models/Balance');
  }

  // Check the result
-  if (!result?.tokenCredits) {
+  if (result?.tokenCredits == null) {
    console.red('Error: Something went wrong while updating the balance!');
    console.error(result);
    silentExit(1);
--- a/packages/data-provider/src/types.ts
+++ b/packages/data-provider/src/types.ts
@ -18,6 +18,8 @@ export type TMessages = TMessage[];

 /* TODO: Cleanup EndpointOption types */
 export type TEndpointOption = {
+  spec?: string | null;
+  iconURL?: string | null;
  endpoint: EModelEndpoint;
  endpointType?: EModelEndpoint;
  modelDisplayLabel?: string;