refactor: ref page use AffineEditor

libs/components/editor-blocks/src/blocks/group/scene-kanban/CardItem.tsx

@@ -1,9 +1,5 @@
 import type { KanbanCard } from '@toeverything/components/editor-core';
-import {
+import { RenderBlock, useKanban } from '@toeverything/components/editor-core';
-    RenderBlock,
-    useKanban,
-    useRefPage,
-} from '@toeverything/components/editor-core';
 import { PenIcon } from '@toeverything/components/icons';
 import {
     IconButton,
@@ -12,6 +8,7 @@ import {
 } from '@toeverything/components/ui';
 import { useFlag } from '@toeverything/datasource/feature-flags';
 import { useState } from 'react';
+import { useRefPage } from './RefPage';
 
 const CardContent = styled('div')({
     margin: '20px',

libs/components/editor-blocks/src/blocks/group/scene-kanban/RefPage.tsx

@@ -1,7 +1,8 @@
+import { AffineEditor } from '@toeverything/components/affine-editor';
+import { useEditor } from '@toeverything/components/editor-core';
 import { MuiBackdrop, styled, useTheme } from '@toeverything/components/ui';
 import { createContext, ReactNode, useContext, useState } from 'react';
 import { createPortal } from 'react-dom';
-import { RenderBlock } from '../render-block';
 
 const Dialog = styled('div')({
     flex: 1,
@@ -30,7 +31,7 @@ const Modal = ({ open, children }: { open: boolean; children?: ReactNode }) => {
             onClick={closeSubPage}
         >
             <Dialog
-                onClick={e => {
+                onClick={(e: { stopPropagation: () => void }) => {
                     e.stopPropagation();
                 }}
             >
@@ -43,9 +44,18 @@ const Modal = ({ open, children }: { open: boolean; children?: ReactNode }) => {
 };
 
 const ModalPage = ({ blockId }: { blockId: string | null }) => {
+    const { editor } = useEditor();
+
     return (
         <Modal open={!!blockId}>
-            {blockId && <RenderBlock blockId={blockId} />}
+            {blockId && (
+                <AffineEditor
+                    workspace={editor.workspace}
+                    rootBlockId={blockId}
+                    scrollBlank={false}
+                    isWhiteboard
+                />
+            )}
         </Modal>
     );
 };

libs/components/editor-core/src/index.ts

@@ -16,4 +16,4 @@ export * from './utils';
 
 export * from './editor';
 
-export { RefPageProvider, useRefPage } from './ref-page';
+export { useEditor } from './Contexts';

libs/components/editor-core/src/recast-block/Context.tsx

@@ -2,7 +2,6 @@ import { Protocol } from '@toeverything/datasource/db-service';
 import { AsyncBlock } from '../editor';
 import { ComponentType, createContext, ReactNode, useContext } from 'react';
 import { RecastBlock } from './types';
-import { RefPageProvider } from '../ref-page';
 
 /**
  * Determine whether the block supports RecastBlock
@@ -48,7 +47,7 @@ export const RecastBlockProvider = ({
 
     return (
         <RecastBlockContext.Provider value={block}>
-            <RefPageProvider>{children}</RefPageProvider>
+            {children}
         </RecastBlockContext.Provider>
     );
 };

libs/components/editor-core/src/ref-page/index.ts

@@ -1 +0,0 @@
-export { useRefPage, RefPageProvider } from './ModalPage';