fix: editor readonly content set properly

makeplane · Sep 13, 2024 · 78b1c50 · 78b1c50
1 parent fa5cfd5
commit 78b1c50
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 13 deletions.
diff --git a/packages/editor/src/core/extensions/image/image-component-without-props.tsx b/packages/editor/src/core/extensions/image/image-component-without-props.tsx
@@ -5,9 +5,10 @@ import { UploadImageExtensionStorage } from "@/extensions/custom-image";
 export const CustomImageComponentWithoutProps = () =>
   Image.extend<{}, UploadImageExtensionStorage>({
     name: "imageComponent",
-    group: "inline",
-    draggable: true,
     selectable: true,
+    group: "block",
+    atom: true,
+    draggable: true,
 
     addAttributes() {
       return {
@@ -21,12 +22,6 @@ export const CustomImageComponentWithoutProps = () =>
         height: {
           default: "auto",
         },
-        ["data-type"]: {
-          default: this.name,
-        },
-        ["data-file"]: {
-          default: null,
-        },
         ["id"]: {
           default: null,
         },
@@ -38,6 +33,9 @@ export const CustomImageComponentWithoutProps = () =>
         {
           tag: "image-component",
         },
+        {
+          tag: "img",
+        },
       ];
     },
 
@@ -50,8 +48,6 @@ export const CustomImageComponentWithoutProps = () =>
         fileMap: new Map(),
       };
     },
-  }).configure({
-    inline: true,
   });
 
 export default CustomImageComponentWithoutProps;
diff --git a/packages/editor/src/core/hooks/use-editor.ts b/packages/editor/src/core/hooks/use-editor.ts
@@ -129,7 +129,7 @@ export const useEditor = (props: CustomEditorProps) => {
         editorRef.current?.commands.clearContent(emitUpdate);
       },
       setEditorValue: (content: string) => {
-        editorRef.current?.commands.setContent(content);
+        editorRef.current?.commands.setContent(content, false, { preserveWhitespace: "full" });
       },
       setEditorValueAtCursorPosition: (content: string) => {
         if (savedSelection) {

diff --git a/packages/editor/src/core/hooks/use-read-only-editor.ts b/packages/editor/src/core/hooks/use-read-only-editor.ts
@@ -58,7 +58,7 @@ export const useReadOnlyEditor = ({
   // for syncing swr data on tab refocus etc
   useEffect(() => {
     if (initialValue === null || initialValue === undefined) return;
-    if (editor && !editor.isDestroyed) editor?.commands.setContent(initialValue);
+    if (editor && !editor.isDestroyed) editor?.commands.setContent(initialValue, false, { preserveWhitespace: "full" });
   }, [editor, initialValue]);
 
   const editorRef: MutableRefObject<Editor | null> = useRef(null);
@@ -68,7 +68,7 @@ export const useReadOnlyEditor = ({
       editorRef.current?.commands.clearContent();
     },
     setEditorValue: (content: string) => {
-      editorRef.current?.commands.setContent(content);
+      editorRef.current?.commands.setContent(content, false, { preserveWhitespace: "full" });
     },
     getMarkDown: (): string => {
       const markdownOutput = editorRef.current?.storage.markdown.getMarkdown();