fix(core): avoid side effects (#8245)

packages/frontend/core/src/components/affine/setting-modal/general-setting/editor/edgeless/snapshot.tsx

@@ -1,5 +1,4 @@
 import { Skeleton } from '@affine/component';
-import { getFontConfigExtension } from '@affine/core/components/blocksuite/block-suite-editor';
 import type { EditorSettingSchema } from '@affine/core/modules/editor-settting';
 import { EditorSettingService } from '@affine/core/modules/editor-settting';
 import type { EditorHost } from '@blocksuite/block-std';
@@ -72,10 +71,7 @@ export const EdgelessSnapshot = (props: Props) => {
 
     const editorHost = new BlockStdScope({
       doc,
-      extensions: [
-        ...SpecProvider.getInstance().getSpec('edgeless:preview').value,
-        getFontConfigExtension(),
-      ],
+      extensions: SpecProvider.getInstance().getSpec('edgeless:preview').value,
     }).render();
     docRef.current = doc;
     editorHostRef.current = editorHost;

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

@@ -1,13 +1,16 @@
-export * from './blocksuite-editor';
-export { getFontConfigExtension } from './specs/font-extension';
-
+import { registerAICustomComponents } from '@affine/core/blocksuite/presets/ai';
 import { effects as blocksEffects } from '@blocksuite/blocks/effects';
 import { effects as presetsEffects } from '@blocksuite/presets/effects';
 
 import { setupAIProvider } from './ai/setup-provider';
+import { effects as edgelessEffects } from './specs/edgeless';
 import { effects as patchEffects } from './specs/preview';
 
 blocksEffects();
 presetsEffects();
 patchEffects();
 setupAIProvider();
+edgelessEffects();
+registerAICustomComponents();
+
+export * from './blocksuite-editor';

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/root-block.ts

@@ -55,6 +55,7 @@ export function createPageRootBlockSpec(
   return [
     enableAI ? AIPageRootBlockSpec : PageRootBlockSpec,
     FontLoaderService,
+    getFontConfigExtension(),
     getTelemetryExtension(),
     getEditorConfigExtension(framework),
   ].flat();

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/edgeless.ts

@@ -1,8 +1,12 @@
+import { builtInTemplates as builtInEdgelessTemplates } from '@affine/templates/edgeless';
+import { builtInTemplates as builtInStickersTemplates } from '@affine/templates/stickers';
 import type { ExtensionType } from '@blocksuite/block-std';
+import type { TemplateManager } from '@blocksuite/blocks';
 import {
   EdgelessNoteBlockSpec,
   EdgelessSurfaceBlockSpec,
   EdgelessSurfaceRefBlockSpec,
+  EdgelessTemplatePanel,
   EdgelessTextBlockSpec,
   FrameBlockSpec,
 } from '@blocksuite/blocks';
@@ -26,3 +30,12 @@ export function createEdgelessModeSpecs(
     createEdgelessRootBlockSpec(framework, enableAI),
   ].flat();
 }
+
+export function effects() {
+  EdgelessTemplatePanel.templates.extend(
+    builtInStickersTemplates as TemplateManager
+  );
+  EdgelessTemplatePanel.templates.extend(
+    builtInEdgelessTemplates as TemplateManager
+  );
+}

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/preview.ts

@@ -2,7 +2,12 @@ import type { ExtensionType } from '@blocksuite/block-std';
 import { SpecProvider } from '@blocksuite/blocks';
 import { AIChatBlockSpec } from '@blocksuite/presets';
 
-const CustomSpecs: ExtensionType[] = [AIChatBlockSpec].flat();
+import { getFontConfigExtension } from './font-extension';
+
+const CustomSpecs: ExtensionType[] = [
+  AIChatBlockSpec,
+  getFontConfigExtension(),
+].flat();
 
 function patchPreviewSpec(id: string, specs: ExtensionType[]) {
   const specProvider = SpecProvider.getInstance();