Properly render quotes

attestate · Jan 29, 2025 · 5c8f45c · 5c8f45c
1 parent abfdf81
commit 5c8f45c
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 2 deletions.
diff --git a/src/web/src/CommentInput.jsx b/src/web/src/CommentInput.jsx
@@ -201,7 +201,11 @@ const CommentInput = (props) => {
 
       const start = textarea.selectionStart;
       const end = textarea.selectionEnd;
-      const quote = `> ${selected}\n\n`;
+      const quote =
+        selected
+          .split("\n")
+          .map((line) => `> ${line}`)
+          .join("\n") + "\n\n";
 
       setText(text.slice(0, start) + quote + text.slice(end));
 

diff --git a/src/web/src/CommentSection.jsx b/src/web/src/CommentSection.jsx
@@ -342,7 +342,30 @@ const Comment = React.forwardRef(({ comment, storyIndex }, ref) => {
               },
             }}
           >
-            {comment.title}
+            {comment.title.split("\n").map((line, i) => {
+              if (line.startsWith("> ")) {
+                return (
+                  <div
+                    key={i}
+                    style={{
+                      borderLeft: "3px solid #ccc",
+                      paddingLeft: "10px",
+                      margin: "8px 0 0 0",
+                      color: "#666",
+                    }}
+                  >
+                    {line.substring(2)}
+                  </div>
+                );
+              }
+              // Only wrap in div if it's not an empty line
+              return line.trim() ? (
+                <div key={i}>{line}</div>
+              ) : (
+                // Empty lines create spacing between paragraphs
+                <br key={i} />
+              );
+            })}
           </Linkify>
         </span>
       )}