fix: issue

toeverything · Dec 9, 2024 · e57e4df · e57e4df
1 parent d9e506d
commit e57e4df
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 18 deletions.
diff --git a/packages/affine/block-surface/src/renderer/canvas-renderer.ts b/packages/affine/block-surface/src/renderer/canvas-renderer.ts
@@ -1,6 +1,7 @@
 import type {
   GridManager,
   LayerManager,
+  SurfaceBlockModel,
   Viewport,
 } from '@blocksuite/block-std/gfx';
 import type { IBound } from '@blocksuite/global/utils';
@@ -37,6 +38,7 @@ type RendererOptions = {
   onStackingCanvasCreated?: (canvas: HTMLCanvasElement) => void;
   elementRenderers: Record<string, ElementRenderer>;
   gridManager: GridManager;
+  surfaceModel: SurfaceBlockModel;
 };
 
 export class CanvasRenderer {
@@ -90,6 +92,8 @@ export class CanvasRenderer {
     if (options.enableStackingCanvas) {
       this._initStackingCanvas(options.onStackingCanvasCreated);
     }
+
+    this._watchSurface(options.surfaceModel);
   }
 
   /**
@@ -321,6 +325,28 @@ export class CanvasRenderer {
     this.refresh();
   }
 
+  private _watchSurface(surfaceModel: SurfaceBlockModel) {
+    const slots = [
+      'elementAdded',
+      'elementRemoved',
+      'localElementAdded',
+      'localElementDeleted',
+      'localElementUpdated',
+    ] as const;
+
+    slots.forEach(slotName => {
+      this._disposables.add(surfaceModel[slotName].on(() => this.refresh()));
+    });
+
+    this._disposables.add(
+      surfaceModel.elementUpdated.on(payload => {
+        // ignore externalXYWH update cause it's updated by the renderer
+        if (payload.props['externalXYWH']) return;
+        this.refresh();
+      })
+    );
+  }
+
   addOverlay(overlay: Overlay) {
     overlay.setRenderer(this);
     this._overlays.add(overlay);

diff --git a/packages/affine/block-surface/src/surface-block.ts b/packages/affine/block-surface/src/surface-block.ts
@@ -187,25 +187,9 @@ export class SurfaceBlockComponent extends BlockComponent<
         canvas.className = 'indexable-canvas';
       },
       elementRenderers: this._edgelessService.elementRenderers,
+      surfaceModel: this.model,
     });
 
-    this._disposables.add(
-      this.model.elementUpdated.on(payload => {
-        // ignore externalXYWH update cause it's updated by the renderer
-        if (payload.props['externalXYWH']) return;
-        this._renderer.refresh();
-      })
-    );
-    this._disposables.add(
-      this.model.elementAdded.on(() => {
-        this._renderer.refresh();
-      })
-    );
-    this._disposables.add(
-      this.model.elementRemoved.on(() => {
-        this._renderer.refresh();
-      })
-    );
     this._disposables.add(() => {
       this._renderer.dispose();
     });

diff --git a/packages/blocks/src/surface-block/mini-mindmap/surface-block.ts b/packages/blocks/src/surface-block/mini-mindmap/surface-block.ts
@@ -82,7 +82,6 @@ export class MindmapSurfaceBlock extends BlockComponent<SurfaceBlockModel> {
   private _setupRenderer() {
     this._disposables.add(
       this.model.elementUpdated.on(() => {
-        this.renderer?.refresh();
         this.mindmapService.center();
       })
     );
@@ -122,7 +121,9 @@ export class MindmapSurfaceBlock extends BlockComponent<SurfaceBlockModel> {
           ),
       },
       elementRenderers,
+      surfaceModel: this.model,
     });
+    this._disposables.add(this.renderer);
   }
 
   override firstUpdated(_changedProperties: Map<PropertyKey, unknown>): void {