disable duplicate button when nothing is selected

Author: madsrasmussen

src/packages/core/tree/entity-actions/duplicate-to/modal/duplicate-to-modal.element.ts

@@ -1,5 +1,5 @@
 import type { UmbDuplicateToModalData, UmbDuplicateToModalValue } from './duplicate-to-modal.token.js';
-import { html, customElement, nothing } from '@umbraco-cms/backoffice/external/lit';
+import { html, customElement, nothing, state } from '@umbraco-cms/backoffice/external/lit';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
 
@@ -9,11 +9,17 @@ import type { UmbTreeElement } from '@umbraco-cms/backoffice/tree';
 const elementName = 'umb-duplicate-to-modal';
 @customElement(elementName)
 export class UmbDuplicateToModalElement extends UmbModalBaseElement<UmbDuplicateToModalData, UmbDuplicateToModalValue> {
+	@state()
+	_destinationUnique?: string | null;
+
 	#onTreeSelectionChange(event: UmbSelectionChangeEvent) {
 		const target = event.target as UmbTreeElement;
 		const selection = target.getSelection();
-		if (selection.length === 0) throw new Error('Selection is required');
-		this.updateValue({ destination: { unique: selection[0] } });
+		this._destinationUnique = selection[0];
+
+		if (this._destinationUnique || this._destinationUnique === null) {
+			this.updateValue({ destination: { unique: this._destinationUnique } });
+		}
 	}
 
 	render() {
@@ -43,7 +49,8 @@ export class UmbDuplicateToModalElement extends UmbModalBaseElement<UmbDuplicate
 				color="positive"
 				look="primary"
 				label="Duplicate"
-				@click=${this._submitModal}></uui-button>
+				@click=${this._submitModal}
+				?disabled=${this._destinationUnique === undefined}></uui-button>
 		`;
 	}
 

src/packages/documents/documents/entity-actions/duplicate/modal/duplicate-document-modal.element.ts

@@ -3,7 +3,7 @@ import type {
 	UmbDuplicateDocumentModalData,
 	UmbDuplicateDocumentModalValue,
 } from './duplicate-document-modal.token.js';
-import { html, customElement, nothing, css } from '@umbraco-cms/backoffice/external/lit';
+import { html, customElement, nothing, css, state } from '@umbraco-cms/backoffice/external/lit';
 import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
 import { UmbModalBaseElement } from '@umbraco-cms/backoffice/modal';
 
@@ -17,11 +17,17 @@ export class UmbDocumentDuplicateToModalElement extends UmbModalBaseElement<
 	UmbDuplicateDocumentModalData,
 	UmbDuplicateDocumentModalValue
 > {
+	@state()
+	_destinationUnique?: string | null;
+
 	#onTreeSelectionChange(event: UmbSelectionChangeEvent) {
 		const target = event.target as UmbTreeElement;
 		const selection = target.getSelection();
-		if (selection.length === 0) throw new Error('Selection is required');
-		this.updateValue({ destination: { unique: selection[0] } });
+		this._destinationUnique = selection[0];
+
+		if (this._destinationUnique || this._destinationUnique === null) {
+			this.updateValue({ destination: { unique: this._destinationUnique } });
+		}
 	}
 
 	#onRelateToOriginalChange(event: UUIBooleanInputEvent) {
@@ -72,7 +78,8 @@ export class UmbDocumentDuplicateToModalElement extends UmbModalBaseElement<
 				color="positive"
 				look="primary"
 				label="Duplicate"
-				@click=${this._submitModal}></uui-button>
+				@click=${this._submitModal}
+				?disabled=${this._destinationUnique === undefined}></uui-button>
 		`;
 	}