feat(editor): add more open doc options to editor toolbar (#9588)

fix AF-2036, AF-2092

blocksuite/affine/block-embed/src/effects.ts

@@ -17,7 +17,6 @@ import type {
   insertEmbedLinkedDocCommand,
 } from './embed-linked-doc-block/commands/insert-embed-linked-doc';
 import { EmbedEdgelessLinkedDocBlockComponent } from './embed-linked-doc-block/embed-edgeless-linked-doc-block';
-import type { EmbedLinkedDocBlockConfig } from './embed-linked-doc-block/embed-linked-doc-config';
 import {
   EmbedLoomBlockComponent,
   type EmbedLoomBlockService,
@@ -123,9 +122,7 @@ declare global {
     interface CommandContext {
       insertedLinkType?: Promise<InsertedLinkType>;
     }
-    interface BlockConfigs {
-      'affine:embed-linked-doc': EmbedLinkedDocBlockConfig;
-    }
+
     interface Commands {
       insertEmbedLinkedDoc: typeof insertEmbedLinkedDocCommand;
     }

blocksuite/affine/block-embed/src/embed-linked-doc-block/embed-edgeless-linked-doc-block.ts

@@ -4,7 +4,11 @@ import {
   EMBED_CARD_WIDTH,
 } from '@blocksuite/affine-shared/consts';
 import { FeatureFlagService } from '@blocksuite/affine-shared/services';
-import { cloneReferenceInfoWithoutAliases } from '@blocksuite/affine-shared/utils';
+import {
+  cloneReferenceInfoWithoutAliases,
+  isNewTabTrigger,
+  isNewViewTrigger,
+} from '@blocksuite/affine-shared/utils';
 import { Bound } from '@blocksuite/global/utils';
 
 import { toEdgelessEmbedBlock } from '../common/to-edgeless-embed-block.js';
@@ -65,9 +69,10 @@ export class EmbedEdgelessLinkedDocBlockComponent extends toEdgelessEmbedBlock(
   }
 
   protected override _handleClick(evt: MouseEvent): void {
-    if (this.config.handleClick) {
-      this.config.handleClick(evt, this.host, this.referenceInfo$.peek());
-      return;
+    if (isNewTabTrigger(evt)) {
+      this.open({ openMode: 'open-in-new-tab', event: evt });
+    } else if (isNewViewTrigger(evt)) {
+      this.open({ openMode: 'open-in-new-view', event: evt });
     }
   }
 }

blocksuite/affine/block-embed/src/embed-linked-doc-block/embed-linked-doc-block.ts

@@ -14,11 +14,15 @@ import {
   DocDisplayMetaProvider,
   DocModeProvider,
   FeatureFlagService,
+  OpenDocExtensionIdentifier,
+  type OpenDocMode,
   ThemeProvider,
 } from '@blocksuite/affine-shared/services';
 import {
   cloneReferenceInfo,
   cloneReferenceInfoWithoutAliases,
+  isNewTabTrigger,
+  isNewViewTrigger,
   matchFlavours,
   referenceToNode,
 } from '@blocksuite/affine-shared/utils';
@@ -39,10 +43,6 @@ import {
   renderLinkedDocInCard,
 } from '../common/render-linked-doc.js';
 import { SyncedDocErrorIcon } from '../embed-synced-doc-block/styles.js';
-import {
-  type EmbedLinkedDocBlockConfig,
-  EmbedLinkedDocBlockConfigIdentifier,
-} from './embed-linked-doc-config.js';
 import { styles } from './styles.js';
 import { getEmbedLinkedDocIcons } from './utils.js';
 
@@ -205,10 +205,18 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
       .icon(pageId, { params, title, referenced: true }).value;
   });
 
-  open = () => {
-    this.std
-      .getOptional(RefNodeSlotsProvider)
-      ?.docLinkClicked.emit(this.referenceInfo$.peek());
+  open = ({
+    openMode,
+    event,
+  }: {
+    openMode?: OpenDocMode;
+    event?: MouseEvent;
+  } = {}) => {
+    this.std.getOptional(RefNodeSlotsProvider)?.docLinkClicked.emit({
+      ...this.referenceInfo$.peek(),
+      openMode,
+      event,
+    });
   };
 
   refreshData = () => {
@@ -228,12 +236,6 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
     );
   });
 
