fix(web): Single linebreaks are lost when viewing textnote card. Fixes #549 (#551)

added remarkBreaks plugin to properly handle single newlines

1 files changed, 2 insertions, 1 deletions

diff --git a/apps/web/components/ui/markdown-component.tsx b/apps/web/components/ui/markdown-component.tsx
index d567ddb3..d3c832ac 100644
--- a/apps/web/components/ui/markdown-component.tsx
+++ b/apps/web/components/ui/markdown-component.tsx
@@ -4,6 +4,7 @@ import { cn } from "@/lib/utils";
 import Markdown from "react-markdown";

 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";

 import { dracula } from "react-syntax-highlighter/dist/cjs/styles/prism";

+import remarkBreaks from "remark-breaks";

 import remarkGfm from "remark-gfm";

 

 function PreWithCopyBtn({ className, ...props }: React.ComponentProps<"pre">) {

@@ -28,7 +29,7 @@ export function MarkdownComponent({
 }) {

   return (

     <Markdown

-      remarkPlugins={[remarkGfm]}

+      remarkPlugins={[remarkGfm, remarkBreaks]}

       className="prose dark:prose-invert"

       components={{

         pre({ ...props }) {