Use Marked and marked-mfm for MFM rendering (#29)

Reviewed-on: https://akkoma.dev/AkkomaGang/pleroma-fe/pulls/29
Co-authored-by: sfr <sol@solfisher.com>
Co-committed-by: sfr <sol@solfisher.com>

src/components/status_body/status_body.js

@@ -1,6 +1,5 @@
 import fileType from 'src/services/file_type/file_type.service'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
-import MFMContent from 'src/components/mfm_content/mfm_content.jsx'
 import { mapGetters } from 'vuex'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -84,8 +83,7 @@ const StatusContent = {
     ...mapGetters(['mergedConfig'])
   },
   components: {
-    RichContent,
-    MFMContent
+    RichContent
   },
   mounted () {
     this.status.attentions && this.status.attentions.forEach(attn => {

src/components/status_body/status_body.scss

@@ -17,7 +17,6 @@
   & .text,
   & .summary {
     font-family: var(--postFont, sans-serif);
-    white-space: pre-wrap;
     overflow-wrap: break-word;
     word-wrap: break-word;
     word-break: break-word;
@@ -31,6 +30,9 @@
   }
 
   .text {
+    & > * {
+      white-space: pre-wrap;
+    }
     &.-single-line {
       white-space: nowrap;
       text-overflow: ellipsis;

src/components/status_body/status_body.vue

@@ -44,18 +44,13 @@
         <div
           v-if="!hideSubjectStatus && !(singleLine && status.summary_raw_html)"
         >
-          <MFMContent
-            v-if="renderMisskeyMarkdown && status.mfm_content"
-            class="RichContent text media-body mfm-post-content"
-            :status="status"
-          />
           <RichContent
-            v-else
             :class="{ '-single-line': singleLine }"
             class="text media-body"
             :html="status.raw_html"
             :emoji="status.emojis"
             :handle-links="true"
+            :mfm="renderMisskeyMarkdown && (status.media_type === 'text/x.misskeymarkdown')"
             :greentext="mergedConfig.greentext"
             :attentions="status.attentions"
             @parseReady="onParseReady"