diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-content-no-router.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-content-no-router.element.ts index c1fd3ba23194..303f0f0cd159 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-content-no-router.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-content-no-router.element.ts @@ -14,7 +14,7 @@ import type { UmbWorkspaceViewElement } from '@umbraco-cms/backoffice/workspace' */ @customElement('umb-block-workspace-view-edit-content-no-router') export class UmbBlockWorkspaceViewEditContentNoRouterElement extends UmbLitElement implements UmbWorkspaceViewElement { - //private _hasRootProperties = false; + // private _hasRootProperties = false; @state() private _hasRootGroups = false; @@ -25,9 +25,6 @@ export class UmbBlockWorkspaceViewEditContentNoRouterElement extends UmbLitEleme @state() private _activeTabKey?: string | null | undefined; - //@state() - //private _activeTabName?: string | null | undefined; - #blockWorkspace?: typeof UMB_BLOCK_WORKSPACE_CONTEXT.TYPE; #tabsStructureHelper = new UmbContentTypeContainerStructureHelper(this); @@ -67,46 +64,45 @@ export class UmbBlockWorkspaceViewEditContentNoRouterElement extends UmbLitEleme #checkDefaultTabName() { if (!this._tabs || !this.#blockWorkspace) return; - // Find the default tab to grab: + // Find the default tab to grab if (this._activeTabKey === undefined) { if (this._hasRootGroups) { - //this._activeTabName = null; this._activeTabKey = null; } else if (this._tabs.length > 0) { - //this._activeTabName = this._tabs[0].name; - this._activeTabKey = this._tabs[0].key; + const tab = this._tabs[0]; + this._activeTabKey = tab.ownerId ?? tab.ids[0]; } } } - #setTabName(tabName: string | undefined | null, tabKey: string | null | undefined) { - //this._activeTabName = tabName; + #setTabKey(tabKey: string | null | undefined) { this._activeTabKey = tabKey; } override render() { if (!this._tabs) return; + return html` ${this._tabs.length > 1 || (this._tabs.length === 1 && this._hasRootGroups) - ? html` + ? html` ${this._hasRootGroups && this._tabs.length > 0 - ? html` - this.#setTabName(null, null)} - >Content - ` + ? html` this.#setTabKey(null)} + >Content` : nothing} ${repeat( this._tabs, (tab) => tab.name, (tab) => { + const tabKey = tab.ownerId ?? tab.ids[0]; + return html` this.#setTabName(tab.name, tab.key)} + label=${this.localize.string(tab.name ?? '#general_unnamed')} + .active=${this._activeTabKey === tabKey} + @click=${() => this.#setTabKey(tabKey)} >${tab.name}`; },