Fix showing errors

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}

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>
     );
   }