fix(core): blocksuite editor runtime configs in correct timing (#10344)

packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor-container.tsx

@@ -42,7 +42,7 @@ export interface AffineEditorContainer extends HTMLElement {
   page: Store;
   doc: Store;
   docTitle: DocTitle;
-  host: EditorHost;
+  host?: EditorHost;
   model: RootBlockModel | null;
   updateComplete: Promise<boolean>;
   mode: DocMode;

packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor.tsx

@@ -67,46 +67,38 @@ const BlockSuiteEditorImpl = ({
       let canceled = false;
       const disposableGroup = new DisposableGroup();
 
-      if (onEditorReady) {
+      // Invoke onLoad once the editor has been mounted to the DOM.
-        // Invoke onLoad once the editor has been mounted to the DOM.
+      if (canceled) {
-        editor.updateComplete
+        return;
-          .then(() => {
+      }
-            if (canceled) {
-              return;
-            }
-            // host should be ready
 
-            // provide image proxy endpoint to blocksuite
+      // provide image proxy endpoint to blocksuite
-            const imageProxyUrl = new URL(
+      const imageProxyUrl = new URL(
-              BUILD_CONFIG.imageProxyUrl,
+        BUILD_CONFIG.imageProxyUrl,
-              server.baseUrl
+        server.baseUrl
-            ).toString();
+      ).toString();
-            const linkPreviewUrl = new URL(
-              BUILD_CONFIG.linkPreviewUrl,
-              server.baseUrl
-            ).toString();
 
-            editor.host?.std.clipboard.use(
+      const linkPreviewUrl = new URL(
-              customImageProxyMiddleware(imageProxyUrl)
+        BUILD_CONFIG.linkPreviewUrl,
-            );
+        server.baseUrl
+      ).toString();
 
-            page.get(LinkPreviewerService).setEndpoint(linkPreviewUrl);
+      editor.std.clipboard.use(customImageProxyMiddleware(imageProxyUrl));
+      page.get(LinkPreviewerService).setEndpoint(linkPreviewUrl);
+      page.get(ImageProxyService).setImageProxyURL(imageProxyUrl);
 
-            page.get(ImageProxyService).setImageProxyURL(imageProxyUrl);
+      editor.updateComplete
-
+        .then(() => {
-            return editor.host?.updateComplete;
+          if (onEditorReady) {
-          })
-          .then(() => {
-            if (canceled) {
-              return;
-            }
             const dispose = onEditorReady(editor);
             if (dispose) {
               disposableGroup.add(dispose);
             }
-          })
+          }
-          .catch(console.error);
+        })
-      }
+        .catch(error => {
+          console.error('Error updating editor', error);
+        });
 
       return () => {
         canceled = true;

packages/frontend/core/src/desktop/pages/workspace/detail-page/detail-page.tsx

@@ -167,10 +167,7 @@ const DetailPageImpl = memo(function DetailPageImpl() {
 
   const onLoad = useCallback(
     (editorContainer: AffineEditorContainer) => {
-      // blocksuite editor host
+      const std = editorContainer.std;
-      const editorHost = editorContainer.host;
-
-      const std = editorHost?.std;
       const disposable = new DisposableGroup();
       if (std) {
         const refNodeSlots = std.getOptional(RefNodeSlotsProvider);
@@ -179,7 +176,7 @@ const DetailPageImpl = memo(function DetailPageImpl() {
             // the event should not be emitted by AffineReference
             refNodeSlots.docLinkClicked.on(
               ({ pageId, params, openMode, event, host }) => {
-                if (host !== editorHost) {
+                if (host !== editorContainer.host) {
                   return;
                 }
                 openMode ??=

packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx

@@ -139,9 +139,6 @@ const DetailPageImpl = () => {
 
   const onLoad = useCallback(
     (editorContainer: AffineEditorContainer) => {
-      // blocksuite editor host
-      const editorHost = editorContainer.host;
-
       // provide image proxy endpoint to blocksuite
       const imageProxyUrl = new URL(
         BUILD_CONFIG.imageProxyUrl,
@@ -153,14 +150,19 @@ const DetailPageImpl = () => {
         server.baseUrl
       ).toString();
 
-      editorHost?.std.clipboard.use(customImageProxyMiddleware(imageProxyUrl));
+      editorContainer.std.clipboard.use(
-      editorHost?.doc.get(ImageProxyService).setImageProxyURL(imageProxyUrl);
+        customImageProxyMiddleware(imageProxyUrl)
+      );
+      editorContainer.doc
+        .get(ImageProxyService)
+        .setImageProxyURL(imageProxyUrl);
 
       // provide link preview endpoint to blocksuite
-      editorHost?.doc.get(LinkPreviewerService).setEndpoint(linkPreviewUrl);
+      editorContainer.doc.get(LinkPreviewerService).setEndpoint(linkPreviewUrl);
 
       // provide page mode and updated date to blocksuite
-      const refNodeService = editorHost?.std.getOptional(RefNodeSlotsProvider);
+      const refNodeService =
+        editorContainer.std.getOptional(RefNodeSlotsProvider);
       const disposable = new DisposableGroup();
       if (refNodeService) {
         disposable.add(

packages/frontend/core/src/modules/peek-view/view/doc-preview/doc-peek-view.tsx

@@ -96,12 +96,9 @@ function DocPeekPreviewEditor({
 
   const handleOnEditorReady = useCallback(
     (editorContainer: AffineEditorContainer) => {
-      if (!editorContainer.host) {
-        return;
-      }
       const disposableGroup = new DisposableGroup();
       const refNodeSlots =
-        editorContainer.host.std.getOptional(RefNodeSlotsProvider);
+        editorContainer.std.getOptional(RefNodeSlotsProvider);
       if (!refNodeSlots) return;
       // doc change event inside peek view should be handled by peek view
       disposableGroup.add(