general expose button for grid

src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-block/block-grid-block.element.ts

@@ -14,8 +14,6 @@ import '../ref-grid-block/index.js';
 @customElement('umb-block-grid-block')
 export class UmbBlockGridBlockElement extends UmbLitElement {
 	//
-	#context?: typeof UMB_BLOCK_GRID_ENTRY_CONTEXT.TYPE;
-
 	@property({ attribute: false })
 	label?: string;
 
@@ -31,35 +29,10 @@ export class UmbBlockGridBlockElement extends UmbLitElement {
 	@property({ attribute: false })
 	content?: UmbBlockDataType;
 
-	@state()
-	_ownerContentTypeName?: string;
-
-	constructor() {
-		super();
-		this.consumeContext(UMB_BLOCK_GRID_ENTRY_CONTEXT, (context) => {
-			this.#context = context;
-			this.observe(context.contentElementTypeName, (name) => {
-				this._ownerContentTypeName = name;
-			});
-		});
-	}
-
-	#expose = () => {
-		this.#context?.expose();
-	};
-
 	override render() {
 		return html`<umb-ref-grid-block
 			standalone
 			href=${(this.config?.showContentEdit ? this.config?.editContentPath : undefined) ?? ''}>
-			${this.config?.showContentEdit === false && this.unpublished
-				? html`
-						<uui-button slot="action" @click=${this.#expose}
-							><uui-icon name="icon-add"></uui-icon>
-							<umb-localize key="blockEditor_createThisFor" .args=${[this._ownerContentTypeName]}></umb-localize
-						></uui-button>
-					`
-				: nothing}
 			<umb-icon slot="icon" .name=${this.icon}></umb-icon>
 			<umb-ufm-render slot="name" inline .markdown=${this.label} .value=${this.content}></umb-ufm-render>
 			<umb-block-grid-areas-container slot="areas"></umb-block-grid-areas-container>

src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts

@@ -61,6 +61,9 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
 	@state()
 	_contentTypeAlias?: string;
 
+	@state()
+	_contentTypeName?: string;
+
 	@state()
 	_columnSpan?: number;
 
@@ -325,6 +328,15 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
 			},
 			'contentElementTypeAlias',
 		);
+		this.observe(
+			this.#context.contentElementTypeName,
+			(contentElementTypeName) => {
+				if (contentElementTypeName) {
+					this._contentTypeName = contentElementTypeName;
+				}
+			},
+			'contentElementTypeName',
+		);
 
 		this.#callUpdateInlineCreateButtons();
 	}
@@ -336,6 +348,10 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
 		}
 	}
 
+	#expose = () => {
+		this.#context.expose();
+	};
+
 	#callUpdateInlineCreateButtons() {
 		clearTimeout(this.#renderTimeout);
 		this.#renderTimeout = setTimeout(this.#updateInlineCreateButtons, 100) as unknown as number;
@@ -481,20 +497,25 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
 	}
 
 	#renderEditAction() {
-		return html`
-			${this._showContentEdit && this._workspaceEditContentPath
+		return this._showContentEdit && this._workspaceEditContentPath
+			? html`<uui-button
+					label="edit"
+					look="secondary"
+					color=${this._contentInvalid ? 'danger' : ''}
+					href=${this._workspaceEditContentPath}>
+					<uui-icon name="icon-edit"></uui-icon>
+					${this._contentInvalid
+						? html`<uui-badge attention color="danger" label="Invalid content">!</uui-badge>`
+						: nothing}
+				</uui-button>`
+			: this._showContentEdit === false && this._exposed === false
 				? html`<uui-button
-						label="edit"
+						@click=${this.#expose}
+						label=${this.localize.term('blockEditor_createThisFor', this._contentTypeName)}
 						look="secondary"
-						color=${this._contentInvalid ? 'danger' : ''}
-						href=${this._workspaceEditContentPath}>
-						<uui-icon name="icon-edit"></uui-icon>
-						${this._contentInvalid
-							? html`<uui-badge attention color="danger" label="Invalid content">!</uui-badge>`
-							: nothing}
-					</uui-button>`
-				: nothing}
-		`;
+						><uui-icon name="icon-add"></uui-icon
+					></uui-button>`
+				: nothing;
 	}
 
 	#renderEditSettingsAction() {