fixed markdown double newlines

src/App.js

@@ -41,6 +41,17 @@ const GlobalStyle = createGlobalStyle`
   .line-break {
     white-space: pre-line;
   }
+
+  .custom-paragraph {
+    margin: 0;
+    padding: 0;
+  }
+
+  .custom-linebreak {
+    display: block;
+    margin: 0;
+    padding: 0;
+  }
 `;
 
 const StyledContainer = styled(ToastContainer)`

src/components/Post.jsx

@@ -3,6 +3,22 @@ import ReactMarkdown from 'react-markdown';
 import { Link } from 'react-router-dom';
 import DOMPurify from 'dompurify';
 
+const removeExtraNewlines = () => (tree) => {
+  let lastNodeWasNewline = false;
+  tree.children = tree.children.filter((node) => {
+    if (node.type === 'br') {
+      if (lastNodeWasNewline) {
+        return false;
+      }
+      lastNodeWasNewline = true;
+    } else {
+      lastNodeWasNewline = false;
+    }
+    return true;
+  });
+};
+
+
 const blockquoteToGreentext = () => (tree) => {
   tree.children.forEach((node) => {
     if (node.type === 'blockquote') {
@@ -56,12 +72,14 @@ const Post = ({ content, handlequoteclick, comment }) => {
   return (
     <ReactMarkdown
       children={sanitizedContent}
-      remarkPlugins={[blockquoteToGreentext]}
+      remarkPlugins={[blockquoteToGreentext, removeExtraNewlines]}
       components={{
         img: () => null,
         video: () => null,
         source: () => null,
         gif: () => null,
+        p: ({ children }) => <div className="custom-paragraph">{children}</div>,
+        br: () => <br className="custom-linebreak" />, 
       }}
       className='line-break'
     />