-  get config(): EmbedLinkedDocBlockConfig {
-    return (
-      this.std.provider.getOptional(EmbedLinkedDocBlockConfigIdentifier) || {}
-    );
-  }
-
   get docTitle() {
     return this.model.title || this.linkedDoc?.meta?.title || 'Untitled';
   }
@@ -247,22 +249,16 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
   }
 
   private _handleDoubleClick(event: MouseEvent) {
-    if (this.config.handleDoubleClick) {
-      this.config.handleDoubleClick(
-        event,
-        this.host,
-        this.referenceInfo$.peek()
-      );
-      if (event.defaultPrevented) {
-        return;
-      }
-    }
-
-    if (isPeekable(this)) {
-      return;
-    }
     event.stopPropagation();
-    this.open();
+    const openDocService = this.std.get(OpenDocExtensionIdentifier);
+    const shouldOpenInPeek =
+      openDocService.isAllowed('open-in-center-peek') && isPeekable(this);
+    this.open({
+      openMode: shouldOpenInPeek
+        ? 'open-in-center-peek'
+        : 'open-in-active-view',
+      event,
+    });
   }
 
   private _isDocEmpty() {
@@ -274,13 +270,11 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
   }
 
   protected _handleClick(event: MouseEvent) {
-    if (this.config.handleClick) {
-      this.config.handleClick(event, this.host, this.referenceInfo$.peek());
-      if (event.defaultPrevented) {
-        return;
-      }
+    if (isNewTabTrigger(event)) {
+      this.open({ openMode: 'open-in-new-tab', event });
+    } else if (isNewViewTrigger(event)) {
+      this.open({ openMode: 'open-in-new-view', event });
     }
-
     this._selectBlock();
   }
 

blocksuite/affine/block-embed/src/embed-linked-doc-block/embed-linked-doc-config.ts

@@ -1,30 +0,0 @@
-import type { ReferenceInfo } from '@blocksuite/affine-model';
-import type { EditorHost } from '@blocksuite/block-std';
-import { createIdentifier } from '@blocksuite/global/di';
-import type { ExtensionType } from '@blocksuite/store';
-
-export interface EmbedLinkedDocBlockConfig {
-  handleClick?: (
-    e: MouseEvent,
-    host: EditorHost,
-    referenceInfo: ReferenceInfo
-  ) => void;
-  handleDoubleClick?: (
-    e: MouseEvent,
-    host: EditorHost,
-    referenceInfo: ReferenceInfo
-  ) => void;
-}
-
-export const EmbedLinkedDocBlockConfigIdentifier =
-  createIdentifier<EmbedLinkedDocBlockConfig>('EmbedLinkedDocBlockConfig');
-
-export function EmbedLinkedDocBlockConfigExtension(
-  config: EmbedLinkedDocBlockConfig
-): ExtensionType {
-  return {
-    setup: di => {
-      di.addImpl(EmbedLinkedDocBlockConfigIdentifier, () => config);
-    },
-  };
-}

blocksuite/affine/block-embed/src/embed-linked-doc-block/index.ts

@@ -1,5 +1,4 @@
 export * from './adapters';
 export type { InsertedLinkType } from './commands';
 export * from './embed-linked-doc-block';
-export * from './embed-linked-doc-config';
 export * from './embed-linked-doc-spec';

blocksuite/affine/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts

@@ -1,5 +1,8 @@
 import { Peekable } from '@blocksuite/affine-components/peek';
-import { RefNodeSlotsProvider } from '@blocksuite/affine-components/rich-text';
+import {
+  type DocLinkClickedEvent,
+  RefNodeSlotsProvider,
+} from '@blocksuite/affine-components/rich-text';
 import {
   type AliasInfo,
   type DocMode,
@@ -305,11 +308,13 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
       .icon(pageId, { params, referenced: true }).value;
   });
 
-  open = () => {
+  open = (event?: Partial<DocLinkClickedEvent>) => {
     const pageId = this.model.pageId;
     if (pageId === this.doc.id) return;
 
-    this.std.getOptional(RefNodeSlotsProvider)?.docLinkClicked.emit({ pageId });
+    this.std
+      .getOptional(RefNodeSlotsProvider)
+      ?.docLinkClicked.emit({ ...event, pageId });
   };
 
   refreshData = () => {