feat: support codeblock

components/common/CommonRichContent.ts

@@ -18,7 +18,7 @@ export default defineComponent({
     return () => h(
       'div',
       { class: 'rich-content' },
-      contentToVNode(props.content, undefined, emojiObject),
+      contentToVNode(props.content, emojiObject),
     )
   },
 })

components/content/ContentCode.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+const props = defineProps<{
+  code: string
+  lang: string
+}>()
+
+const raw = computed(() => decodeURIComponent(props.code).replace(/&#39;/g, '\''))
+
+const langMap: Record<string, string> = {
+  js: 'javascript',
+  ts: 'typescript',
+  vue: 'html',
+}
+
+const hightlighted = computed(() => {
+  return highlightCode(raw.value, langMap[props.lang] || props.lang as any)
+})
+</script>
+
+<template>
+  <pre class="code-block" v-html="hightlighted" />
+</template>