From dfd77a383283da68e21bb198410999f4534ca8b8 Mon Sep 17 00:00:00 2001
From: Enrico Ros <enrico.ros@gmail.com>
Date: Fri, 2 Aug 2024 17:13:12 -0700
Subject: [PATCH] Fix showing errors

---
 .../message/fragments-content/ContentFragments.tsx        | 4 ++--
 ...utoBlocks.tsx => ContentPartTextAutoBlocksOrError.tsx} | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)
 rename src/apps/chat/components/message/fragments-content/{ContentPartTextAutoBlocks.tsx => ContentPartTextAutoBlocksOrError.tsx} (90%)

diff --git a/src/apps/chat/components/message/fragments-content/ContentFragments.tsx b/src/apps/chat/components/message/fragments-content/ContentFragments.tsx
index 9f0998400..cbfc2e598 100644
--- a/src/apps/chat/components/message/fragments-content/ContentFragments.tsx
+++ b/src/apps/chat/components/message/fragments-content/ContentFragments.tsx
@@ -12,7 +12,7 @@ import { DMessageContentFragment, DMessageFragment, DMessageFragmentId, isConten
 import type { ChatMessageTextPartEditState } from '../ChatMessage';
 import { ContentPartImageRef } from './ContentPartImageRef';
 import { ContentPartPlaceholder } from './ContentPartPlaceholder';
-import { ContentPartTextAutoBlocks } from './ContentPartTextAutoBlocks';
+import { ContentPartTextAutoBlocksOrError } from './ContentPartTextAutoBlocksOrError';
 import { ContentPartTextEditor } from './ContentPartTextEditor';
 
 
@@ -149,7 +149,7 @@ export function ContentFragments(props: {
 
         case 'text':
           return (
-            <ContentPartTextAutoBlocks
+            <ContentPartTextAutoBlocksOrError
               key={fragment.fId}
               // ref={blocksRendererRef}
               textPartText={fragment.part.text}
diff --git a/src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocks.tsx b/src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocksOrError.tsx
similarity index 90%
rename from src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocks.tsx
rename to src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocksOrError.tsx
index a5b080aaf..bc4bb8762 100644
--- a/src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocks.tsx
+++ b/src/apps/chat/components/message/fragments-content/ContentPartTextAutoBlocksOrError.tsx
@@ -14,7 +14,7 @@ import { explainServiceErrors } from '../explainServiceErrors';
  * The OG part, comprised of text, which can be markdown, have code blocks, etc.
  * Uses BlocksRenderer to render the markdown/code/html/text, etc.
  */
-export function ContentPartTextAutoBlocks(props: {
+export function ContentPartTextAutoBlocksOrError(props: {
   textPartText: string,
 
   messageRole: DMessageRole,
@@ -38,16 +38,16 @@ export function ContentPartTextAutoBlocks(props: {
   const messageText = props.textPartText;
   const fromAssistant = props.messageRole === 'assistant';
 
-  const errorMessage = React.useMemo(
+  const errorNode = React.useMemo(
     () => explainServiceErrors(messageText, fromAssistant, props.messageOriginLLM),
     [fromAssistant, messageText, props.messageOriginLLM],
   );
 
   // if errored, render an Auto-Error message
-  if (errorMessage) {
+  if (errorNode) {
     return (
       <GoodTooltip placement='top' arrow title={messageText}>
-        <div><InlineError error={`${errorMessage}. Hover this message for more details.`} /></div>
+        <div><InlineError error={<>{errorNode} Hover this message for more details.</>} /></div>
       </GoodTooltip>
     );
   }