From e602e74b908ac8b1c01e012c5bc7d72601f9b49b Mon Sep 17 00:00:00 2001
From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
Date: Mon, 26 Jun 2023 10:18:18 +0200
Subject: [PATCH] check for null values

---
 ...-tiny-mce-toolbar-configuration.element.ts | 21 +++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/property-editors/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/property-editors/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.element.ts
index 1ea50f1550..cf5efd2457 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/property-editors/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/property-editors/uis/tiny-mce/config/toolbar/property-editor-ui-tiny-mce-toolbar-configuration.element.ts
@@ -24,17 +24,26 @@ export class UmbPropertyEditorUITinyMceToolbarConfigurationElement
 	implements UmbPropertyEditorExtensionElement
 {
 	@property()
-	set value(value: string[]) {
-		this.#selectedValues = value;
+	set value(value: string | string[] | null) {
+		if (!value) return;
+
+		if (typeof value === 'string') {
+			this.#selectedValues = value.split(',').filter(x => x.length > 0);
+		} else if (Array.isArray(value)) {
+			this.#selectedValues = value;
+		} else {
+			this.#selectedValues = [];
+			return;
+		}
 
 		// Migrations
-		if (value.includes('ace')) {
-			this.#selectedValues = value.filter((v) => v !== 'ace');
+		if (this.#selectedValues.includes('ace')) {
+			this.#selectedValues = this.#selectedValues.filter((v) => v !== 'ace');
 			this.#selectedValues.push('sourcecode');
 		}
 
 		this._toolbarConfig.forEach((v) => {
-			v.selected = value.includes(v.alias);
+			v.selected = this.#selectedValues.includes(v.alias);
 		});
 	}
 
@@ -105,7 +114,7 @@ export class UmbPropertyEditorUITinyMceToolbarConfigurationElement
 				this._toolbarConfig,
 				(v) => html`<li>
 					<uui-checkbox value=${v.alias} ?checked=${v.selected} @change=${this.onChange}>
-						<uui-icon .svg=${tinyIconSet.icons[v.icon ?? 'alignjustify']}></uui-icon>
+						<uui-icon .svg=${tinyIconSet?.icons[v.icon ?? 'alignjustify']}></uui-icon>
 						${v.label}
 					</uui-checkbox>
 				</li>`