From 9e447814b551c352709296ae562f1f50480320f5 Mon Sep 17 00:00:00 2001
From: "A.J. Shulman" <Shulman.aj@gmail.com>
Date: Fri, 8 Nov 2024 11:09:25 -0500
Subject: Displays markdown again now

---
 .../chatbot/chatboxcomponents/MessageComponent.tsx | 35 ++++++++++++++--------
 1 file changed, 23 insertions(+), 12 deletions(-)

(limited to 'src')

diff --git a/src/client/views/nodes/chatbot/chatboxcomponents/MessageComponent.tsx b/src/client/views/nodes/chatbot/chatboxcomponents/MessageComponent.tsx
index 120e20001..1a3d4dbc6 100644
--- a/src/client/views/nodes/chatbot/chatboxcomponents/MessageComponent.tsx
+++ b/src/client/views/nodes/chatbot/chatboxcomponents/MessageComponent.tsx
@@ -11,6 +11,7 @@ import React, { useState } from 'react';
 import { observer } from 'mobx-react';
 import { AssistantMessage, Citation, MessageContent, PROCESSING_TYPE, ProcessingInfo, TEXT_TYPE } from '../types/types';
 import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
 
 /**
  * Props for the MessageComponentBox.
@@ -50,17 +51,27 @@ const MessageComponentBox: React.FC<MessageComponentProps> = ({ message, onFollo
             const citation_ids = item.citation_ids || [];
             return (
                 <span key={i} className="grounded-text">
-                    {item.text}
-                    {citation_ids.map((id, idx) => {
-                        const citation = message.citations?.find(c => c.citation_id === id);
-                        if (!citation) return null;
-                        return (
-                            <button key={i + idx} className="citation-button" onClick={() => onCitationClick(citation)}>
-                                {i + idx + 1}
-                            </button>
-                        );
-                    })}
-                    <br />
+                    <ReactMarkdown
+                        remarkPlugins={[remarkGfm]}
+                        components={{
+                            p: ({ node, children }) => (
+                                <span className="grounded-text">
+                                    {children}
+                                    {citation_ids.map((id, idx) => {
+                                        const citation = message.citations?.find(c => c.citation_id === id);
+                                        if (!citation) return null;
+                                        return (
+                                            <button key={i + idx} className="citation-button" onClick={() => onCitationClick(citation)} style={{ display: 'inline-flex', alignItems: 'center', marginLeft: '4px' }}>
+                                                {i + idx + 1}
+                                            </button>
+                                        );
+                                    })}
+                                    <br />
+                                </span>
+                            ),
+                        }}>
+                        {item.text}
+                    </ReactMarkdown>
                 </span>
             );
         }
@@ -69,7 +80,7 @@ const MessageComponentBox: React.FC<MessageComponentProps> = ({ message, onFollo
         else if (item.type === TEXT_TYPE.NORMAL) {
             return (
                 <span key={i} className="normal-text">
-                    <ReactMarkdown>{item.text}</ReactMarkdown>
+                    <ReactMarkdown remarkPlugins={[remarkGfm]}>{item.text}</ReactMarkdown>
                 </span>
             );
         }
-- 
cgit v1.2.3-70-g09d2