From 2f6c538055a0b86eac6a28682697724d43c1a83c Mon Sep 17 00:00:00 2001
From: Mirone Saul <Saul-Mirone@outlook.com>
Date: Sat, 6 Aug 2022 11:31:23 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20duplicate=20editor=20in?=
 =?UTF-8?q?=20strict=20mode?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/react/src/useGetEditor.ts                            | 2 ++
 website/component/Demo/Demo.tsx                               | 4 ++--
 .../MilkdownEditor/{MilkdownEditor.tsx => OnlineEditor.tsx}   | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)
 rename website/component/MilkdownEditor/{MilkdownEditor.tsx => OnlineEditor.tsx} (96%)

diff --git a/packages/react/src/useGetEditor.ts b/packages/react/src/useGetEditor.ts
index 72eade81062..ee8d64b7260 100644
--- a/packages/react/src/useGetEditor.ts
+++ b/packages/react/src/useGetEditor.ts
@@ -26,6 +26,8 @@ export const useGetEditor = (getEditor: GetEditor) => {
         const div = dom.current;
         if (!div) return;
 
+        if (div.querySelector('.milkdown') != null) return;
+
         const editor = getEditor(div, renderReact);
         if (!editor) return;
 
diff --git a/website/component/Demo/Demo.tsx b/website/component/Demo/Demo.tsx
index d79ed5b247e..86e946a2d8d 100644
--- a/website/component/Demo/Demo.tsx
+++ b/website/component/Demo/Demo.tsx
@@ -6,7 +6,7 @@ import { i18nConfig, Local } from '../../route';
 import { decode } from '../../utils/share';
 import { Mode } from '../constant';
 import { localCtx } from '../Context';
-import { MilkdownEditor, MilkdownRef } from '../MilkdownEditor/MilkdownEditor';
+import { MilkdownRef, OnlineEditor } from '../MilkdownEditor/OnlineEditor';
 import { CodeMirror, CodeMirrorRef } from './CodeMirror';
 import className from './style.module.css';
 
@@ -70,7 +70,7 @@ export const Demo = ({ mode }: DemoProps) => {
     return !md.length ? null : (
         <div ref={ref} className={classes}>
             <div className={className['milk']}>
-                <MilkdownEditor ref={milkdownRef} content={md} onChange={milkdownListener} />
+                <OnlineEditor ref={milkdownRef} content={md} onChange={milkdownListener} />
             </div>
             <CodeMirror ref={codeMirrorRef} value={md} onChange={onCodeChange} lock={lockCode} />
         </div>
diff --git a/website/component/MilkdownEditor/MilkdownEditor.tsx b/website/component/MilkdownEditor/OnlineEditor.tsx
similarity index 96%
rename from website/component/MilkdownEditor/MilkdownEditor.tsx
rename to website/component/MilkdownEditor/OnlineEditor.tsx
index 96ac57caed3..808847661c0 100644
--- a/website/component/MilkdownEditor/MilkdownEditor.tsx
+++ b/website/component/MilkdownEditor/OnlineEditor.tsx
@@ -22,7 +22,7 @@ type Props = {
 };
 
 export type MilkdownRef = { update: (markdown: string) => void };
-export const MilkdownEditor = forwardRef<MilkdownRef, Props>(({ content, readOnly, onChange }, ref) => {
+export const OnlineEditor = forwardRef<MilkdownRef, Props>(({ content, readOnly, onChange }, ref) => {
     const showToast = useContext(showToastCtx);
     const isDarkMode = useContext(isDarkModeCtx);
     const share = useContext(shareCtx);