feat(editor): embed iframe error status card in surface (#10869)

To close [BS-2806](https://linear.app/affine-design/issue/BS-2806/iframe-embed-block-edgeless-loading-and-error-status)
This commit is contained in:
donteatfriedrice
2025-03-16 09:05:04 +00:00
parent 7ecb1f510d
commit d7d512084e
4 changed files with 86 additions and 39 deletions

View File

@@ -16,10 +16,10 @@ import { html, nothing } from 'lit';
import { type ClassInfo, classMap } from 'lit/directives/class-map.js';
import { ifDefined } from 'lit/directives/if-defined.js';
import type { EmbedIframeLoadingCardOptions } from './components/embed-iframe-loading-card.js';
import type { IframeOptions } from './extension/embed-iframe-config.js';
import { EmbedIframeService } from './extension/embed-iframe-service.js';
import { embedIframeBlockStyles } from './style.js';
import type { EmbedIframeStatusCardOptions } from './types.js';
export type EmbedIframeStatus = 'idle' | 'loading' | 'success' | 'error';
const DEFAULT_IFRAME_HEIGHT = 152;
@@ -75,7 +75,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
return flag ?? false;
}
get _loadingCardOptions(): EmbedIframeLoadingCardOptions {
get _statusCardOptions(): EmbedIframeStatusCardOptions {
return this.inSurface
? { layout: 'vertical' }
: { layout: 'horizontal', height: 114 };
@@ -213,7 +213,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
if (this.isLoading$.value) {
return html`<embed-iframe-loading-card
.std=${this.std}
.options=${this._loadingCardOptions}
.options=${this._statusCardOptions}
></embed-iframe-loading-card>`;
}
@@ -223,6 +223,7 @@ export class EmbedIframeBlockComponent extends CaptionedBlockComponent<EmbedIfra
.model=${this.model}
.onRetry=${this._handleRetry}
.std=${this.std}
.options=${this._statusCardOptions}
></embed-iframe-error-card>`;
}