Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-08-08 12:45:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): unify block props api (#10888)

Browse Source 
Closes: [BS-2707](https://linear.app/affine-design/issue/BS-2707/统一使用props获取和更新block-prop)
This commit is contained in:
Saul-Mirone
2025-03-16 05:48:34 +00:00
parent 8f9e5bf0aa
commit 26285f7dcb
193 changed files with 1019 additions and 891 deletions
Download Patch File Download Diff File Expand all files Collapse all files
blocksuite/affine/blocks/block-embed/src/common/render-linked-doc.ts
+8 -8
View File
@@ -37,7 +37,7 @@ export function renderLinkedDocInCard(
const linkedDoc = card.linkedDoc;
if (!linkedDoc) {
console.error(
`Trying to load page ${card.model.pageId} in linked page block, but the page is not found.`
`Trying to load page ${card.model.props.pageId} in linked page block, but the page is not found.`
);
return;
}
@@ -62,7 +62,7 @@ async function renderPageAsBanner(card: EmbedSyncedDocCard) {
const linkedDoc = card.linkedDoc;
if (!linkedDoc) {
console.error(
`Trying to load page ${card.model.pageId} in linked page block, but the page is not found.`
`Trying to load page ${card.model.props.pageId} in linked page block, but the page is not found.`
);
return;
}
@@ -89,7 +89,7 @@ async function renderImageAsBanner(
card: EmbedSyncedDocCard,
image: BlockModel
) {
const sourceId = (image as ImageBlockModel).sourceId;
const sourceId = (image as ImageBlockModel).props.sourceId;
if (!sourceId) return;
const storage = card.linkedDoc?.blobSync;
@@ -131,7 +131,7 @@ async function renderNoteContent(
const doc = card.linkedDoc;
if (!doc) {
console.error(
`Trying to load page ${card.model.pageId} in linked page block, but the page is not found.`
`Trying to load page ${card.model.props.pageId} in linked page block, but the page is not found.`
);
return;
}
@@ -141,7 +141,7 @@ async function renderNoteContent(
return;
}
const cardStyle = card.model.style;
const cardStyle = card.model.props.style;
const isHorizontal = cardStyle === 'horizontal';
const allowFlavours = isHorizontal ? [] : [ImageBlockModel];
@@ -230,7 +230,7 @@ export function getNotesFromDoc(doc: Store) {
const notes = doc.root?.children.filter(
child =>
matchModels(child, [NoteBlockModel]) &&
child.displayMode !== NoteDisplayMode.EdgelessOnly
child.props.displayMode !== NoteDisplayMode.EdgelessOnly
);
if (!notes || !notes.length) {
@@ -313,8 +313,8 @@ export function getTitleFromSelectedModels(selectedModels: DraftModel[]) {
model: DraftModel
): model is DraftModel<ParagraphBlockModel> =>
model.flavour === 'affine:paragraph';
if (isParagraph(firstBlock) && firstBlock.type.startsWith('h')) {
return firstBlock.text?.toString();
if (isParagraph(firstBlock) && firstBlock.props.type.startsWith('h')) {
return firstBlock.props.text.toString();
}
return undefined;
}
blocksuite/affine/blocks/block-embed/src/configs/toolbar.ts
+14 -11
View File
@@ -55,7 +55,7 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return null;
const { url } = model;
const { url } = model.props;
const options = ctx.std
.get(EmbedOptionProvider)
.getEmbedBlockOptions(url);
@@ -75,7 +75,8 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return;
const { title, caption, url: link, parent } = model;
const { title, caption, url: link } = model.props;
const { parent } = model;
const index = parent?.children.indexOf(model);
const yText = new Y.Text();
@@ -107,7 +108,7 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return true;
const { url } = model;
const { url } = model.props;
const options = ctx.std
.get(EmbedOptionProvider)
.getEmbedBlockOptions(url);
@@ -118,13 +119,14 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return;
const { url, caption, parent } = model;
const { url, caption } = model.props;
const { parent } = model;
const index = parent?.children.indexOf(model);
const options = ctx.std
.get(EmbedOptionProvider)
.getEmbedBlockOptions(url);
let { style } = model;
let { style } = model.props;
let flavour = 'affine:bookmark';
if (options?.viewType === 'card') {
@@ -166,7 +168,7 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return false;
const { url } = model;
const { url } = model.props;
const options = ctx.std
.get(EmbedOptionProvider)
.getEmbedBlockOptions(url);
@@ -177,7 +179,7 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return false;
const { url } = model;
const { url } = model.props;
const options = ctx.std
.get(EmbedOptionProvider)
.getEmbedBlockOptions(url);
@@ -188,7 +190,8 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return;
const { url, caption, parent } = model;
const { url, caption } = model.props;
const { parent } = model;
const index = parent?.children.indexOf(model);
const options = ctx.std
.get(EmbedOptionProvider)
@@ -197,7 +200,7 @@ export function createBuiltinToolbarConfigForExternal(
if (options?.viewType !== 'embed') return;
const { flavour, styles } = options;
let { style } = model;
let { style } = model.props;
if (!styles.includes(style)) {
style =
@@ -231,7 +234,7 @@ export function createBuiltinToolbarConfigForExternal(
const model = ctx.getCurrentBlockBy(BlockSelection)?.model;
if (!model || !isExternalEmbedModel(model)) return null;
const { url } = model;
const { url } = model.props;
const viewType =
ctx.std.get(EmbedOptionProvider).getEmbedBlockOptions(url)
?.viewType ?? 'card';
@@ -309,7 +312,7 @@ export function createBuiltinToolbarConfigForExternal(
.actions=${actions}
.context=${ctx}
.toggle=${toggle}
.style$=${model.style$}
.style$=${model.props.style$}
></affine-card-style-dropdown-menu>`
)}`;
},
blocksuite/affine/blocks/block-embed/src/embed-figma-block/embed-figma-block.ts
+4 -4
View File
@@ -22,7 +22,7 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<EmbedFigmaMode
protected _isResizing = false;
open = () => {
let link = this.model.url;
let link = this.model.props.url;
if (!link.match(/^[a-zA-Z]+:\/\//)) {
link = 'https://' + link;
}
@@ -51,9 +51,9 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<EmbedFigmaMode
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
if (!this.model.title) {
if (!this.model.props.title) {
this.doc.withoutTransact(() => {
this.doc.updateBlock(this.model, {
title: 'Figma',
@@ -90,7 +90,7 @@ export class EmbedFigmaBlockComponent extends EmbedBlockComponent<EmbedFigmaMode
}
override renderBlock() {
const { title, description, url } = this.model;
const { title, description, url } = this.model.props;
const titleText = title ?? 'Figma';
return this.renderEmbed(
blocksuite/affine/blocks/block-embed/src/embed-github-block/embed-github-block.ts
+10 -6
View File
@@ -31,7 +31,7 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
override _cardStyle: (typeof EmbedGithubStyles)[number] = 'horizontal';
open = () => {
let link = this.model.url;
let link = this.model.props.url;
if (!link.match(/^[a-zA-Z]+:\/\//)) {
link = 'https://' + link;
}
@@ -75,11 +75,15 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
if (!this.model.owner || !this.model.repo || !this.model.githubId) {
if (
!this.model.props.owner ||
!this.model.props.repo ||
!this.model.props.githubId
) {
this.doc.withoutTransact(() => {
const url = this.model.url;
const url = this.model.props.url;
const urlMatch = url.match(githubUrlRegex);
if (urlMatch) {
const [, owner, repo, githubType, githubId] = urlMatch;
@@ -94,7 +98,7 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
}
this.doc.withoutTransact(() => {
if (!this.model.description && !this.model.title) {
if (!this.model.props.description && !this.model.props.title) {
this.refreshData();
} else {
this.refreshStatus();
@@ -123,7 +127,7 @@ export class EmbedGithubBlockComponent extends EmbedBlockComponent<
description,
image,
style,
} = this.model;
} = this.model.props;
const loading = this.loading;
const theme = this.std.get(ThemeProvider).theme;
blocksuite/affine/blocks/block-embed/src/embed-github-block/utils.ts
+2 -2
View File
@@ -24,7 +24,7 @@ export async function queryEmbedGithubData(
): Promise<Partial<EmbedGithubBlockUrlData>> {
const [githubApiData, openGraphData] = await Promise.all([
queryEmbedGithubApiData(embedGithubModel, signal),
linkPreviewer.query(embedGithubModel.url, signal),
linkPreviewer.query(embedGithubModel.props.url, signal),
]);
return { ...githubApiData, ...openGraphData };
}
@@ -33,7 +33,7 @@ export async function queryEmbedGithubApiData(
embedGithubModel: EmbedGithubModel,
signal?: AbortSignal
): Promise<Partial<EmbedGithubBlockUrlData>> {
const { owner, repo, githubType, githubId } = embedGithubModel;
const { owner, repo, githubType, githubId } = embedGithubModel.props;
let githubApiData: Partial<EmbedGithubBlockUrlData> = {};
// github's public api has a rate limit of 60 requests per hour
blocksuite/affine/blocks/block-embed/src/embed-html-block/components/fullscreen-toolbar.ts
+1 -1
View File
@@ -108,7 +108,7 @@ export class EmbedHtmlFullscreenToolbar extends LitElement {
this.embedHtml.std.clipboard
.writeToClipboard(items => {
items['text/plain'] = this.embedHtml.model.html ?? '';
items['text/plain'] = this.embedHtml.model.props.html ?? '';
return items;
})
.then(() => {
blocksuite/affine/blocks/block-embed/src/embed-html-block/configs/toolbar.ts
+1 -1
View File
@@ -88,7 +88,7 @@ export const builtinToolbarConfig = {
.actions=${actions}
.context=${ctx}
.toggle=${toggle}
.style$=${model.style$}
.style=${model.props.style$}
></affine-card-style-dropdown-menu>`
)}`;
},
blocksuite/affine/blocks/block-embed/src/embed-html-block/embed-html-block.ts
+3 -3
View File
@@ -49,7 +49,7 @@ export class EmbedHtmlBlockComponent extends EmbedBlockComponent<EmbedHtmlModel>
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
// this is required to prevent iframe from capturing pointer events
this.disposables.add(
@@ -80,11 +80,11 @@ export class EmbedHtmlBlockComponent extends EmbedBlockComponent<EmbedHtmlModel>
margin: 0;
}
</style>
${this.model.html}
${this.model.props.html}
`;
return this.renderEmbed(() => {
if (!this.model.html) {
if (!this.model.props.html) {
return html` <div class="affine-html-empty">Empty</div>`;
}
return html`
blocksuite/affine/blocks/block-embed/src/embed-iframe-block/components/embed-iframe-link-edit-popup.ts
+1 -1
View File
@@ -155,7 +155,7 @@ export class EmbedIframeLinkEditPopup extends SignalWatcher(
override render() {
const isInputEmpty = this._isInputEmpty();
const { url$ } = this.model;
const { url$ } = this.model.props;
return html`
<div class="embed-iframe-link-edit-popup">
blocksuite/affine/blocks/block-embed/src/embed-iframe-block/configs/toolbar.ts
+4 -2
View File
@@ -49,7 +49,8 @@ export const builtinToolbarConfig = {
);
if (!model) return;
const { title, caption, url, parent } = model;
const { title, caption, url } = model.props;
const { parent } = model;
const index = parent?.children.indexOf(model);
const yText = new Y.Text();
@@ -84,7 +85,8 @@ export const builtinToolbarConfig = {
);
if (!model) return;
const { url, caption, parent } = model;
const { url, caption } = model.props;
const { parent } = model;
const index = parent?.children.indexOf(model);
const flavour = 'affine:bookmark';
blocksuite/affine/blocks/block-embed/src/embed-iframe-block/embed-edgeless-iframe-block.ts
+2 -2
View File
@@ -37,8 +37,8 @@ export class EmbedEdgelessIframeBlockComponent extends toGfxBlockComponent(
return nothing;
}
const bound = Bound.deserialize(this.model.xywh$.value);
const scale = this.model.scale$.value;
const bound = Bound.deserialize(this.model.props.xywh$.value);
const scale = this.model.props.scale$.value;
const width = bound.w / scale;
const height = bound.h / scale;
const style = {
blocksuite/affine/blocks/block-embed/src/embed-iframe-block/embed-iframe-block.ts
+6 -6
View File
@@ -75,7 +75,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
}
open = () => {
const link = this.model.url;
const link = this.model.props.url;
window.open(link, '_blank');
};
@@ -95,7 +95,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
);
}
const { url } = this.model;
const { url } = this.model.props;
if (!url) {
throw new BlockSuiteError(
ErrorCode.ValueNotExists,
@@ -110,7 +110,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
]);
// if the embed data is not found, and the iframeUrl is not set, throw an error
const currentIframeUrl = this.model.iframeUrl;
const currentIframeUrl = this.model.props.iframeUrl;
if (!embedData && !currentIframeUrl) {
throw new BlockSuiteError(
ErrorCode.ValueNotExists,
@@ -172,7 +172,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
};
private readonly _renderIframe = () => {
const { iframeUrl } = this.model;
const { iframeUrl } = this.model.props;
const {
widthPercent,
heightInNote,
@@ -226,13 +226,13 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
this.contentEditable = 'false';
if (!this.model.iframeUrl) {
if (!this.model.props.iframeUrl) {
this.doc.withoutTransact(() => {
this.refreshData().catch(console.error);
});
} else {
// update iframe options, to ensure the iframe is rendered with the correct options
this._updateIframeOptions(this.model.url);
this._updateIframeOptions(this.model.props.url);
this.status$.value = 'success';
}
blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/configs/toolbar.ts
+5 -5
View File
@@ -44,10 +44,10 @@ export const builtinToolbarConfig = {
if (!component) return null;
const model = component.model;
if (!model.title) return null;
if (!model.props.title) return null;
const originalTitle =
ctx.workspace.getDoc(model.pageId)?.meta?.title || 'Untitled';
ctx.workspace.getDoc(model.props.pageId)?.meta?.title || 'Untitled';
return html`<affine-linked-doc-title
.title=${originalTitle}
@@ -99,10 +99,10 @@ export const builtinToolbarConfig = {
const model = component.model;
// same doc
if (model.pageId === ctx.store.id) return true;
if (model.props.pageId === ctx.store.id) return true;
// linking to block
if (referenceToNode(model)) return true;
if (referenceToNode(model.props)) return true;
return false;
},
@@ -197,7 +197,7 @@ export const builtinToolbarConfig = {
.actions=${actions}
.context=${ctx}
.toggle=${toggle}
.style$=${model.style$}
.style$=${model.props.style$}
></affine-card-style-dropdown-menu>`
)}`;
},
blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/embed-edgeless-linked-doc-block.ts
+2 -1
View File
@@ -20,7 +20,8 @@ export class EmbedEdgelessLinkedDocBlockComponent extends toEdgelessEmbedBlock(
EmbedLinkedDocBlockComponent
) {
override convertToEmbed = () => {
const { id, doc, caption, xywh } = this.model;
const { caption, xywh } = this.model.props;
const { doc, id } = this.model;
const style = 'syncedDoc';
const bound = Bound.deserialize(xywh);
blocksuite/affine/blocks/block-embed/src/embed-linked-doc-block/embed-linked-doc-block.ts
+16 -15
View File
@@ -102,7 +102,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
}
if (!this.isError) {
const cardStyle = this.model.style;
const cardStyle = this.model.props.style;
if (cardStyle === 'horizontal' || cardStyle === 'vertical') {
renderLinkedDocInCard(this);
}
@@ -118,7 +118,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
};
private readonly _setDocUpdatedAt = () => {
const meta = this.doc.workspace.meta.getDocMeta(this.model.pageId);
const meta = this.doc.workspace.meta.getDocMeta(this.model.props.pageId);
if (meta) {
const date = meta.updatedDate || meta.createDate;
this._docUpdatedAt = new Date(date);
@@ -130,7 +130,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
convertToEmbed = () => {
if (this._referenceToNode) return;
const { doc, caption, parent } = this.model;
const { caption } = this.model.props;
const { parent, doc } = this.model;
const index = parent?.children.indexOf(this.model);
const blockId = doc.addBlock(
@@ -181,7 +182,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
};
referenceInfo$ = computed(() => {
const { pageId, params, title$, description$ } = this.model;
const { pageId, params, title$, description$ } = this.model.props;
return cloneReferenceInfo({
pageId,
params,
@@ -229,7 +230,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
});
get docTitle() {
return this.model.title || this.linkedDoc?.meta?.title || 'Untitled';
return this.model.props.title || this.linkedDoc?.meta?.title || 'Untitled';
}
get editorMode() {
@@ -237,8 +238,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
}
get linkedDoc() {
return this.std.workspace.getDoc(this.model.pageId, {
id: this.model.pageId,
return this.std.workspace.getDoc(this.model.props.pageId, {
id: this.model.props.pageId,
});
}
@@ -275,8 +276,8 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._referenceToNode = referenceToNode(this.model);
this._cardStyle = this.model.props.style;
this._referenceToNode = referenceToNode(this.model.props);
this._load().catch(e => {
console.error(e);
@@ -325,14 +326,14 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
);
if (this._referenceToNode) {
this._linkedDocMode = this.model.params?.mode ?? 'page';
this._linkedDocMode = this.model.props.params?.mode ?? 'page';
} else {
const docMode = this.std.get(DocModeProvider);
this._linkedDocMode = docMode.getPrimaryMode(this.model.pageId);
this._linkedDocMode = docMode.getPrimaryMode(this.model.props.pageId);
this.disposables.add(
docMode.onPrimaryModeChange(mode => {
this._linkedDocMode = mode;
}, this.model.pageId)
}, this.model.props.pageId)
);
}
}
@@ -340,7 +341,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
this.disposables.add(
this.model.propsUpdated.subscribe(({ key }) => {
if (key === 'style') {
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
}
if (key === 'pageId' || key === 'style') {
this._load().catch(e => {
@@ -395,7 +396,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
? LoadingIcon
: this.icon$.value;
const title = isLoading ? 'Loading...' : this.title$;
const description = this.model.description$;
const description = this.model.props.description$;
const showDefaultNoteContent = isError || isLoading || isDeleted || isEmpty;
const defaultNoteContent = isError
@@ -503,7 +504,7 @@ export class EmbedLinkedDocBlockComponent extends EmbedBlockComponent<EmbedLinke
override updated() {
// update card style when linked doc deleted
const linkedDoc = this.linkedDoc;
const { xywh, style } = this.model;
const { xywh, style } = this.model.props;
const bound = Bound.deserialize(xywh);
if (linkedDoc && style === 'horizontalThin') {
bound.w = EMBED_CARD_WIDTH.horizontal;
blocksuite/affine/blocks/block-embed/src/embed-loom-block/embed-loom-block.ts
+6 -6
View File
@@ -27,7 +27,7 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
protected _isResizing = false;
open = () => {
let link = this.model.url;
let link = this.model.props.url;
if (!link.match(/^[a-zA-Z]+:\/\//)) {
link = 'https://' + link;
}
@@ -60,11 +60,11 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
if (!this.model.videoId) {
if (!this.model.props.videoId) {
this.doc.withoutTransact(() => {
const url = this.model.url;
const url = this.model.props.url;
const urlMatch = url.match(loomUrlRegex);
if (urlMatch) {
const [, videoId] = urlMatch;
@@ -75,7 +75,7 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
});
}
if (!this.model.description && !this.model.title) {
if (!this.model.props.description && !this.model.props.title) {
this.doc.withoutTransact(() => {
this.refreshData();
});
@@ -111,7 +111,7 @@ export class EmbedLoomBlockComponent extends EmbedBlockComponent<
}
override renderBlock() {
const { image, title = 'Loom', description, videoId } = this.model;
const { image, title = 'Loom', description, videoId } = this.model.props;
const loading = this.loading;
const theme = this.std.get(ThemeProvider).theme;
blocksuite/affine/blocks/block-embed/src/embed-loom-block/utils.ts
+1 -1
View File
@@ -12,7 +12,7 @@ export async function queryEmbedLoomData(
embedLoomModel: EmbedLoomModel,
signal?: AbortSignal
): Promise<Partial<EmbedLoomBlockUrlData>> {
const url = embedLoomModel.url;
const url = embedLoomModel.props.url;
const loomEmbedData: Partial<EmbedLoomBlockUrlData> =
await queryLoomOEmbedData(url, signal);
blocksuite/affine/blocks/block-embed/src/embed-synced-doc-block/configs/toolbar.ts
+1 -1
View File
@@ -65,7 +65,7 @@ export const builtinToolbarConfig = {
return {
...action,
disabled: shouldOpenInActiveView
? component.model.pageId === ctx.store.id
? component.model.props.pageId === ctx.store.id
: false,
when: allowed,
run: (_ctx: ToolbarContext) =>
blocksuite/affine/blocks/block-embed/src/embed-synced-doc-block/embed-edgeless-synced-doc-block.ts
+5 -4
View File
@@ -37,7 +37,7 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
position: 'relative',
width: '100%',
});
const modelScale = this.model.scale ?? 1;
const modelScale = this.model.props.scale ?? 1;
const bound = Bound.deserialize(this.model.xywh);
const width = bound.w / modelScale;
const height = bound.h / modelScale;
@@ -58,7 +58,7 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
}
const theme = this.isPageMode ? appTheme : edgelessTheme;
const scale = this.model.scale ?? 1;
const scale = this.model.props.scale ?? 1;
this.dataset.nestedEditor = '';
@@ -121,7 +121,8 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
};
override convertToCard = (aliasInfo?: AliasInfo) => {
const { id, doc, caption, xywh } = this.model;
const { id, doc, xywh } = this.model;
const { caption } = this.model.props;
const style = 'vertical';
const bound = Bound.deserialize(xywh);
@@ -155,7 +156,7 @@ export class EmbedEdgelessSyncedDocBlockComponent extends toEdgelessEmbedBlock(
};
override renderGfxBlock() {
const { style, xywh } = this.model;
const { style, xywh } = this.model.props;
const bound = Bound.deserialize(xywh);
this.embedContainerStyle.width = `${bound.w}px`;
blocksuite/affine/blocks/block-embed/src/embed-synced-doc-block/embed-synced-doc-block.ts
+13 -11
View File
@@ -280,7 +280,8 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
});
convertToCard = (aliasInfo?: AliasInfo) => {
const { doc, caption } = this.model;
const { doc } = this.model;
const { caption } = this.model.props;
const parent = doc.getParent(this.model);
if (!parent) {
@@ -343,14 +344,14 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
};
icon$ = computed(() => {
const { pageId, params } = this.model;
const { pageId, params } = this.model.props;
return this.std
.get(DocDisplayMetaProvider)
.icon(pageId, { params, referenced: true }).value;
});
open = (event?: Partial<DocLinkClickedEvent>) => {
const pageId = this.model.pageId;
const pageId = this.model.props.pageId;
if (pageId === this.doc.id) return;
this.std
@@ -366,7 +367,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
};
title$ = computed(() => {
const { pageId, params } = this.model;
const { pageId, params } = this.model.props;
return this.std
.get(DocDisplayMetaProvider)
.title(pageId, { params, referenced: true });
@@ -402,19 +403,20 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
}
get referenceInfo(): ReferenceInfo {
return cloneReferenceInfo(this.model);
return cloneReferenceInfo(this.model.props);
}
get syncedDoc() {
const options: GetBlocksOptions = { readonly: true };
if (this.isPageMode) options.query = this._pageFilter;
return this.std.workspace.getDoc(this.model.pageId, options);
return this.std.workspace.getDoc(this.model.props.pageId, options);
}
private _checkCycle() {
let editorHost: EditorHost | null = this.host;
while (editorHost && !this._cycle) {
this._cycle = !!editorHost && editorHost.doc.id === this.model.pageId;
this._cycle =
!!editorHost && editorHost.doc.id === this.model.props.pageId;
editorHost = editorHost.parentElement?.closest('editor-host') ?? null;
}
}
@@ -483,7 +485,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
}
private _setDocUpdatedAt() {
const meta = this.doc.workspace.meta.getDocMeta(this.model.pageId);
const meta = this.doc.workspace.meta.getDocMeta(this.model.props.pageId);
if (meta) {
const date = meta.updatedDate || meta.createDate;
this._docUpdatedAt = new Date(date);
@@ -496,7 +498,7 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
this.style.display = 'block';
this._load().catch(e => {
@@ -526,13 +528,13 @@ export class EmbedSyncedDocBlockComponent extends EmbedBlockComponent<EmbedSynce
if (!this.linkedMode) {
const docMode = this.std.get(DocModeProvider);
this.syncedDocMode = docMode.getPrimaryMode(this.model.pageId);
this.syncedDocMode = docMode.getPrimaryMode(this.model.props.pageId);
this._isEmptySyncedDoc = isEmptyDoc(this.syncedDoc, this.editorMode);
this.disposables.add(
docMode.onPrimaryModeChange(mode => {
this.syncedDocMode = mode;
this._isEmptySyncedDoc = isEmptyDoc(this.syncedDoc, this.editorMode);
}, this.model.pageId)
}, this.model.props.pageId)
);
}
blocksuite/affine/blocks/block-embed/src/embed-youtube-block/embed-youtube-block.ts
+6 -6
View File
@@ -30,7 +30,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
protected _isResizing = false;
open = () => {
let link = this.model.url;
let link = this.model.props.url;
if (!link.match(/^[a-zA-Z]+:\/\//)) {
link = 'https://' + link;
}
@@ -63,11 +63,11 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
override connectedCallback() {
super.connectedCallback();
this._cardStyle = this.model.style;
this._cardStyle = this.model.props.style;
if (!this.model.videoId) {
if (!this.model.props.videoId) {
this.doc.withoutTransact(() => {
const url = this.model.url;
const url = this.model.props.url;
const urlMatch = url.match(youtubeUrlRegex);
if (urlMatch) {
const [, videoId] = urlMatch;
@@ -78,7 +78,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
});
}
if (!this.model.description && !this.model.title) {
if (!this.model.props.description && !this.model.props.title) {
this.doc.withoutTransact(() => {
this.refreshData();
});
@@ -125,7 +125,7 @@ export class EmbedYoutubeBlockComponent extends EmbedBlockComponent<
creator,
creatorImage,
videoId,
} = this.model;
} = this.model.props;
const loading = this.loading;
const theme = this.std.get(ThemeProvider).theme;
blocksuite/affine/blocks/block-embed/src/embed-youtube-block/utils.ts
+1 -1
View File
@@ -12,7 +12,7 @@ export async function queryEmbedYoutubeData(
linkPreviewer: LinkPreviewerService,
signal?: AbortSignal
): Promise<Partial<EmbedYoutubeBlockUrlData>> {
const url = embedYoutubeModel.url;
const url = embedYoutubeModel.props.url;
const [videoOpenGraphData, videoOEmbedData] = await Promise.all([
linkPreviewer.query(url, signal),