From 0fadd802c8f98415ab21e5fe3744ca9cd3a0f4aa Mon Sep 17 00:00:00 2001
From: leekelleher <leekelleher@gmail.com>
Date: Thu, 29 Feb 2024 17:44:46 +0000
Subject: [PATCH] Refactored MultipleTextString's sorter code

---
 .../input-multiple-text-string.element.ts     | 29 ++++++++-----------
 1 file changed, 12 insertions(+), 17 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/multiple-text-string-input/input-multiple-text-string.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/multiple-text-string-input/input-multiple-text-string.element.ts
index bbc54b174e..93b381c130 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/components/multiple-text-string-input/input-multiple-text-string.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/multiple-text-string-input/input-multiple-text-string.element.ts
@@ -1,31 +1,26 @@
 import type { UmbInputMultipleTextStringItemElement } from './input-multiple-text-string-item.element.js';
 import { css, html, nothing, repeat, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
 import { FormControlMixin } from '@umbraco-cms/backoffice/external/uui';
-import type { UmbInputEvent, UmbDeleteEvent } from '@umbraco-cms/backoffice/event';
 import { UmbChangeEvent } from '@umbraco-cms/backoffice/event';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
-import type { UmbSorterConfig } from '@umbraco-cms/backoffice/sorter';
 import { UmbSorterController } from '@umbraco-cms/backoffice/sorter';
-
-const SORTER_CONFIG: UmbSorterConfig<MultipleTextStringValueItem> = {
-	getUniqueOfElement: (element) => {
-		return element.getAttribute('data-sort-entry-id');
-	},
-	getUniqueOfModel: (modelEntry) => {
-		return modelEntry.value;
-	},
-	identifier: 'Umb.SorterIdentifier.ColorEditor',
-	itemSelector: 'umb-input-multiple-text-string-item',
-	containerSelector: '#sorter-wrapper',
-};
+import type { UmbInputEvent, UmbDeleteEvent } from '@umbraco-cms/backoffice/event';
 
 /**
  * @element umb-input-multiple-text-string
  */
 @customElement('umb-input-multiple-text-string')
 export class UmbInputMultipleTextStringElement extends FormControlMixin(UmbLitElement) {
-	#prevalueSorter = new UmbSorterController(this, {
-		...SORTER_CONFIG,
+	#sorter = new UmbSorterController(this, {
+		getUniqueOfElement: (element) => {
+			return element.getAttribute('data-sort-entry-id');
+		},
+		getUniqueOfModel: (modelEntry: string) => {
+			return modelEntry;
+		},
+		identifier: 'Umb.SorterIdentifier.ColorEditor',
+		itemSelector: 'umb-input-multiple-text-string-item',
+		containerSelector: '#sorter-wrapper',
 		onChange: ({ model }) => {
 			const oldValue = this._items;
 			this._items = model;
@@ -124,7 +119,7 @@ export class UmbInputMultipleTextStringElement extends FormControlMixin(UmbLitEl
 		// TODO: when we have a way to overwrite the missing value validator we can remove this
 		this.value = items?.length > 0 ? 'some value' : '';
 		this._items = items ?? [];
-		this.#prevalueSorter.setModel(this.items);
+		this.#sorter.setModel(this.items);
 	}
 
 	// TODO: Some inputs might not have a value that is either FormDataEntryValue or FormData.