From 366e4c5adbaf517fca2a9f11ee2f35cc000aed41 Mon Sep 17 00:00:00 2001
From: Danny Avila <danny@librechat.ai>
Date: Thu, 22 Aug 2024 10:49:51 -0400
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20fix:=20EndpointIcon=20crash=20wh?=
 =?UTF-8?q?en=20using=20`@`=20mention=20command=20(#3742)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Endpoints/EndpointIcon.tsx | 62 ++++++++++---------
 1 file changed, 32 insertions(+), 30 deletions(-)

diff --git a/client/src/components/Endpoints/EndpointIcon.tsx b/client/src/components/Endpoints/EndpointIcon.tsx
index 5c7c89a5db..caa6fe6ede 100644
--- a/client/src/components/Endpoints/EndpointIcon.tsx
+++ b/client/src/components/Endpoints/EndpointIcon.tsx
@@ -31,40 +31,42 @@ export default function EndpointIcon({
   const endpointType = getEndpointField(endpointsConfig, endpoint, 'type');
   const endpointIconURL = getEndpointField(endpointsConfig, endpoint, 'iconURL');
 
-  const assistant =
-    isAssistantsEndpoint(endpoint) && assistantMap?.[endpoint]?.[conversation?.assistant_id ?? ''];
-  const assistantAvatar = (assistant && (assistant?.metadata?.avatar as string)) || '';
-  const assistantName = (assistant && assistant?.name) || '';
+  const assistant = isAssistantsEndpoint(endpoint)
+    ? assistantMap?.[endpoint]?.[conversation?.assistant_id ?? '']
+    : null;
+  const assistantAvatar = (assistant && (assistant.metadata?.avatar as string)) || '';
+  const assistantName = assistant && (assistant.name ?? '');
 
   const iconURL = assistantAvatar || convoIconURL;
 
-  let icon: React.ReactNode | null = null;
   if (iconURL && (iconURL.includes('http') || iconURL.startsWith('/images/'))) {
-    icon = ConvoIconURL({
-      preset: {
-        ...(conversation as TPreset),
-        iconURL,
-      },
-      context,
-      endpointIconURL,
-      assistantAvatar,
-      assistantName,
-    });
+    return (
+      <ConvoIconURL
+        preset={{
+          ...(conversation as TPreset),
+          iconURL,
+        }}
+        context={context}
+        endpointIconURL={endpointIconURL}
+        assistantAvatar={assistantAvatar}
+        assistantName={assistantName ?? ''}
+      />
+    );
   } else {
-    icon = MinimalIcon({
-      size: 20,
-      iconURL: endpointIconURL,
-      endpoint,
-      endpointType,
-      model: conversation?.model,
-      error: false,
-      className,
-      isCreatedByUser: false,
-      chatGptLabel: undefined,
-      modelLabel: undefined,
-      jailbreak: undefined,
-    });
+    return (
+      <MinimalIcon
+        size={20}
+        iconURL={endpointIconURL}
+        endpoint={endpoint}
+        endpointType={endpointType}
+        model={conversation?.model}
+        error={false}
+        className={className}
+        isCreatedByUser={false}
+        chatGptLabel={undefined}
+        modelLabel={undefined}
+        jailbreak={undefined}
+      />
+    );
   }
-
-  return icon;
 }