refactor: replace underline plugin with highlight plugin in Markdown component

- Removed the rehypeHighlightUnderline plugin and replaced it with rehypeHighlight for improved text formatting.
- Eliminated the UnderlineComponent from the Markdown rendering logic.
- Updated the markdown serializer to remove underline syntax handling for better consistency.

Author: CH1111

packages/ai-workspace-common/src/components/markdown/custom-plugins/rehype-highlight-underline.ts renamed to packages/ai-workspace-common/src/components/markdown/custom-plugins/rehype-highlight.ts

@@ -5,10 +5,9 @@ import type { Node } from 'unist';
 type Plugin = () => (tree: any) => void;
 
 /**
- * Rehype plugin to transform text nodes with ==highlight== and __underline__ syntax
- * to proper HTML elements.
+ * Rehype plugin to transform text nodes with ==highlight== syntax to proper HTML elements.
  */
-const rehypeHighlightUnderline: Plugin = () => {
+const rehypeHighlight: Plugin = () => {
   return (tree: Node) => {
     // Process text nodes for special syntax
     visit(tree, 'text', (node: any, index: number | null, parent: any) => {
@@ -17,23 +16,21 @@ const rehypeHighlightUnderline: Plugin = () => {
       const { value } = node;
       if (typeof value !== 'string') return;
 
-      // Match patterns for highlight and underline
+      // Match patterns for highlight
       const highlightRegex = /==(.*?)==/g;
-      const underlineRegex = /__(.*?)__/g;
 
       // Check if we have any matches
-      if (!highlightRegex.test(value) && !underlineRegex.test(value)) return;
+      if (!highlightRegex.test(value)) return;
 
       // Reset regex lastIndex
       highlightRegex.lastIndex = 0;
-      underlineRegex.lastIndex = 0;
 
       // Process the text to create HTML elements
       const parts = [];
       let lastIndex = 0;
       const text = value;
 
-      // First process highlights
+      // Process highlights
       let match: any = highlightRegex.exec(text);
       while (match !== null) {
         // Add text before the match
@@ -58,40 +55,6 @@ const rehypeHighlightUnderline: Plugin = () => {
         parts.push({ type: 'text', value: text.slice(lastIndex) });
       }
 
-      // If we found any highlights, replace the original node
-      if (parts.length > 0) {
-        parent.children.splice(index, 1, ...parts);
-        return;
-      }
-
-      // Otherwise, check for underlines
-      lastIndex = 0;
-      parts.length = 0;
-
-      match = underlineRegex.exec(text);
-      while (match !== null) {
-        // Add text before the match
-        if (match.index > lastIndex) {
-          parts.push({ type: 'text', value: text.slice(lastIndex, match.index) });
-        }
-
-        // Add the underline element
-        parts.push({
-          type: 'element',
-          tagName: 'u',
-          properties: {},
-          children: [{ type: 'text', value: match[1] }],
-        });
-
-        lastIndex = match.index + match[0].length;
-        match = underlineRegex.exec(text);
-      }
-
-      // Add any remaining text
-      if (lastIndex < text.length) {
-        parts.push({ type: 'text', value: text.slice(lastIndex) });
-      }
-
       // Replace the original node with our processed parts
       if (parts.length > 0) {
         parent.children.splice(index, 1, ...parts);
@@ -100,4 +63,4 @@ const rehypeHighlightUnderline: Plugin = () => {
   };
 };
 
-export default rehypeHighlightUnderline;
+export default rehypeHighlight;

packages/ai-workspace-common/src/components/markdown/index.tsx

@@ -9,7 +9,7 @@ import { cn, markdownCitationParse } from '@refly/utils';
 
 // plugins
 import LinkElement from './plugins/link';
-import rehypeHighlightUnderline from './custom-plugins/rehype-highlight-underline';
+import rehypeHighlight from './custom-plugins/rehype-highlight';
 
 // styles
 import './styles/markdown.scss';
@@ -57,10 +57,6 @@ const HighlightComponent = ({ children }: { children: React.ReactNode }) => (
   </mark>
 );
 
-const UnderlineComponent = ({ children }: { children: React.ReactNode }) => (
-  <span className="underline">{children}</span>
-);
-
 const StrikethroughComponent = ({ children }: { children: React.ReactNode }) => (
   <del>{children}</del>
 );
@@ -147,7 +143,7 @@ export const Markdown = memo(
                   remarkPlugins={[RemarkBreaks, plugins.RemarkMath, RemarkGfm]}
                   rehypePlugins={[
                     ...rehypePlugins,
-                    rehypeHighlightUnderline,
+                    rehypeHighlight,
                     plugins.RehypeKatex,
                     [
                       plugins.RehypeHighlight,
@@ -163,7 +159,6 @@ export const Markdown = memo(
                     img: MarkdownImage,
                     mark: HighlightComponent,
                     del: StrikethroughComponent,
-                    u: UnderlineComponent,
                   }}
                   linkTarget={'_blank'}
                 >

packages/utils/src/editor/to_markdown.ts

@@ -231,8 +231,8 @@ export const defaultMarkdownSerializer = new MarkdownSerializer(
       expelEnclosingWhitespace: true,
     },
     underline: {
-      open: '__',
-      close: '__',
+      open: '',
+      close: '',
       mixable: true,
       expelEnclosingWhitespace: true,
     },