add button state to workspace action

This commit is contained in:
Julia Gru
2023-07-20 15:43:46 +02:00
parent 508ede8503
commit 9d7d32abf1

View File

@@ -1,7 +1,7 @@
import { UmbWorkspaceAction } from './index.js';
import { css, html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
import { css, html, customElement, property, state, query } from '@umbraco-cms/backoffice/external/lit';
import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
import type { UUIButtonState } from '@umbraco-cms/backoffice/external/uui';
import type { UUIButtonElement, UUIButtonState } from '@umbraco-cms/backoffice/external/uui';
import { UmbExecutedEvent } from '@umbraco-cms/backoffice/events';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
import type { ManifestWorkspaceAction } from '@umbraco-cms/backoffice/extension-registry';
@@ -34,19 +34,28 @@ export class UmbWorkspaceActionElement extends UmbLitElement {
#api?: UmbWorkspaceAction;
private async _onClick() {
if (!this.#api) return;
await this.#api.execute();
this._buttonState = 'waiting';
try {
if (!this.#api) throw new Error('No api defined');
await this.#api.execute();
this._buttonState = 'success';
} catch (error) {
this._buttonState = 'failed';
}
this.dispatchEvent(new UmbExecutedEvent());
}
render() {
return html`
<uui-button
id="action-button"
@click=${this._onClick}
look=${this.manifest?.meta.look || 'default'}
color=${this.manifest?.meta.color || 'default'}
label=${this.manifest?.meta.label || ''}
.state="${this._buttonState}"></uui-button>
.state=${this._buttonState}></uui-button>
`;
}