not use CodeMirrorEditor

packages/editor/src/components/CodeMirrorEditor/CodeMirrorEditor.tsx

@@ -33,7 +33,6 @@ export type CodeMirrorEditorProps = {
   acceptedUploadFileType?: AcceptedUploadFileType,
   indentSize?: number,
   editorSettings?: EditorSettings,
-  hideToolbar?: boolean,
   onChange?: (value: string) => void,
   onSave?: () => void,
   onUpload?: (files: File[]) => void,
@@ -50,7 +49,6 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
     acceptedUploadFileType = AcceptedUploadFileType.NONE,
     indentSize,
     editorSettings,
-    hideToolbar,
     onChange,
     onSave,
     onUpload,
@@ -211,16 +209,11 @@ export const CodeMirrorEditor = (props: Props): JSX.Element => {
         <FileDropzoneOverlay isEnabled={isDragActive} />
         <CodeMirrorEditorContainer ref={containerRef} />
       </div>
-
-      {
-        !hideToolbar && (
-          <Toolbar
-            editorKey={editorKey}
-            acceptedUploadFileType={acceptedUploadFileType}
-            onUpload={onUpload}
-          />
-        )
-      }
+      <Toolbar
+        editorKey={editorKey}
+        acceptedUploadFileType={acceptedUploadFileType}
+        onUpload={onUpload}
+      />
     </div>
   );
 };

packages/editor/src/components/CodeMirrorEditorDiff.tsx

@@ -1,12 +1,11 @@
-import { useEffect } from 'react';
+import { useEffect, useRef, useMemo } from 'react';
 
 import type { Extension } from '@codemirror/state';
 import { placeholder, scrollPastEnd } from '@codemirror/view';
+import type { ReactCodeMirrorProps } from '@uiw/react-codemirror';
 
 import { GlobalCodeMirrorEditorKey } from '../consts';
-import { useCodeMirrorEditorIsolated } from '../stores';
-
-import { CodeMirrorEditor } from '.';
+import { useCodeMirrorEditorIsolated, useDefaultExtensions, useEditorSettings } from '../stores';
 
 const additionalExtensions: Extension[] = [
   [
@@ -17,7 +16,16 @@ const additionalExtensions: Extension[] = [
 ];
 
 export const CodeMirrorEditorDiff = (): JSX.Element => {
-  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.DIFF);
+  const codeMirrorRef = useRef(null);
+
+  const cmProps = useMemo<ReactCodeMirrorProps>(() => {
+    return {};
+  }, []);
+
+  const { data: codeMirrorEditor } = useCodeMirrorEditorIsolated(GlobalCodeMirrorEditorKey.DIFF, codeMirrorRef.current, cmProps);
+
+  useDefaultExtensions(codeMirrorEditor);
+  useEditorSettings(codeMirrorEditor);
 
   // setup additional extensions
   useEffect(() => {
@@ -25,9 +33,6 @@ export const CodeMirrorEditorDiff = (): JSX.Element => {
   }, [codeMirrorEditor]);
 
   return (
-    <CodeMirrorEditor
-      editorKey={GlobalCodeMirrorEditorKey.DIFF}
-      hideToolbar
-    />
+    <div ref={codeMirrorRef} />
   );
 };