diff --git a/CHANGELOG.md b/CHANGELOG.md index bfb88657b0..a5a271b4d6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -24,6 +24,7 @@ and this project adheres to ## Fixed +- 🐛(frontend) fix initial content with collaboration #484 - 🐛(frontend) Fix hidden menu on Firefox #468 - 🐛(backend) fix sanitize problem IA #490 diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx index 6ab5294e4e..afd7a9fa90 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx @@ -128,6 +128,23 @@ export const BlockNoteEditor = ({ doc, provider }: BlockNoteEditorProps) => { ); useHeadings(editor); + /** + * With the collaboration it gets complicated to create the initial block + * better to let Blocknote manage, then we update the block with the content. + */ + useEffect(() => { + if (doc.content) { + return; + } + + setTimeout(() => { + editor.updateBlock(editor.document[0], { + type: 'heading', + content: '', + }); + }, 100); + }, [editor, doc.content]); + useEffect(() => { setEditor(editor); diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx index 3b01ecc0be..fbc4de4cc1 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/stores/useDocStore.tsx @@ -2,7 +2,7 @@ import { HocuspocusProvider } from '@hocuspocus/provider'; import * as Y from 'yjs'; import { create } from 'zustand'; -import { Base64, Doc, blocksToYDoc } from '@/features/docs/doc-management'; +import { Base64, Doc } from '@/features/docs/doc-management'; export interface UseDocStore { currentDoc?: Doc; @@ -28,15 +28,6 @@ export const useDocStore = create((set, get) => ({ if (initialDoc) { Y.applyUpdate(doc, Buffer.from(initialDoc, 'base64')); - } else { - const initialDocContent = [ - { - type: 'heading', - content: '', - }, - ]; - - blocksToYDoc(initialDocContent, doc); } const provider = new HocuspocusProvider({ diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/utils.ts b/src/frontend/apps/impress/src/features/docs/doc-management/utils.ts index 198c913c5d..2c229128e4 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/utils.ts +++ b/src/frontend/apps/impress/src/features/docs/doc-management/utils.ts @@ -12,23 +12,6 @@ export const currentDocRole = (abilities: Doc['abilities']): Role => { : Role.READER; }; -type BasicBlock = { - type: string; - content: string; -}; -export const blocksToYDoc = (blocks: BasicBlock[], doc: Y.Doc) => { - const xmlFragment = doc.getXmlFragment('document-store'); - - blocks.forEach((block) => { - const xmlElement = new Y.XmlElement(block.type); - if (block.content) { - xmlElement.insert(0, [new Y.XmlText(block.content)]); - } - - xmlFragment.push([xmlElement]); - }); -}; - export const base64ToYDoc = (base64: string) => { const uint8Array = Buffer.from(base64, 'base64'); const ydoc = new Y.Doc();