Fix that a line with Chinese chars can't be selected when expand the …

…source editor
easyops-cn · Sep 5, 2024 · 0867827 · 0867827
1 parent 1b51041
commit 0867827
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/components/MonacoEditor/index.tsx b/src/components/MonacoEditor/index.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useLayoutEffect, useRef } from "react";
+import React, { useEffect, useRef } from "react";
 import { useColorMode } from "@docusaurus/theme-common";
 import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
 import {
@@ -68,7 +68,7 @@ export default function MonacoEditor({
     }
   }, [code, type]);
 
-  useLayoutEffect(() => {
+  useEffect(() => {
     if (automaticLayoutRef.current) {
       return;
     }

diff --git a/src/components/NextExample/index.tsx b/src/components/NextExample/index.tsx
@@ -192,6 +192,13 @@ export default function NextExample({
     setSourceShown((prev) => !prev);
   }, []);
 
+  const sourceShownOnceRef = useRef(false);
+  useEffect(() => {
+    if (!sourceShownOnceRef.current && sourceShown) {
+      sourceShownOnceRef.current = true;
+    }
+  }, [sourceShown]);
+
   const [playgroundUrl, setPlaygroundUrl] = useState("/playground");
 
   useEffect(() => {
@@ -260,7 +267,8 @@ export default function NextExample({
           [styles.sourceShown]: sourceShown,
         })}
       >
-        {wait || !ready ? (
+        {!(sourceShown || sourceShownOnceRef.current) ? null : wait ||
+          !ready ? (
           <LoadingRingBox height={editorInitialHeight} />
         ) : (
           <BrowserOnly