import type { EditorContainer } from '@blocksuite/editor'; import type { Page } from '@blocksuite/store'; import { assertExists } from '@blocksuite/store'; import { useAtomValue, useSetAtom } from 'jotai'; import dynamic from 'next/dynamic'; import Head from 'next/head'; import type React from 'react'; import { useCallback } from 'react'; import { currentEditorAtom, workspacePreferredModeAtom } from '../atoms'; import { useBlockSuiteWorkspacePageTitle } from '../hooks/use-blocksuite-workspace-page-title'; import { usePageMeta } from '../hooks/use-page-meta'; import type { BlockSuiteWorkspace } from '../shared'; import { PageNotFoundError } from './affine/affine-error-eoundary'; import { BlockSuiteEditorHeader } from './blocksuite/header'; export type PageDetailEditorProps = { isPublic?: boolean; isPreview?: boolean; blockSuiteWorkspace: BlockSuiteWorkspace; pageId: string; onInit: (page: Page, editor: Readonly) => void; onLoad?: (page: Page, editor: EditorContainer) => void; header?: React.ReactNode; }; const Editor = dynamic( async () => (await import('./blocksuite/block-suite-editor')).BlockSuiteEditor, { ssr: false, } ); export const PageDetailEditor: React.FC = ({ blockSuiteWorkspace, pageId, onInit, onLoad, header, isPublic, isPreview, }) => { const page = blockSuiteWorkspace.getPage(pageId); if (!page) { throw new PageNotFoundError(blockSuiteWorkspace, pageId); } const title = useBlockSuiteWorkspacePageTitle(blockSuiteWorkspace, pageId); const meta = usePageMeta(blockSuiteWorkspace).find( meta => meta.id === pageId ); const currentMode = useAtomValue(workspacePreferredModeAtom)[pageId] ?? 'page'; const setEditor = useSetAtom(currentEditorAtom); assertExists(meta); return ( <> {title} {header} ) => { setEditor(editor); onInit(page, editor); }, [onInit, setEditor] )} onLoad={onLoad} /> ); };