♻️Refactor: 清除 mermaid

frontend/src/App.tsx

@@ -2,7 +2,6 @@ import { useState } from "react";
 import { ProgressBar, Label, Tabs } from "@heroui/react";
 import Card from "./components/Card";
 import Guodegang from "./components/Guodegang";
-import Mermaid from "./components/Mermaid";
 import Topic from "./components/Topic";
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
@@ -14,21 +13,15 @@ function App() {
   const [guodegangData, setGuodegangData]: any = useState(null);
   const [guodegangLoading, setGuodegangLoading] = useState(false);
   const [guodegangError, setGuodegangError] = useState<string | null>(null);
-  const [mermaidData, setMermaidData]: any = useState(null);
-  const [mermaidLoading, setMermaidLoading] = useState(false);
-  const [mermaidError, setMermaidError] = useState<string | null>(null);
 
   const fetchData = async (topicToFetch: string) => {
     setCardLoading(true);
     setGuodegangLoading(true);
-    setMermaidLoading(true);
     setCardError(null);
     setGuodegangError(null);
-    setMermaidError(null);
 
     const cardUrl = `http://localhost:8080/card/${encodeURIComponent(topicToFetch)}`;
     const guodegangUrl = `http://localhost:8080/guodegang/${encodeURIComponent(topicToFetch)}`;
-    const mermaidUrl = `http://localhost:8080/mermaid/${encodeURIComponent(topicToFetch)}`;
 
     const abortController = new AbortController();
     const timeoutId = setTimeout(() => abortController.abort(), 300000);
@@ -61,21 +54,7 @@ function App() {
       }
     };
 
-    const fetchMermaid = async () => {
-      try {
-        const response = await fetch(mermaidUrl, { signal: abortController.signal });
-        if (!response.ok) throw new Error(`Mermaid API failed: ${response.status}`);
-        const result = await response.json();
-        setMermaidData(result.message);
-      } catch (error) {
-        console.error("Error fetching mermaid data:", error);
-        setMermaidError("Failed to load mermaid data");
-      } finally {
-        setMermaidLoading(false);
-      }
-    };
-
-    Promise.allSettled([fetchCard(), fetchGuodegang(), fetchMermaid()]).finally(() => {
+    Promise.allSettled([fetchCard(), fetchGuodegang()]).finally(() => {
       clearTimeout(timeoutId);
     });
   };
@@ -89,15 +68,11 @@ function App() {
 
   const cardLoaded = !cardLoading && !!cardData;
   const guodegangLoaded = !guodegangLoading && !!guodegangData;
-  const mermaidLoaded = !mermaidLoading && !!mermaidData;
 
   const progress = (() => {
     if (!topic) return 0;
-    if (cardLoaded && guodegangLoaded && mermaidLoaded) return 100;
-    if (cardLoaded && guodegangLoaded) return 67;
-    if (cardLoaded && mermaidLoaded) return 67;
-    if (guodegangLoaded && mermaidLoaded) return 67;
-    if (cardLoaded || guodegangLoaded || mermaidLoaded) return 33;
+    if (cardLoaded && guodegangLoaded) return 100;
+    if (cardLoaded || guodegangLoaded) return 50;
     return 10;
   })();
 
@@ -115,7 +90,7 @@ function App() {
                 </ProgressBar>
             </div>
         )}
-        <div className="w-full max-w-6xl">
+        <div className="w-full max-w-8xl">
             <Tabs className="w-full">
                 <Tabs.ListContainer>
                     <Tabs.List aria-label="View options">
@@ -129,11 +104,6 @@ function App() {
                             <Tabs.Indicator />
                             🎭 德云社讲解
                         </Tabs.Tab>
-                        <Tabs.Tab id="mermaid">
-                            <Tabs.Separator />
-                            <Tabs.Indicator />
-                            📊 Mermaid 图表
-                        </Tabs.Tab>
                     </Tabs.List>
                 </Tabs.ListContainer>
                 <Tabs.Panel id="card">
@@ -142,9 +112,6 @@ function App() {
                 <Tabs.Panel id="guodegang">
                     <Guodegang topic={topic} data={guodegangData} loading={guodegangLoading} error={guodegangError} />
                 </Tabs.Panel>
-                <Tabs.Panel id="mermaid">
-                    <Mermaid topic={topic} data={mermaidData} loading={mermaidLoading} error={mermaidError} />
-                </Tabs.Panel>
             </Tabs>
         </div>
     </div>