Create GlobalCodeMirrorEditorKey for readOnly

apps/app/src/components/PageEditor/PageEditorReadOnly.tsx

@@ -18,7 +18,7 @@ export const PageEditorReadOnly = react.memo((): JSX.Element => {
   const previewRef = useRef<HTMLDivElement>(null);
   const [previewRect] = useRect(previewRef);
 
-  const { scrollEditorHandler, scrollPreviewHandler } = useScrollSync(GlobalCodeMirrorEditorKey.MAIN, previewRef);
+  const { scrollEditorHandler, scrollPreviewHandler } = useScrollSync(GlobalCodeMirrorEditorKey.READONLY, previewRef);
   const scrollEditorHandlerThrottle = useMemo(() => throttle(25, scrollEditorHandler), [scrollEditorHandler]);
   const scrollPreviewHandlerThrottle = useMemo(() => throttle(25, scrollPreviewHandler), [scrollPreviewHandler]);
 

packages/editor/src/components/CodeMirrorEditorReadOnly.tsx

@@ -24,7 +24,7 @@ type Props = CodeMirrorEditorProps & {
 export const CodeMirrorEditorReadOnly = (props: Props): JSX.Element => {
   const { body, ...otherProps } = props;
 
-  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.MAIN);
+  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.READONLY);
 
   codeMirrorEditor?.initDoc(body);
 
@@ -34,7 +34,7 @@ export const CodeMirrorEditorReadOnly = (props: Props): JSX.Element => {
 
   return (
     <CodeMirrorEditor
-      editorKey={GlobalCodeMirrorEditorKey.MAIN}
+      editorKey={GlobalCodeMirrorEditorKey.READONLY}
       {...otherProps}
     />
   );

packages/editor/src/consts/global-code-mirror-editor-key.ts

@@ -2,5 +2,6 @@ export const GlobalCodeMirrorEditorKey = {
   MAIN: 'main',
   COMMENT: 'comment',
   DIFF: 'diff',
+  READONLY: 'readonly',
 } as const;
 export type GlobalCodeMirrorEditorKey = typeof GlobalCodeMirrorEditorKey[keyof typeof GlobalCodeMirrorEditorKey]