From caf10f441f40203cfaa30ae544408e0c9b0b5419 Mon Sep 17 00:00:00 2001
From: SebinSong <songxevin@gmail.com>
Date: Fri, 9 Aug 2024 11:29:54 +1200
Subject: [PATCH 1/2] additional bug-fix

---
 frontend/views/utils/markdown-utils.js | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/frontend/views/utils/markdown-utils.js b/frontend/views/utils/markdown-utils.js
index 61f3f8341..d6110cc48 100644
--- a/frontend/views/utils/markdown-utils.js
+++ b/frontend/views/utils/markdown-utils.js
@@ -33,11 +33,22 @@ export function renderMarkdown (str: string): any {
   // There is some caveats discovered with 'dompurify' and DOMParser() API regarding how they interpret '<' and '>' characters.
   // So manually converting them to '&lt;' and '&gt;' here first.
   // ( context: https://github.com/okTurtles/group-income/issues/2130 )
-  str = str.replace(/</g, '&lt;').replace(/>/g, '&gt;')
+  const strSplitByCodeMarkdown = splitStringByMarkdownCode(str)
+  strSplitByCodeMarkdown.forEach((entry, index) => {
+    if (entry.type === 'plain' && strSplitByCodeMarkdown[index - 1]?.text !== '```') {
+      let entryText = entry.text
+      entryText = entryText.replace(/</g, '&lt;').replace(/>/g, '&gt;')
 
-  str = str.replace(/\n(?=\n)/g, '\n<br>')
-    .replace(/<br>\n(\s*)(\d+\.|-|```)/g, '\n\n$1$2') // custom-handling the case where <br> is directly followed by the start of block-code (```)
-    .replace(/(\d+\.|-)(\s.+)\n<br>/g, '$1$2\n\n') // this is a custom-logic added so that the end of ordered/un-ordered lists are correctly detected by markedjs.
+      entryText = entryText.replace(/\n(?=\n)/g, '\n<br>')
+        .replace(/<br>\n(\s*)(\d+\.|-|```)/g, '\n\n$1$2') // custom-handling the case where <br> is directly followed by the start of block-code (```)
+        .replace(/(\d+\.|-)(\s.+)\n<br>/g, '$1$2\n\n') // this is a custom-logic added so that the end of ordered/un-ordered lists are correctly detected by markedjs.
+
+      entry.text = entryText
+    }
+  })
+
+  console.log('!@# strSplitByCodeMarkdown: ', strSplitByCodeMarkdown)
+  str = combineMarkdownSegmentListIntoString(strSplitByCodeMarkdown)
 
   // STEP 2. convert the markdown into html DOM string.
   let converted = marked.parse(str, { gfm: true })
@@ -145,7 +156,7 @@ export function splitStringByMarkdownCode (
   // This function takes a markdown string and split it by texts written as either inline/block code.
   // (e.g. `asdf`, ```const var = 123```)
 
-  const regExCodeMultiple = /(^```\n[\s\S]*?```$)/gm // Detecting multi-line code-block by reg-exp - reference: https://regexr.com/4h9sh
+  const regExCodeMultiple = /(^[\s]*```\n[\s\S]*?```$)/gm // Detecting multi-line code-block by reg-exp - reference: https://regexr.com/4h9sh
   const regExCodeInline = /(`.+`)/g
   const splitByMulitpleCode = str.split(regExCodeMultiple)
   const finalArr = []

From 2e0d00bf60ecdc13dcbeb75f2d882fac08699d06 Mon Sep 17 00:00:00 2001
From: SebinSong <songxevin@gmail.com>
Date: Fri, 9 Aug 2024 11:44:06 +1200
Subject: [PATCH 2/2] some more bug-fixes

---
 frontend/assets/style/components/_custom-markdowns.scss | 6 +++---
 frontend/views/utils/markdown-utils.js                  | 3 +--
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/frontend/assets/style/components/_custom-markdowns.scss b/frontend/assets/style/components/_custom-markdowns.scss
index 7047fe088..cd0f84f08 100644
--- a/frontend/assets/style/components/_custom-markdowns.scss
+++ b/frontend/assets/style/components/_custom-markdowns.scss
@@ -63,7 +63,7 @@
     margin: 0.75rem 0;
   }
 
-  ul li {
+  ul > li {
     position: relative;
     display: block;
     padding: 0 0 0.2rem 1.125rem;
@@ -85,7 +85,7 @@
     }
   }
 
-  ol li {
+  ol > li {
     position: relative;
     padding-bottom: 0.2rem;
     margin-left: 1.125rem;
@@ -102,7 +102,7 @@
       margin-bottom: 0;
     }
 
-    > ul li::before {
+    > ul > li::before {
       background-color: rgba(0, 0, 0, 0);
       border: 1px solid $text_0;
       top: 0.6rem;
diff --git a/frontend/views/utils/markdown-utils.js b/frontend/views/utils/markdown-utils.js
index d6110cc48..badb62ad6 100644
--- a/frontend/views/utils/markdown-utils.js
+++ b/frontend/views/utils/markdown-utils.js
@@ -40,14 +40,13 @@ export function renderMarkdown (str: string): any {
       entryText = entryText.replace(/</g, '&lt;').replace(/>/g, '&gt;')
 
       entryText = entryText.replace(/\n(?=\n)/g, '\n<br>')
-        .replace(/<br>\n(\s*)(\d+\.|-|```)/g, '\n\n$1$2') // custom-handling the case where <br> is directly followed by the start of block-code (```)
+        .replace(/<br>\n(\s*)(\d+\.|-)/g, '\n\n$1$2') // custom-handling the case where <br> is directly followed by the start of ordered/unordered lists
         .replace(/(\d+\.|-)(\s.+)\n<br>/g, '$1$2\n\n') // this is a custom-logic added so that the end of ordered/un-ordered lists are correctly detected by markedjs.
 
       entry.text = entryText
     }
   })
 
-  console.log('!@# strSplitByCodeMarkdown: ', strSplitByCodeMarkdown)
   str = combineMarkdownSegmentListIntoString(strSplitByCodeMarkdown)
 
   // STEP 2. convert the markdown into html DOM string.