diff --git a/src/renderer/src/components/editor/EditorEditFileSurface.tsx b/src/renderer/src/components/editor/EditorEditFileSurface.tsx
index 7363a4ea687..8fa136494d1 100644
--- a/src/renderer/src/components/editor/EditorEditFileSurface.tsx
+++ b/src/renderer/src/components/editor/EditorEditFileSurface.tsx
@@ -274,7 +274,11 @@ export function EditorEditFileSurface({
       monacoEditor={monacoEditor}
     />
   ) : isMermaid && mdViewMode === 'rich' ? (
-    <MermaidViewer key={activeFile.id} content={currentContent} filePath={activeFile.filePath} />
+    <MermaidViewer
+      key={activeFile.id}
+      content={currentContent}
+      scrollCacheKey={`${editorViewStateKey}:mermaid-diagram`}
+    />
   ) : isCsv && mdViewMode === 'rich' ? (
     <CsvViewer
       key={activeFile.id}
diff --git a/src/renderer/src/components/editor/MermaidViewer.tsx b/src/renderer/src/components/editor/MermaidViewer.tsx
index 1e9ad97c6b8..9d2edfab508 100644
--- a/src/renderer/src/components/editor/MermaidViewer.tsx
+++ b/src/renderer/src/components/editor/MermaidViewer.tsx
@@ -5,20 +5,17 @@ import { useDocumentDarkTheme } from '@/hooks/use-document-dark-theme'
 
 type MermaidViewerProps = {
   content: string
-  filePath: string
+  scrollCacheKey: string
 }
 
 // Render full .mmd/.mermaid files directly as diagram source.
 export default function MermaidViewer({
   content,
-  filePath
+  scrollCacheKey
 }: MermaidViewerProps): React.JSX.Element {
   const rootRef = useRef<HTMLDivElement>(null)
   const isDark = useDocumentDarkTheme()
 
-  // Source and diagram heights differ; keep their scroll positions separate.
-  const scrollCacheKey = `${filePath}:mermaid-diagram`
-
   useLayoutEffect(() => {
     const container = rootRef.current
     if (!container) {