mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 12:55:00 +00:00
feat(editor): support converting inline link to embed iframe block (#11030)
To close [BS-2846](https://linear.app/affine-design/issue/BS-2846/支持-inline-link-转成-embed-iframe-block)
This commit is contained in:
@@ -1,7 +1,9 @@
|
|||||||
import { toast } from '@blocksuite/affine-components/toast';
|
import { toast } from '@blocksuite/affine-components/toast';
|
||||||
import {
|
import {
|
||||||
ActionPlacement,
|
ActionPlacement,
|
||||||
|
EmbedIframeService,
|
||||||
EmbedOptionProvider,
|
EmbedOptionProvider,
|
||||||
|
FeatureFlagService,
|
||||||
type ToolbarAction,
|
type ToolbarAction,
|
||||||
type ToolbarActionGroup,
|
type ToolbarActionGroup,
|
||||||
type ToolbarModuleConfig,
|
type ToolbarModuleConfig,
|
||||||
@@ -193,10 +195,19 @@ export const builtinInlineLinkToolbarConfig = {
|
|||||||
const url = inlineEditor.getFormat(selfInlineRange).link;
|
const url = inlineEditor.getFormat(selfInlineRange).link;
|
||||||
if (!url) return false;
|
if (!url) return false;
|
||||||
|
|
||||||
|
// check if the url can be embedded as iframe block
|
||||||
|
const featureFlag = ctx.std.get(FeatureFlagService);
|
||||||
|
const embedIframeService = ctx.std.get(EmbedIframeService);
|
||||||
|
const isEmbedIframeEnabled = featureFlag.getFlag(
|
||||||
|
'enable_embed_iframe_block'
|
||||||
|
);
|
||||||
|
const canEmbedAsIframe =
|
||||||
|
isEmbedIframeEnabled && embedIframeService.canEmbed(url);
|
||||||
|
|
||||||
const options = ctx.std
|
const options = ctx.std
|
||||||
.get(EmbedOptionProvider)
|
.get(EmbedOptionProvider)
|
||||||
.getEmbedBlockOptions(url);
|
.getEmbedBlockOptions(url);
|
||||||
return options?.viewType === 'embed';
|
return canEmbedAsIframe || options?.viewType === 'embed';
|
||||||
},
|
},
|
||||||
run(ctx) {
|
run(ctx) {
|
||||||
const target = ctx.message$.peek()?.element;
|
const target = ctx.message$.peek()?.element;
|
||||||
@@ -218,21 +229,34 @@ export const builtinInlineLinkToolbarConfig = {
|
|||||||
// Clears
|
// Clears
|
||||||
ctx.reset();
|
ctx.reset();
|
||||||
|
|
||||||
const options = ctx.std
|
|
||||||
.get(EmbedOptionProvider)
|
|
||||||
.getEmbedBlockOptions(url);
|
|
||||||
if (options?.viewType !== 'embed') return;
|
|
||||||
|
|
||||||
const flavour = options.flavour;
|
|
||||||
const index = parent.children.indexOf(model);
|
const index = parent.children.indexOf(model);
|
||||||
const props = { url };
|
const props = { url };
|
||||||
|
let blockId: string | undefined;
|
||||||
|
|
||||||
const blockId = ctx.store.addBlock(
|
// first try to embed as iframe block
|
||||||
flavour,
|
const featureFlag = ctx.std.get(FeatureFlagService);
|
||||||
props,
|
const isEmbedIframeEnabled = featureFlag.getFlag(
|
||||||
parent,
|
'enable_embed_iframe_block'
|
||||||
index + 1
|
|
||||||
);
|
);
|
||||||
|
const embedIframeService = ctx.std.get(EmbedIframeService);
|
||||||
|
if (isEmbedIframeEnabled && embedIframeService.canEmbed(url)) {
|
||||||
|
blockId = embedIframeService.addEmbedIframeBlock(
|
||||||
|
props,
|
||||||
|
parent.id,
|
||||||
|
index + 1
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
// if not, try to add as other embed link block
|
||||||
|
const options = ctx.std
|
||||||
|
.get(EmbedOptionProvider)
|
||||||
|
.getEmbedBlockOptions(url);
|
||||||
|
if (options?.viewType !== 'embed') return;
|
||||||
|
|
||||||
|
const flavour = options.flavour;
|
||||||
|
blockId = ctx.store.addBlock(flavour, props, parent, index + 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!blockId) return;
|
||||||
|
|
||||||
const totalTextLength = inlineEditor.yTextLength;
|
const totalTextLength = inlineEditor.yTextLength;
|
||||||
const inlineTextLength = selfInlineRange.length;
|
const inlineTextLength = selfInlineRange.length;
|
||||||
|
|||||||
Reference in New Issue
Block a user