turn \n into linebreaks

Author: KianNH

package-lock.json

@@ -110,6 +110,7 @@
 		"rehype-stringify": "10.0.1",
 		"rehype-title-figure": "0.1.2",
 		"remark": "15.0.1",
+		"remark-breaks": "4.0.0",
 		"remark-gfm": "4.0.1",
 		"remark-stringify": "11.0.0",
 		"sharp": "0.34.2",

package.json

@@ -1,5 +1,6 @@
 import { useState } from "react";
 import Markdown from "react-markdown";
+import remarkBreaks from "remark-breaks";
 import remarkGfm from "remark-gfm";
 import { fetchEventSource } from "@microsoft/fetch-event-source";
 import { Ring } from "ldrs/react";
@@ -30,7 +31,9 @@ function Messages({
 						key={index}
 						className={`${classes.base} ${message.role === "user" ? classes.user : classes.assistant}`}
 					>
-						<Markdown remarkPlugins={[remarkGfm]}>{message.content}</Markdown>
+						<Markdown remarkPlugins={[remarkGfm, remarkBreaks]}>
+							{message.content}
+						</Markdown>
 					</div>
 				))}
 			{loading && (
@@ -65,8 +68,8 @@ export default function SupportAI() {
 		let sources: Sources = [];
 
 		await fetchEventSource(
-			// "http://localhost:8010/proxy/devdocs/ask",
-			"https://support-ai.cloudflaresupport.workers.dev/devdocs/ask",
+			"http://localhost:8010/proxy/devdocs/ask",
+			// "https://support-ai.cloudflaresupport.workers.dev/devdocs/ask",
 			{
 				method: "POST",
 				body: JSON.stringify({
@@ -110,6 +113,8 @@ export default function SupportAI() {
 									.map((source) => `- [${source.title}](${source.file_path})`)
 									.join("\n"),
 							].join("\n");
+
+							console.log(JSON.stringify(newMessages, null, 2));
 							return newMessages;
 						});
 					}