fix(popular threads box): don't display markdown syntax, remove white space

src/views/home/popular-threads-box/popular-threads-box.tsx

@@ -10,6 +10,7 @@ import { CatalogPostMedia } from '../../../components/catalog-row';
 import LoadingEllipsis from '../../../components/loading-ellipsis';
 import BoxModal from '../box-modal';
 import { nsfwTags } from '../home';
+import removeMarkdown from 'remove-markdown';
 
 interface PopularThreadProps {
   post: Comment;
@@ -17,11 +18,19 @@ interface PopularThreadProps {
   boardShortAddress: string;
 }
 
-const PopularThreadCard = ({ post, boardTitle, boardShortAddress }: PopularThreadProps) => {
+const ContentPreview = ({ content, maxLength = 99 }: { content: string; maxLength?: number }) => {
-  const { cid, subplebbitAddress, title } = post || {};
+  const plainText = removeMarkdown(content).trim().replaceAll(' ', '').replace(/\n\n/g, '\n').replaceAll('\n\n', '');
-  const commentMediaInfo = getCommentMediaInfo(post);
 
-  let content = post?.content?.replace(/\n\n/g, '\n');
+  const truncatedText = plainText.length > maxLength ? `${plainText.substring(0, maxLength).trim()}...` : plainText;
+
+  console.log(content);
+
+  return truncatedText;
+};
+
+const PopularThreadCard = ({ post, boardTitle, boardShortAddress }: PopularThreadProps) => {
+  const { cid, content, subplebbitAddress, title } = post || {};
+  const commentMediaInfo = getCommentMediaInfo(post);
 
   return (
     <div className={styles.popularThread} key={cid}>
@@ -38,7 +47,7 @@ const PopularThreadCard = ({ post, boardTitle, boardShortAddress }: PopularThrea
             {content && ': '}
           </>
         )}
-        {content && (content.length > 99 ? `${content.substring(0, 99).trim()}...` : `${content}`)}
+        {content && <ContentPreview content={content} maxLength={99} />}
       </div>
     </div>
   );