diff --git a/apps/ligo-virgo/src/index.tsx b/apps/ligo-virgo/src/index.tsx index 9380c370bc..03e5d1e5ab 100644 --- a/apps/ligo-virgo/src/index.tsx +++ b/apps/ligo-virgo/src/index.tsx @@ -16,13 +16,11 @@ if (!container) { } const root = createRoot(container); root.render( - - - - - - - - - + + + + + + + ); diff --git a/libs/components/affine-board/src/Board.tsx b/libs/components/affine-board/src/Board.tsx index acd3a94f9b..262d960828 100644 --- a/libs/components/affine-board/src/Board.tsx +++ b/libs/components/affine-board/src/Board.tsx @@ -113,19 +113,19 @@ export const AffineBoardWitchContext = ({ workspace, rootBlockId, }: AffineBoardProps) => { - const [editor, set_editor] = useState(); + const [editor, setEditor] = useState(); useEffect(() => { - const inner_editor = createEditor(workspace, true); - set_editor(inner_editor); + const innerEditor = createEditor(workspace, rootBlockId, true); + setEditor(innerEditor); return () => { - inner_editor.dispose(); + innerEditor.dispose(); }; - }, [workspace]); + }, [workspace, rootBlockId]); - const [page, set_page] = useState(); + const [page, setPage] = useState(); useEffect(() => { editor?.getBlockById(rootBlockId).then(block => { - set_page(block); + setPage(block); }); }, [editor, rootBlockId]); return page ? ( diff --git a/libs/components/affine-editor/src/Editor.tsx b/libs/components/affine-editor/src/Editor.tsx index c447dc22cd..62f266b46c 100644 --- a/libs/components/affine-editor/src/Editor.tsx +++ b/libs/components/affine-editor/src/Editor.tsx @@ -20,46 +20,55 @@ interface AffineEditorProps { isWhiteboard?: boolean; } -function useConstant(init: () => T): T { - const ref = useRef(null); - ref.current ??= init(); +function _useConstantWithDispose( + workspace: string, + rootBlockId: string, + isWhiteboard: boolean +) { + const ref = useRef<{ data: BlockEditor; onInit: boolean }>(null); + const { setCurrentEditors } = useCurrentEditors(); + ref.current ??= { + data: createEditor(workspace, rootBlockId, isWhiteboard), + onInit: true, + }; - return ref.current; + useEffect(() => { + if (ref.current.onInit) { + ref.current.onInit = false; + } else { + ref.current.data = createEditor( + workspace, + rootBlockId, + isWhiteboard + ); + } + setCurrentEditors(prev => ({ + ...prev, + [rootBlockId]: ref.current.data, + })); + return () => ref.current.data.dispose(); + }, [workspace, rootBlockId, isWhiteboard, setCurrentEditors]); + + return ref.current.data; } export const AffineEditor = forwardRef( ({ workspace, rootBlockId, scrollBlank = true, isWhiteboard }, ref) => { - const { setCurrentEditors } = useCurrentEditors(); - const editor = useConstant(() => { - const editor = createEditor(workspace, isWhiteboard); - - // @ts-ignore - globalThis.virgo = editor; - return editor; - }); + const editor = _useConstantWithDispose( + workspace, + rootBlockId, + isWhiteboard + ); useImperativeHandle(ref, () => editor); - useEffect(() => { - if (rootBlockId) { - editor.setRootBlockId(rootBlockId); - } else { - console.error('rootBlockId for page is required. '); - } - }, [editor, rootBlockId]); - - useEffect(() => { - if (!rootBlockId) return; - setCurrentEditors(prev => ({ ...prev, [rootBlockId]: editor })); - }, [editor, rootBlockId, setCurrentEditors]); - return ( - + ); } diff --git a/libs/components/affine-editor/src/create-editor.ts b/libs/components/affine-editor/src/create-editor.ts index 74e8e458a1..7d575c5500 100644 --- a/libs/components/affine-editor/src/create-editor.ts +++ b/libs/components/affine-editor/src/create-editor.ts @@ -27,9 +27,14 @@ import { import { Protocol } from '@toeverything/datasource/db-service'; import { plugins } from '@toeverything/components/editor-plugins'; -export const createEditor = (workspace: string, isWhiteboard?: boolean) => { +export const createEditor = ( + workspace: string, + rootBlockId: string, + isWhiteboard?: boolean +) => { const blockEditor = new BlockEditor({ workspace, + rootBlockId, views: { [Protocol.Block.Type.page]: new PageBlock(), [Protocol.Block.Type.reference]: new RefLinkBlock(), diff --git a/libs/components/common/src/lib/list/index.tsx b/libs/components/common/src/lib/list/index.tsx index 1820d46652..74e09ad523 100644 --- a/libs/components/common/src/lib/list/index.tsx +++ b/libs/components/common/src/lib/list/index.tsx @@ -1,5 +1,5 @@ import { FC, useState } from 'react'; -import { useNavigate, useParams } from 'react-router'; +import { useNavigate } from 'react-router'; import clsx from 'clsx'; import style9 from 'style9'; @@ -17,7 +17,6 @@ import { BlockPreview } from '../block-preview'; import { BackwardUndoIcon } from '@toeverything/components/icons'; export const commonListContainer = 'commonListContainer'; -import { useFlag } from '@toeverything/datasource/feature-flags'; type Content = { id: string; diff --git a/libs/components/editor-core/src/editor/editor.ts b/libs/components/editor-core/src/editor/editor.ts index a0e28f3574..45db53c678 100644 --- a/libs/components/editor-core/src/editor/editor.ts +++ b/libs/components/editor-core/src/editor/editor.ts @@ -40,7 +40,7 @@ export interface EditorCtorProps { workspace: string; views: Partial>; plugins: PluginCreator[]; - rootBlockId?: string; + rootBlockId: string; isWhiteboard?: boolean; } @@ -65,7 +65,7 @@ export class Editor implements Virgo { private views: Record = {}; workspace: string; readonly = false; - private root_block_id: string; + private _rootBlockId: string; private storage_manager?: StorageManager; private clipboard?: BrowserClipboard; private clipboard_populator?: ClipboardPopulator; @@ -79,7 +79,7 @@ export class Editor implements Virgo { constructor(props: EditorCtorProps) { this.workspace = props.workspace; this.views = props.views; - this.root_block_id = props.rootBlockId || ''; + this._rootBlockId = props.rootBlockId; this.hooks = new Hooks(); this.plugin_manager = new PluginManager(this, this.hooks); this.plugin_manager.registerAll(props.plugins); @@ -108,9 +108,9 @@ export class Editor implements Virgo { } this.bdCommands = new Commands(props.workspace); - services.api.editorBlock.listenConnectivity(this.workspace, state => { - console.log(this.workspace, state); - }); + // services.api.editorBlock.listenConnectivity(this.workspace, state => { + // console.log(this.workspace, state); + // }); services.api.editorBlock.onHistoryChange( this.workspace, @@ -193,11 +193,7 @@ export class Editor implements Virgo { /** Root Block Id */ getRootBlockId() { - return this.root_block_id; - } - - setRootBlockId(rootBlockId: string) { - this.root_block_id = rootBlockId; + return this._rootBlockId; } setHotKeysScope(scope?: string) { diff --git a/libs/components/editor-plugins/src/menu/group-menu/GropuMenu.tsx b/libs/components/editor-plugins/src/menu/group-menu/GropuMenu.tsx index d4220e731d..8a33fd9b50 100644 --- a/libs/components/editor-plugins/src/menu/group-menu/GropuMenu.tsx +++ b/libs/components/editor-plugins/src/menu/group-menu/GropuMenu.tsx @@ -32,7 +32,11 @@ export const GroupMenu = function ({ editor, hooks }: GroupMenuProps) { await editor.dragDropManager.getGroupBlockByPoint( new Point(e.clientX, e.clientY) ); - groupBlockNew && setGroupBlock(groupBlockNew || null); + if (groupBlockNew) { + setGroupBlock(groupBlockNew); + } else { + setGroupBlock(null); + } }, [editor, setGroupBlock] ); diff --git a/libs/components/layout/src/settings-sidebar/Settings/util/handle-export.ts b/libs/components/layout/src/settings-sidebar/Settings/util/handle-export.ts index 37888237bc..ca667e22b4 100644 --- a/libs/components/layout/src/settings-sidebar/Settings/util/handle-export.ts +++ b/libs/components/layout/src/settings-sidebar/Settings/util/handle-export.ts @@ -11,8 +11,7 @@ const createClipboardParse = ({ workspaceId, rootBlockId, }: CreateClipboardParseProps) => { - const editor = createEditor(workspaceId); - editor.setRootBlockId(rootBlockId); + const editor = createEditor(workspaceId, rootBlockId); return new ClipboardParse(editor); };