♻️(frontend) save editor as json

Stop to save a y.js doc to save the json editor.

src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx

@@ -1,4 +1,4 @@
-import { BlockNoteEditor as BlockNoteEditorCore } from '@blocknote/core';
+import { Block, BlockNoteEditor as BlockNoteEditorCore } from '@blocknote/core';
 import '@blocknote/core/fonts/inter.css';
 import { BlockNoteView } from '@blocknote/mantine';
 import '@blocknote/mantine/style.css';
@@ -71,7 +71,7 @@ export const BlockNoteContent = ({
   const { userData } = useAuthStore();
   const { setStore, docsStore } = useDocStore();
   const canSave = doc.abilities.partial_update && !isVersion;
-  useSaveDoc(doc.id, provider.document, canSave);
+
   const storedEditor = docsStore?.[storeId]?.editor;
   const {
     mutateAsync: createDocAttachment,
@@ -99,18 +99,24 @@ export const BlockNoteContent = ({
       return storedEditor;
     }
 
+    // TODO decrypt doc.content
+    //localStorage.getItem('KEY');
+
     return BlockNoteEditorCore.create({
-      collaboration: {
-        provider,
-        fragment: provider.document.getXmlFragment('document-store'),
-        user: {
-          name: userData?.email || 'Anonymous',
-          color: randomColor(),
-        },
-      },
+      // collaboration: {
+      //   provider,
+      //   fragment: provider.document.getXmlFragment('document-store'),
+      //   user: {
+      //     name: userData?.email || 'Anonymous',
+      //     color: randomColor(),
+      //   },
+      // },
       uploadFile,
+      initialContent: JSON.parse(doc.content),
     });
-  }, [provider, storedEditor, uploadFile, userData?.email]);
+  }, [doc.content, storedEditor, uploadFile]);
+
+  useSaveDoc(doc.id, provider.document, canSave, editor);
 
   useEffect(() => {
     setStore(storeId, { editor });

src/frontend/apps/impress/src/features/docs/doc-editor/hook/useSaveDoc.tsx

@@ -1,3 +1,4 @@
+import { BlockNoteEditor } from '@blocknote/core';
 import { useRouter } from 'next/router';
 import { useCallback, useEffect, useRef, useState } from 'react';
 import * as Y from 'yjs';
@@ -7,7 +8,12 @@ import { KEY_LIST_DOC_VERSIONS } from '@/features/docs/doc-versioning';
 
 import { toBase64 } from '../utils';
 
-const useSaveDoc = (docId: string, doc: Y.Doc, canSave: boolean) => {
+const useSaveDoc = (
+  docId: string,
+  doc: Y.Doc,
+  canSave: boolean,
+  editor: BlockNoteEditor,
+) => {
   const { mutate: updateDoc } = useUpdateDoc({
     listInvalideQueries: [KEY_LIST_DOC_VERSIONS],
   });
@@ -56,14 +62,18 @@ const useSaveDoc = (docId: string, doc: Y.Doc, canSave: boolean) => {
   }, [canSave, hasChanged]);
 
   const saveDoc = useCallback(() => {
-    const newDoc = toBase64(Y.encodeStateAsUpdate(doc));
+    const newDoc = JSON.stringify(editor.document);
+    //const newDoc = toBase64(Y.encodeStateAsUpdate(doc));
+
+    // TODO encode the content
+
     setInitialDoc(newDoc);
 
     updateDoc({
       id: docId,
       content: newDoc,
     });
-  }, [doc, docId, updateDoc]);
+  }, [docId, editor?.document, updateDoc]);
 
   const timeout = useRef<NodeJS.Timeout>();
   const router = useRouter();

src/frontend/apps/impress/src/features/docs/doc-editor/stores/useDocStore.tsx

@@ -26,9 +26,9 @@ export const useDocStore = create<UseDocStore>((set, get) => ({
       guid: storeId,
     });
 
-    if (initialDoc) {
-      Y.applyUpdate(doc, Buffer.from(initialDoc, 'base64'));
-    }
+    // if (initialDoc) {
+    //   Y.applyUpdate(doc, Buffer.from(initialDoc, 'base64'));
+    // }
 
     const provider = new HocuspocusProvider({
       url: providerUrl(storeId),