From fd167732950ac780daba1f633ab43e7504219925 Mon Sep 17 00:00:00 2001
From: Sean Hatfield <seanhatfield5@gmail.com>
Date: Thu, 15 Aug 2024 12:17:05 -0700
Subject: [PATCH] Fix markdown styling for rendered images (#2125)

fix md styling for rendered images
---
 frontend/src/utils/chat/markdown.js | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/frontend/src/utils/chat/markdown.js b/frontend/src/utils/chat/markdown.js
index 77004491d..17b5acbb8 100644
--- a/frontend/src/utils/chat/markdown.js
+++ b/frontend/src/utils/chat/markdown.js
@@ -44,7 +44,19 @@ const markdown = markdownIt({
       "</pre></div>"
     );
   },
-}).use(markdownItKatex);
+});
+
+// Custom renderer for responsive images rendered in markdown
+markdown.renderer.rules.image = function (tokens, idx) {
+  const token = tokens[idx];
+  const srcIndex = token.attrIndex("src");
+  const src = token.attrs[srcIndex][1];
+  const alt = token.content || "";
+
+  return `<div class="w-full max-w-[800px]"><img src="${src}" alt="${alt}" class="w-full h-auto" /></div>`;
+};
+
+markdown.use(markdownItKatex);
 
 export default function renderMarkdown(text = "") {
   return markdown.render(text);