From d7788c2fd62794d4889be9bfb8727dead6e4105f Mon Sep 17 00:00:00 2001
From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com>
Date: Tue, 18 Feb 2025 14:48:37 -0800
Subject: [PATCH] Fix mermaid diagram

---
 .../src/components/common/MermaidBlock.tsx    | 20 +++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/webview-ui/src/components/common/MermaidBlock.tsx b/webview-ui/src/components/common/MermaidBlock.tsx
index 7c0a55ec72..eeae2b272c 100644
--- a/webview-ui/src/components/common/MermaidBlock.tsx
+++ b/webview-ui/src/components/common/MermaidBlock.tsx
@@ -16,14 +16,14 @@ mermaid.initialize({
 	startOnLoad: false,
 	securityLevel: "loose",
 	theme: "dark",
-	themeVariables: {
-		background: MERMAID_THEME.background,
-		textColor: MERMAID_THEME.textColor,
-		mainBkg: MERMAID_THEME.mainBkg,
-		lineColor: MERMAID_THEME.lineColor,
-		fontSize: "16px",
-		primaryColor: MERMAID_THEME.primaryColor,
-	},
+	// themeVariables: {
+	// 	background: MERMAID_THEME.background,
+	// 	textColor: MERMAID_THEME.textColor,
+	// 	mainBkg: MERMAID_THEME.mainBkg,
+	// 	lineColor: MERMAID_THEME.lineColor,
+	// 	fontSize: "16px",
+	// 	primaryColor: MERMAID_THEME.primaryColor,
+	// },
 })
 
 interface MermaidBlockProps {
@@ -93,10 +93,10 @@ export default function MermaidBlock({ code }: MermaidBlockProps) {
 
 	return (
 		<MermaidBlockContainer>
-			{isLoading && <LoadingMessage>Creating mermaid chart...</LoadingMessage>}
+			{isLoading && <LoadingMessage>Generating mermaid diagram...</LoadingMessage>}
 
 			{/* The container for the final <svg> or raw code. */}
-			<SvgContainer ref={containerRef} $isLoading={isLoading} />
+			<SvgContainer onClick={handleClick} ref={containerRef} $isLoading={isLoading} />
 		</MermaidBlockContainer>
 	)
 }