From 0159998234722af77f0cba1190517cd61f8107bf Mon Sep 17 00:00:00 2001
From: cfngc4594 <cfngc4594@gmail.com>
Date: Fri, 7 Mar 2025 11:43:41 +0800
Subject: [PATCH] refactor(components): replace custom pre component with
 shared Pre component for MDX preview

---
 src/components/mdx-preview.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/mdx-preview.tsx b/src/components/mdx-preview.tsx
index 765f780..9a29c47 100644
--- a/src/components/mdx-preview.tsx
+++ b/src/components/mdx-preview.tsx
@@ -7,12 +7,12 @@ import remarkMath from "remark-math";
 import rehypeKatex from "rehype-katex";
 // import rehypeSlug from "rehype-slug";
 import rehypePretty from "rehype-pretty-code";
+import { Pre } from "@/components/content/pre";
 import { Skeleton } from "@/components/ui/skeleton";
 import { serialize } from "next-mdx-remote/serialize";
 import { useCallback, useEffect, useState } from "react";
 import { CircleAlert, TriangleAlert } from "lucide-react";
 import { useMonacoTheme } from "@/hooks/use-monaco-theme";
-import { CodeBlockWithCopy } from "./mdx/code-block-with-copy";
 // import rehypeAutolinkHeadings from "rehype-autolink-headings";
 import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { MDXRemote, MDXRemoteSerializeResult } from "next-mdx-remote";
@@ -31,7 +31,7 @@ export default function MdxPreview({ source }: MdxPreviewProps) {
     // Define your custom components here
     // For example:
     // Test: ({ name }: { name: string }) => <p>Test Component: {name}</p>,
-    pre: CodeBlockWithCopy,
+    pre: Pre,
   };
 
   const getMdxSource = useCallback(async () => {