diff --git a/src/Umbraco.Web.UI.Client/src/assets/lang/en.ts b/src/Umbraco.Web.UI.Client/src/assets/lang/en.ts index 847784b65ddf..f7a62dc34638 100644 --- a/src/Umbraco.Web.UI.Client/src/assets/lang/en.ts +++ b/src/Umbraco.Web.UI.Client/src/assets/lang/en.ts @@ -2799,7 +2799,7 @@ export default { modalSource: 'Source', modalManual: 'Manual', modalAnchorValidationMessage: - 'Please enter an anchor or querystring, or select a published document or media item, or manually configure the URL.', + 'Please enter an anchor or querystring, select a document or media item, or manually configure the URL.', resetUrlHeadline: 'Reset URL?', resetUrlMessage: 'Are you sure you want to reset this URL?', resetUrlLabel: 'Reset', diff --git a/src/Umbraco.Web.UI.Client/src/packages/multi-url-picker/link-picker-modal/link-picker-modal.element.ts b/src/Umbraco.Web.UI.Client/src/packages/multi-url-picker/link-picker-modal/link-picker-modal.element.ts index 31a1997820dc..a2a4e46d0f12 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/multi-url-picker/link-picker-modal/link-picker-modal.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/multi-url-picker/link-picker-modal/link-picker-modal.element.ts @@ -56,13 +56,14 @@ export class UmbLinkPickerModalElement extends UmbModalBaseElement this.localize.term('linkPicker_modalAnchorValidationMessage'), - () => !this.value.link.url && !this.value.link.queryString, + () => !this.value.link.name && !this.value.link.queryString, ); } @@ -74,6 +75,30 @@ export class UmbLinkPickerModalElement extends UmbModalBaseElement x.unique).filter((x) => x && !isUmbracoFolder(x)) as Array) ?? []; } + async populateLinkUrl() { + // Documents and media have URLs saved in the local link format. Display the actual URL to align with what + // the user sees when they selected it initially. + if (!this.value.link?.unique || this.value.link?.url?.indexOf('localLink') === -1) return; + + let url: string | undefined = undefined; + switch (this.value.link.type) { + case 'document': { + url = await this.#getUrlForDocument(this.value.link.unique); + break; + } + case 'media': { + url = await this.#getUrlForMedia(this.value.link.unique); + break; + } + default: + break; + } + + if (url) { + this.#partialUpdateLink({ url }); + } + } + #partialUpdateLink(linkObject: Partial) { this.modalContext?.updateValue({ link: { ...this.value.link, ...linkObject } }); } @@ -136,10 +161,7 @@ export class UmbLinkPickerModalElement extends UmbModalBaseElement 0 ? (documentUrlData?.[0].urls[0].url ?? '') : ''; + } + + async #getUrlForMedia(unique: string) { + const mediaUrlRepository = new UmbMediaUrlRepository(this); + const { data: mediaUrlData } = await mediaUrlRepository.requestItems([unique]); + return mediaUrlData?.[0].url ?? ''; + } + async #onResetUrl() { if (this.value.link.url) { await umbConfirmModal(this, {