From fac4af80cca8a6ba78edbeb6392c1ac21df0fc8a Mon Sep 17 00:00:00 2001
From: Lone Iversen <108085781+loivsen@users.noreply.github.com>
Date: Mon, 16 Oct 2023 13:52:17 +0200
Subject: [PATCH] fix link issues

---
 .../plugins/tiny-mce-linkpicker.plugin.ts     | 30 ++++++++++---------
 1 file changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/property-editor/uis/tiny-mce/plugins/tiny-mce-linkpicker.plugin.ts b/src/Umbraco.Web.UI.Client/src/packages/core/property-editor/uis/tiny-mce/plugins/tiny-mce-linkpicker.plugin.ts
index 85d2b1d3a4..1e000b870a 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/property-editor/uis/tiny-mce/plugins/tiny-mce-linkpicker.plugin.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/property-editor/uis/tiny-mce/plugins/tiny-mce-linkpicker.plugin.ts
@@ -76,26 +76,22 @@ export default class UmbTinyMceLinkPickerPlugin extends UmbTinyMcePluginBase {
 
 		//if we already have a link selected, we want to pass that data over to the dialog
 		const currentTarget: UmbLinkPickerLink = {
-			name: this.#anchorElement.textContent,
-			url: this.#anchorElement.getAttribute('href') ?? '',
+			name: this.#anchorElement.title || this.#anchorElement.textContent,
 			target: this.#anchorElement.target,
+			queryString: `${this.#anchorElement.search}${this.#anchorElement.hash}`,
 		};
 
-		// drop the lead char from the anchor text, if it has a value
-		const anchorVal = this.#anchorElement.dataset.anchor;
-		if (anchorVal) {
-			currentTarget.queryString = anchorVal.substring(1);
-		}
-
-		if (currentTarget.url?.includes('localLink:')) {
-			currentTarget.udi =
-				currentTarget.url?.substring(currentTarget.url.indexOf(':') + 1, currentTarget.url.lastIndexOf('}')) ?? '';
+		if (this.#anchorElement.href.includes('localLink:')) {
+			const href = this.#anchorElement.getAttribute('href')!;
+			currentTarget.udi = href.split('localLink:')[1].slice(0, -1);
+		} else if (this.#anchorElement.host.length) {
+			currentTarget.url = this.#anchorElement.protocol ? this.#anchorElement.protocol + '//' : undefined;
+			currentTarget.url += this.#anchorElement.host + this.#anchorElement.pathname;
 		}
 
 		this.#openLinkPicker(currentTarget);
 	}
 
-	// TODO => get anchors to provide to link picker?
 	async #openLinkPicker(currentTarget?: UmbLinkPickerLink) {
 		const modalHandler = this.#modalContext?.open(UMB_LINK_PICKER_MODAL, {
 			config: {
@@ -117,7 +113,9 @@ export default class UmbTinyMceLinkPickerPlugin extends UmbTinyMcePluginBase {
 	//Create a json obj used to create the attributes for the tag
 	// TODO => where has rel gone?
 	#createElemAttributes() {
-		const a: AnchorElementAttributes = Object.assign({}, this.#linkPickerData?.link, { 'data-anchor': null });
+		// Attribute 'name' because of linkPickerData. It should be 'title' .
+		const { name, ...linkPickerData } = this.#linkPickerData!.link;
+		const a: AnchorElementAttributes = Object.assign({}, linkPickerData);
 
 		// always need to map back to href for tinymce to render correctly
 		// do this first as checking querystring below may modify the href property
@@ -125,6 +123,10 @@ export default class UmbTinyMceLinkPickerPlugin extends UmbTinyMcePluginBase {
 			a.href = this.#linkPickerData.link.url;
 		}
 
+		if (this.#linkPickerData?.link.name) {
+			a.title = name;
+		}
+
 		if (this.#linkPickerData?.link.queryString?.startsWith('#')) {
 			a['data-anchor'] = this.#linkPickerData?.link.queryString;
 			a.href += this.#linkPickerData?.link.queryString;
@@ -185,7 +187,7 @@ export default class UmbTinyMceLinkPickerPlugin extends UmbTinyMcePluginBase {
 			}
 		}
 
-		if (!this.#linkPickerData?.link.url && !this.#linkPickerData?.link.queryString) {
+		if (!this.#linkPickerData?.link.url && !this.#linkPickerData?.link.queryString && !this.#linkPickerData?.link.udi) {
 			this.editor.execCommand('unlink');
 			return;
 		}