Sync main to dev after 0.5.11 is released.

web/screens/Thread/ThreadCenterPanel/TextMessage/MarkdownTextMessage.tsx

@@ -5,24 +5,24 @@
 
 import Markdown from 'react-markdown'
 
-import latex from 'highlight.js/lib/languages/latex'
 import rehypeHighlight from 'rehype-highlight'
 import rehypeHighlightCodeLines from 'rehype-highlight-code-lines'
 import rehypeKatex from 'rehype-katex'
 import rehypeRaw from 'rehype-raw'
 import remarkMath from 'remark-math'
-import 'katex/dist/katex.min.css'
 
+import 'katex/dist/katex.min.css'
+import 'highlight.js/styles/atom-one-dark.css'
 import { useClipboard } from '@/hooks/useClipboard'
 
 import { getLanguageFromExtension } from '@/utils/codeLanguageExtension'
 
 export const MarkdownTextMessage = memo(
   ({ text }: { id: string; text: string }) => {
     const clipboard = useClipboard({ timeout: 1000 })
 
     function extractCodeLines(node: { children: { children: any[] }[] }) {
       const codeLines: any[] = []
 
       // Helper function to extract text recursively from children
       function getTextFromNode(node: {
@@ -30,44 +30,44 @@
         value: any
         children: any[]
       }): string {
         if (node.type === 'text') {
           return node.value
         } else if (node.children) {
           return node.children.map(getTextFromNode).join('')
         }
         return ''
       }
 
       // Traverse each line in the <code> block
       node.children[0].children.forEach(
         (lineNode: {
           type: string
           tagName: string
           value: any
           children: any[]
         }) => {
           if (lineNode.type === 'element' && lineNode.tagName === 'span') {
             const lineContent = getTextFromNode(lineNode)
             codeLines.push(lineContent)
           }
         }
       )
 
       // Join the lines with newline characters for proper formatting
       return codeLines.join('\n')
     }
     function wrapCodeBlocksWithoutVisit() {
       return (tree: { children: any[] }) => {
         tree.children = tree.children.map((node) => {
           if (node.tagName === 'pre' && node.children[0]?.tagName === 'code') {
             const language =
               node.children[0].properties.className?.[1]?.replace(
                 'language-',
                 ''
               )
 
             if (extractCodeLines(node) === '') {
               return node
             }
 
             return {
@@ -199,16 +199,7 @@
           rehypePlugins={[
             [rehypeKatex, { throwOnError: false }],
             rehypeRaw,
-            [
-              // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-              // @ts-ignore
-              rehypeHighlight,
-              {
-                languages: { latex },
-                subset: false,
-                plainText: ['txt', 'text'],
-              },
-            ],
+            rehypeHighlight,
             [rehypeHighlightCodeLines, { showLineNumbers: true }],
             wrapCodeBlocksWithoutVisit,
           ]}