From 34cfa3cb625cd9cbb14f45c8de0ec9aba74f7d97 Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <madsr@hey.com>
Date: Tue, 1 Apr 2025 12:48:32 +0200
Subject: [PATCH] only render segments if culture is created

---
 .../src/packages/core/variant/types.ts        |  1 +
 ...ace-split-view-variant-selector.element.ts | 30 +++++++++++++------
 2 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/variant/types.ts b/src/Umbraco.Web.UI.Client/src/packages/core/variant/types.ts
index 68a03c11d9..575b325a47 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/variant/types.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/variant/types.ts
@@ -22,6 +22,7 @@ export interface UmbEntityVariantModel {
 	segment: string | null;
 	createDate: string | null;
 	updateDate: string | null;
+	state?: string | null;
 }
 
 /** @deprecated use `UmbEntityVariantModel` instead */
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-split-view/workspace-split-view-variant-selector.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-split-view/workspace-split-view-variant-selector.element.ts
index e3ac2f07f7..d365fcf104 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-split-view/workspace-split-view-variant-selector.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/workspace/components/workspace-split-view/workspace-split-view-variant-selector.element.ts
@@ -260,8 +260,14 @@ export class UmbWorkspaceSplitViewVariantSelectorElement<
 		return this._expandedVariants.find((expandedVariant) => expandedVariant.equal(variantId)) !== undefined;
 	}
 
-	#getSegmentVariantOptionsForCulture(variantId: UmbVariantId): Array<VariantOptionModelType> {
-		return this._variantOptions.filter((variant) => variant.culture === variantId.culture && variant.segment !== null);
+	#getSegmentVariantOptionsForCulture(
+		variantOption: VariantOptionModelType,
+		variantId: UmbVariantId,
+	): Array<VariantOptionModelType> {
+		const segmentVariants = this._variantOptions.filter(
+			(variant) => variant.culture === variantId.culture && variant.segment !== null,
+		);
+		return variantOption.variant ? segmentVariants : [];
 	}
 
 	override render() {
@@ -323,12 +329,8 @@ export class UmbWorkspaceSplitViewVariantSelectorElement<
 		const variantId = UmbVariantId.Create(variantOption);
 		return html`
 			<li class="variant ${this.#isVariantActive(variantId) ? 'selected' : ''}">
-				<uui-button
-					class="expand-area"
-					@click=${(event: PointerEvent) => this.#toggleExpansion(event, variantId)}
-					compact>
-					<uui-symbol-expand .open=${this.#isExpanded(variantId)}></uui-symbol-expand>
-				</uui-button>
+				<div class="expand-area">${this.#renderExpandToggle(variantOption, variantId)}</div>
+
 				<button
 					class="variant-area switch-button ${this.#isCreateMode(variantOption) ? 'add-mode' : ''} ${this.#isReadOnly(
 						variantId.culture,
@@ -351,7 +353,7 @@ export class UmbWorkspaceSplitViewVariantSelectorElement<
 				${this.#isExpanded(variantId)
 					? html`
 							<ul class="children-area">
-								${this.#getSegmentVariantOptionsForCulture(variantId).map((option) =>
+								${this.#getSegmentVariantOptionsForCulture(variantOption, variantId).map((option) =>
 									this.#renderSegmentVariantOption(option),
 								)}
 							</ul>
@@ -361,6 +363,16 @@ export class UmbWorkspaceSplitViewVariantSelectorElement<
 		`;
 	}
 
+	#renderExpandToggle(variantOption: VariantOptionModelType, variantId: UmbVariantId) {
+		if (!variantOption.variant?.state) return nothing;
+
+		return html`
+			<uui-button @click=${(event: PointerEvent) => this.#toggleExpansion(event, variantId)} compact>
+				<uui-symbol-expand .open=${this.#isExpanded(variantId)}></uui-symbol-expand>
+			</uui-button>
+		`;
+	}
+
 	#renderSegmentVariantOption(variantOption: VariantOptionModelType) {
 		const variantId = UmbVariantId.Create(variantOption);