From 5f63a1d4244eb584ea564922aefca6e00f85fffa Mon Sep 17 00:00:00 2001
From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
Date: Mon, 18 Mar 2024 11:56:34 +0100
Subject: [PATCH] show a box if there are no variants

---
 .../src/assets/lang/en-us.ts                  |  1 +
 ...ocument-variant-language-picker.element.ts | 34 +++++++++++--------
 2 files changed, 20 insertions(+), 15 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/assets/lang/en-us.ts b/src/Umbraco.Web.UI.Client/src/assets/lang/en-us.ts
index d27605f3d5..6e91f79474 100644
--- a/src/Umbraco.Web.UI.Client/src/assets/lang/en-us.ts
+++ b/src/Umbraco.Web.UI.Client/src/assets/lang/en-us.ts
@@ -255,6 +255,7 @@ export default {
 			'Publish <strong>%0%</strong> and all content items underneath and thereby making their content publicly available.',
 		publishDescendantsWithVariantsHelp:
 			'Publish variants and variants of same type underneath and thereby making their content publicly available.',
+		noVariantsToProcess: 'There are no available variants',
 		releaseDate: 'Publish at',
 		unpublishDate: 'Unpublish at',
 		removeDate: 'Clear Date',
diff --git a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/modals/shared/document-variant-language-picker.element.ts b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/modals/shared/document-variant-language-picker.element.ts
index ee08f2f140..d51d6610ea 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/documents/documents/modals/shared/document-variant-language-picker.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/documents/documents/modals/shared/document-variant-language-picker.element.ts
@@ -30,21 +30,25 @@ export class UmbDocumentVariantLanguagePickerElement extends UmbLitElement {
 	_selection: Array<string> = [];
 
 	render() {
-		return repeat(
-			this.variantLanguageOptions,
-			(option) => option.unique,
-			(option) => html`
-				<uui-menu-item
-					selectable
-					label=${option.variant?.name ?? option.language.name}
-					@selected=${() => this.selectionManager.select(option.unique)}
-					@deselected=${() => this.selectionManager.deselect(option.unique)}
-					?selected=${this._selection.includes(option.unique)}>
-					<uui-icon slot="icon" name="icon-globe"></uui-icon>
-					${UmbDocumentVariantLanguagePickerElement.renderLabel(option)}
-				</uui-menu-item>
-			`,
-		);
+		return this.variantLanguageOptions.length
+			? repeat(
+					this.variantLanguageOptions,
+					(option) => option.unique,
+					(option) => html`
+						<uui-menu-item
+							selectable
+							label=${option.variant?.name ?? option.language.name}
+							@selected=${() => this.selectionManager.select(option.unique)}
+							@deselected=${() => this.selectionManager.deselect(option.unique)}
+							?selected=${this._selection.includes(option.unique)}>
+							<uui-icon slot="icon" name="icon-globe"></uui-icon>
+							${UmbDocumentVariantLanguagePickerElement.renderLabel(option)}
+						</uui-menu-item>
+					`,
+				)
+			: html`<uui-box>
+					<umb-localize key="content_noVariantsToProcess">There are no available variants</umb-localize>
+				</uui-box>`;
 	}
 
 	static renderLabel(option: UmbDocumentVariantOptionModel) {