fix(editor): missing re-subscription for slots on store (#10750)

blocksuite/affine/shared/src/services/block-meta-service.ts

@@ -1,5 +1,5 @@
 import type { BlockMeta } from '@blocksuite/affine-model';
-import { type BlockModel, type Store, StoreExtension } from '@blocksuite/store';
+import { type BlockModel, StoreExtension } from '@blocksuite/store';
 
 import { FeatureFlagService } from './feature-flag-service';
 import { UserProvider } from './user-service';
@@ -15,30 +15,27 @@ export class BlockMetaService extends StoreExtension {
   static override key = 'affine-block-meta-service';
 
   get isBlockMetaEnabled() {
-    return (
-      this.store.get(FeatureFlagService).getFlag('enable_block_meta') === true
-    );
+    const flagService = this.store.get(FeatureFlagService);
+    return flagService.getFlag('enable_block_meta') === true;
   }
 
-  constructor(store: Store) {
-    super(store);
+  override loaded() {
+    this.store.disposableGroup.add(
+      this.store.slots.blockUpdated.on(({ type, id }) => {
+        if (!this.isBlockMetaEnabled) return;
 
-    if (!this.isBlockMetaEnabled) return;
+        const model = this.store.getBlock(id)?.model;
+        if (!model) return;
 
-    this.store.slots.blockUpdated.on(({ type, id }) => {
-      if (!this.isBlockMetaEnabled) return;
+        if (type === 'add') {
+          return this._onBlockCreated(model);
+        }
 
-      const model = this.store.getBlock(id)?.model;
-      if (!model) return;
-
-      if (type === 'add') {
-        return this._onBlockCreated(model);
-      }
-
-      if (type === 'update') {
-        return this._onBlockUpdated(model);
-      }
-    });
+        if (type === 'update') {
+          return this._onBlockUpdated(model);
+        }
+      })
+    );
   }
 
   private readonly _onBlockCreated = (model: BlockModel<BlockMeta>): void => {

blocksuite/framework/store/src/model/store/store.ts

@@ -1,7 +1,6 @@
 import { Container, type ServiceProvider } from '@blocksuite/global/di';
 import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
-import type { Disposable } from '@blocksuite/global/slot';
-import { Slot } from '@blocksuite/global/slot';
+import { DisposableGroup, Slot } from '@blocksuite/global/slot';
 import { computed, signal } from '@preact/signals-core';
 
 import type { ExtensionType } from '../../extension/extension.js';
@@ -39,6 +38,8 @@ const internalExtensions = [StoreSelectionExtension];
 export class Store {
   readonly userExtensions: ExtensionType[];
 
+  disposableGroup = new DisposableGroup();
+
   private readonly _provider: ServiceProvider;
 
   private readonly _runQuery = (block: Block) => {
@@ -51,8 +52,6 @@ export class Store {
 
   private readonly _crud: DocCRUD;
 
-  private readonly _disposeBlockUpdated: Disposable;
-
   private readonly _query: Query = {
     match: [],
     mode: 'loose',
@@ -358,8 +357,12 @@ export class Store {
       this._onBlockAdded(id, true);
     });
 
-    this._disposeBlockUpdated = this._doc.slots.yBlockUpdated.on(
-      ({ type, id }) => {
+    this._subscribeToSlots();
+  }
+
+  private readonly _subscribeToSlots = () => {
+    this.disposableGroup.add(
+      this._doc.slots.yBlockUpdated.on(({ type, id }) => {
         switch (type) {
           case 'add': {
             this._onBlockAdded(id);
@@ -370,9 +373,13 @@ export class Store {
             return;
           }
         }
-      }
+      })
     );
-  }
+    this.disposableGroup.add(this.slots.ready);
+    this.disposableGroup.add(this.slots.blockUpdated);
+    this.disposableGroup.add(this.slots.rootAdded);
+    this.disposableGroup.add(this.slots.rootDeleted);
+  };
 
   private _getSiblings<T>(
     block: BlockModel | string,
@@ -598,11 +605,7 @@ export class Store {
       ext.disposed();
     });
 
-    this._disposeBlockUpdated.dispose();
-    this.slots.ready.dispose();
-    this.slots.blockUpdated.dispose();
-    this.slots.rootAdded.dispose();
-    this.slots.rootDeleted.dispose();
+    this.disposableGroup.dispose();
   }
 
   getBlock(id: string): Block | undefined {
@@ -702,6 +705,11 @@ export class Store {
   }
 
   load(initFn?: () => void) {
+    if (this.disposableGroup.disposed) {
+      this.disposableGroup = new DisposableGroup();
+      this._subscribeToSlots();
+    }
+
     this._doc.load(initFn);
     this._provider.getAll(StoreExtensionIdentifier).forEach(ext => {
       ext.loaded();