Move MFM content rendering to RichContent

This commit is contained in:
Sol Fisher Romanoff 2022-07-10 10:39:02 +03:00
parent 83a3b37f1f
commit 5e18f1ceeb
No known key found for this signature in database
GPG key ID: 9D3F2B64F2341B62
6 changed files with 25 additions and 44 deletions

View file

@ -2,6 +2,8 @@ import { unescape, flattenDeep } from 'lodash'
import { getTagName, processTextForEmoji, getAttrs } from 'src/services/html_converter/utility.service.js'
import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
import { convertHtmlToLines } from 'src/services/html_converter/html_line_converter.service.js'
import { marked } from 'marked'
import markedMfm from 'marked-mfm'
import StillImage from 'src/components/still-image/still-image.vue'
import MentionsLine, { MENTIONS_LIMIT } from 'src/components/mentions_line/mentions_line.vue'
import HashtagLink from 'src/components/hashtag_link/hashtag_link.vue'
@ -58,6 +60,12 @@ export default {
required: false,
type: Boolean,
default: false
},
// Render Misskey Markdown
mfm: {
required: false,
type: Boolean,
default: false
}
},
// NEVER EVER TOUCH DATA INSIDE RENDER
@ -112,6 +120,15 @@ export default {
}
}
const renderMisskeyMarkdown = (content) => {
marked.use(markedMfm, {
mangle: false,
gfm: false,
breaks: true
})
return marked.parse(content)
}
// Processor to use with html_tree_converter
const processItem = (item, index, array, what) => {
// Handle text nodes - just add emoji
@ -249,7 +266,7 @@ export default {
return item
}
const pass1 = convertHtmlToTree(html).map(processItem)
const pass1 = convertHtmlToTree(this.mfm ? renderMisskeyMarkdown(html) : html).map(processItem)
const pass2 = [...pass1].reverse().map(processItemReverse).reverse()
// DO NOT USE SLOTS they cause a re-render feedback loop here.
// slots updated -> rerender -> emit -> update up the tree -> rerender -> ...