refactor Post.jsx with memoization

src/components/Post.jsx

@@ -1,99 +1,98 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { Link } from 'react-router-dom';
 import rehypeSanitize, { defaultSchema } from 'rehype-sanitize';
 import breaks from 'remark-breaks';
 
 
-const customSchema = {
+const Post = ({ content }) => {
-  ...defaultSchema,
+  const doubleNewlineContent = useMemo(() => content?.replaceAll(/\n(?!\n)/g, '\n\n'), [content]);
-  tagNames: [...defaultSchema.tagNames, 'div'],
+
-  attributes: {
+  const customSchema = useMemo(() => ({
-    ...defaultSchema.attributes,
+    ...defaultSchema,
-    div: ['className'],
+    tagNames: [...defaultSchema.tagNames, 'div'],
-  },
+    attributes: {
-};
+      ...defaultSchema.attributes,
+      div: ['className'],
+    },
+  }), []);
 
 
-const blockquoteToGreentext = () => (tree) => {
+  const blockquoteToGreentext = () => (tree) => {
-  tree.children.forEach((node) => {
+    tree.children.forEach((node) => {
-    if (node.type === 'blockquote') {
+      if (node.type === 'blockquote') {
-      node.children.forEach((child) => {
+        node.children.forEach((child) => {
-        if (child.type === 'paragraph' && child.children.length > 0) {
+          if (child.type === 'paragraph' && child.children.length > 0) {
-          const prefix = {
+            const prefix = {
-            type: 'text',
+              type: 'text',
-            value: '>',
+              value: '>',
-          };
+            };
-          child.children.unshift(prefix);
+            child.children.unshift(prefix);
-        }
-      });
-      node.type = 'div';
-      node.data = {
-        hName: 'div',
-        hProperties: {
-          className: 'greentext',
-        },
-      };
-    }
-  });
-};
-
-
-const createQuotelink = (children) => {
-  const regexC = /(c\/[A-Za-z0-9]{46}|c\/[A-Za-z0-9]{12})/g;
-  const regexP = /(p\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth))/g;
-  const regexU = /(u\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth))/g;
-  const regexPC = /(p\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth)\/c\/[A-Za-z0-9]{46})/g;  
-
-  const regexArray = [regexU, regexPC, regexP, regexC];
-  let parts = [children];
-
-  regexArray.forEach(regex => {
-    parts = parts.flatMap((child, i) => {
-      if (typeof child === 'string') {
-        const newParts = [];
-        let match;
-        let lastIndex = 0;
-
-        while ((match = regex.exec(child)) !== null) {
-          const matchedText = match[0];
-          const index = match.index;
-
-          if (index > lastIndex) {
-            newParts.push(child.substring(lastIndex, index));
           }
-
+        });
-          newParts.push(
+        node.type = 'div';
-            <Link
+        node.data = {
-              key={`link-${i}-${matchedText}`}
+          hName: 'div',
-              className="quotelink"
+          hProperties: {
-              to={() => {}}
+            className: 'greentext',
-            >
+          },
-              {matchedText}
+        };
-            </Link>
-          );
-          
-          lastIndex = index + matchedText.length;
-        }
-
-        if (lastIndex < child.length) {
-          newParts.push(child.substring(lastIndex));
-        }
-
-        return newParts;
-      } else {
-        return child;
       }
     });
-  });
+  };
-
-  return parts;
-};
 
 
+  const createQuotelink = (children) => {
+    const regexC = /(c\/[A-Za-z0-9]{46}|c\/[A-Za-z0-9]{12})/g;
+    const regexP = /(p\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth))/g;
+    const regexU = /(u\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth))/g;
+    const regexPC = /(p\/([A-Za-z0-9]{52}|[A-Za-z0-9-.]*\.eth)\/c\/[A-Za-z0-9]{46})/g;  
+
+    const regexArray = [regexU, regexPC, regexP, regexC];
+    let parts = [children];
+
+    regexArray.forEach(regex => {
+      parts = parts.flatMap((child, i) => {
+        if (typeof child === 'string') {
+          const newParts = [];
+          let match;
+          let lastIndex = 0;
+
+          while ((match = regex.exec(child)) !== null) {
+            const matchedText = match[0];
+            const index = match.index;
+
+            if (index > lastIndex) {
+              newParts.push(child.substring(lastIndex, index));
+            }
+
+            newParts.push(
+              <Link
+                key={`link-${i}-${matchedText}`}
+                className="quotelink"
+                to={() => {}}
+              >
+                {matchedText}
+              </Link>
+            );
+            
+            lastIndex = index + matchedText.length;
+          }
+
+          if (lastIndex < child.length) {
+            newParts.push(child.substring(lastIndex));
+          }
+
+          return newParts;
+        } else {
+          return child;
+        }
+      });
+    });
+
+    return parts;
+  };
 
-const Post = ({ content }) => {
-  const doubleNewlineContent = content?.replaceAll(/\n(?!\n)/g, '\n\n');
 
   return (
     <ReactMarkdown