feat: add useBlocksuiteEditor hooks (#5366)

This commit is contained in:
JimmFly
2023-12-28 08:36:35 +00:00
parent 431f7cfac9
commit e11e8277ca
6 changed files with 32 additions and 29 deletions

View File

@@ -1,8 +1,7 @@
import { editorContainerAtom } from '@affine/component/block-suite-editor';
import { assertExists } from '@blocksuite/global/utils';
import { AiIcon } from '@blocksuite/icons';
import { CopilotPanel } from '@blocksuite/presets';
import { useAtom } from 'jotai';
import { useBlocksuiteEditor } from '@toeverything/hooks/use-block-suite-editor';
import { useCallback, useRef } from 'react';
import type { EditorExtension } from '../types';
@@ -11,7 +10,7 @@ import * as styles from './outline.css';
// A wrapper for CopilotPanel
const EditorCopilotPanel = () => {
const copilotPanelRef = useRef<CopilotPanel | null>(null);
const [editorContainer] = useAtom(editorContainerAtom);
const [editor] = useBlocksuiteEditor();
const onRefChange = useCallback((container: HTMLDivElement | null) => {
if (container) {
@@ -23,7 +22,7 @@ const EditorCopilotPanel = () => {
}
}, []);
if (!editorContainer) {
if (!editor) {
return;
}
@@ -31,8 +30,8 @@ const EditorCopilotPanel = () => {
copilotPanelRef.current = new CopilotPanel();
}
if (editorContainer !== copilotPanelRef.current?.editor) {
(copilotPanelRef.current as CopilotPanel).editor = editorContainer;
if (editor !== copilotPanelRef.current?.editor) {
(copilotPanelRef.current as CopilotPanel).editor = editor;
// (copilotPanelRef.current as CopilotPanel).fitPadding = [20, 20, 20, 20];
}

View File

@@ -1,8 +1,7 @@
import { editorContainerAtom } from '@affine/component/block-suite-editor';
import { assertExists } from '@blocksuite/global/utils';
import { FrameIcon } from '@blocksuite/icons';
import { FramePanel } from '@blocksuite/presets';
import { useAtom } from 'jotai';
import { useBlocksuiteEditor } from '@toeverything/hooks/use-block-suite-editor';
import { useCallback, useRef } from 'react';
import type { EditorExtension } from '../types';
@@ -11,7 +10,8 @@ import * as styles from './frame.css';
// A wrapper for FramePanel
const EditorFramePanel = () => {
const framePanelRef = useRef<FramePanel | null>(null);
const [editorContainer] = useAtom(editorContainerAtom);
const [editor] = useBlocksuiteEditor();
const onRefChange = useCallback((container: HTMLDivElement | null) => {
if (container) {
@@ -20,7 +20,7 @@ const EditorFramePanel = () => {
}
}, []);
if (!editorContainer) {
if (!editor) {
return;
}
@@ -28,8 +28,8 @@ const EditorFramePanel = () => {
framePanelRef.current = new FramePanel();
}
if (editorContainer !== framePanelRef.current?.editor) {
(framePanelRef.current as FramePanel).editor = editorContainer;
if (editor !== framePanelRef.current?.editor) {
(framePanelRef.current as FramePanel).editor = editor;
(framePanelRef.current as FramePanel).fitPadding = [20, 20, 20, 20];
}

View File

@@ -1,8 +1,7 @@
import { editorContainerAtom } from '@affine/component/block-suite-editor';
import { assertExists } from '@blocksuite/global/utils';
import { TocIcon } from '@blocksuite/icons';
import { TOCPanel } from '@blocksuite/presets';
import { useAtom } from 'jotai';
import { useBlocksuiteEditor } from '@toeverything/hooks/use-block-suite-editor';
import { useCallback, useRef } from 'react';
import type { EditorExtension } from '../types';
@@ -11,7 +10,7 @@ import * as styles from './outline.css';
// A wrapper for TOCNotesPanel
const EditorOutline = () => {
const tocPanelRef = useRef<TOCPanel | null>(null);
const [editorContainer] = useAtom(editorContainerAtom);
const [editor] = useBlocksuiteEditor();
const onRefChange = useCallback((container: HTMLDivElement | null) => {
if (container) {
@@ -20,7 +19,7 @@ const EditorOutline = () => {
}
}, []);
if (!editorContainer) {
if (!editor) {
return;
}
@@ -28,8 +27,8 @@ const EditorOutline = () => {
tocPanelRef.current = new TOCPanel();
}
if (editorContainer !== tocPanelRef.current?.editor) {
(tocPanelRef.current as TOCPanel).editor = editorContainer;
if (editor !== tocPanelRef.current?.editor) {
(tocPanelRef.current as TOCPanel).editor = editor;
(tocPanelRef.current as TOCPanel).fitPadding = [20, 20, 20, 20];
}