diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts index b6c0b42f92..bc09d49dda 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-action/shared/workspace-action-menu/workspace-action-menu.element.ts @@ -6,37 +6,66 @@ import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registr import type { UmbExtensionElementInitializer } from '@umbraco-cms/backoffice/extension-api'; import { UmbExtensionsElementInitializer } from '@umbraco-cms/backoffice/extension-api'; import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element'; +import { UMB_WORKSPACE_CONTEXT } from '@umbraco-cms/backoffice/workspace'; @customElement('umb-workspace-action-menu') export class UmbWorkspaceActionMenuElement extends UmbLitElement { + #workspaceContext?: typeof UMB_WORKSPACE_CONTEXT.TYPE; #actionsInitializer?: UmbExtensionsElementInitializer; - #workspaceActionAlias: Array = []; @property({ type: Array }) - set workspaceActionAlias(alias: Array) { - // If there is an existing initializer, we need to dispose it. - this.#actionsInitializer?.destroy(); + workspaceActionAlias: Array = []; - this.#workspaceActionAlias = alias; + @state() + private _actions: Array> = []; + + @state() + _popoverOpen = false; + + constructor() { + super(); + + this.consumeContext(UMB_WORKSPACE_CONTEXT, (context) => { + this.#workspaceContext = context; + this.#initialise(); + }); + } + + disconnectedCallback(): void { + super.disconnectedCallback(); + this.#actionsInitializer?.destroy(); + } + + #initialise() { + if (!this.#workspaceContext) throw new Error('No workspace context'); + + const unique = this.#workspaceContext.getUnique(); + const entityType = this.#workspaceContext.getEntityType(); this.#actionsInitializer = new UmbExtensionsElementInitializer( this, umbExtensionsRegistry, 'workspaceActionMenuItem', // TODO: Stop using string for 'workspaceActionMenuItem', we need to start using Const. - (action) => action.meta.workspaceActionAliases.some((alias) => this.#workspaceActionAlias.includes(alias)), + (action) => + action.meta.workspaceActionAliases.some((alias) => this.workspaceActionAlias.includes(alias)) && + action.meta.entityTypes.includes(entityType), (ctrls) => { + ctrls.forEach((ctrl) => { + ctrl.properties = { unique, entityType }; + }); this._actions = ctrls; }, - 'extensionsInitializer', - 'uui-menu-item', + undefined, + 'umb-entity-action', ); } - get workspaceActionAlias() { - return this.#workspaceActionAlias; - } - @state() - private _actions: Array> = []; + // TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet. + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + #onPopoverToggle(event: ToggleEvent) { + this._popoverOpen = event.newState === 'open'; + } render() { return this._actions.length > 0 @@ -47,11 +76,17 @@ export class UmbWorkspaceActionMenuElement extends UmbLitElement { look="secondary" label="Expand" compact> - + - + - + + ${repeat( + this._actions, + (action) => action.alias, + (action) => action.component, + )} + `