fix(UVE): Copy URL Button doesnt work (#29600)

### Proposed Changes
* Make the Copy URL Button work

### Video


https://github.com/user-attachments/assets/3655ec64-2b7d-4616-ad8f-53fcd8aeef93

core-web/libs/portlets/edit-ema/portlet/src/lib/edit-ema-editor/components/edit-ema-toolbar/edit-ema-toolbar.component.spec.ts

@@ -47,7 +47,7 @@ import {
     sanitizeURL,
     createPageApiUrlWithQueryParams,
     createFavoritePagesURL,
-    createPureURL
+    createFullURL
 } from '../../../utils';
 import { DotEditEmaWorkflowActionsComponent } from '../dot-edit-ema-workflow-actions/dot-edit-ema-workflow-actions.component';
 import { DotEmaBookmarksComponent } from '../dot-ema-bookmarks/dot-ema-bookmarks.component';
@@ -160,7 +160,7 @@ describe('EditEmaToolbarComponent', () => {
                     mockProvider(UVEStore, {
                         $toolbarProps: signal({
                             bookmarksUrl,
-                            copyUrl: createPureURL(params),
+                            copyUrl: createFullURL(params, pageAPIResponse?.site.identifier),
                             apiUrl: `${'http://localhost'}${pageAPI}`,
                             currentLanguage: pageAPIResponse?.viewAs.language,
                             urlContentMap: null,

core-web/libs/portlets/edit-ema/portlet/src/lib/store/dot-uve.store.spec.ts

@@ -584,10 +584,10 @@ describe('UVEStore', () => {
                 describe('$toolbarProps', () => {
                     it('should return the base info', () => {
                         expect(store.$toolbarProps()).toEqual({
-                            apiUrl: 'http://localhost/api/v1/page/json/test-url?language_id=1&com.dotmarketing.persona.id=dot%3Apersona&variantName=DEFAULT&clientHost=http%3A%2F%2Flocalhost%3A3000',
+                            apiUrl: '/api/v1/page/json/test-url?language_id=1&com.dotmarketing.persona.id=dot%3Apersona&variantName=DEFAULT&clientHost=http%3A%2F%2Flocalhost%3A3000',
                             bookmarksUrl: '/test-url?host_id=123-xyz-567-xxl&language_id=1',
                             copyUrl:
-                                'http://localhost:3000/test-url?language_id=1&com.dotmarketing.persona.id=dot%3Apersona&variantName=DEFAULT',
+                                'http://localhost:3000/test-url?language_id=1&com.dotmarketing.persona.id=dot%3Apersona&variantName=DEFAULT&host_id=123-xyz-567-xxl',
                             currentLanguage: MOCK_RESPONSE_HEADLESS.viewAs.language,
                             deviceSelector: {
                                 apiLink:

core-web/libs/portlets/edit-ema/portlet/src/lib/store/features/editor/toolbar/withEditorToolbar.ts

@@ -17,7 +17,7 @@ import { InfoOptions } from '../../../../shared/models';
 import {
     createFavoritePagesURL,
     createPageApiUrlWithQueryParams,
-    createPureURL,
+    createFullURL,
     getIsDefaultVariant,
     sanitizeURL,
     computePageIsLocked
@@ -80,11 +80,13 @@ export function withEditorToolbar() {
                     pageURI: url,
                     siteId: pageAPIResponse?.site?.identifier
                 });
+                const clientHost = `${params?.clientHost ?? window.location.origin}`;
+                const siteId = pageAPIResponse?.site?.identifier;
 
                 return {
                     bookmarksUrl,
-                    copyUrl: createPureURL(params),
-                    apiUrl: `${window.location.origin}${pageAPI}`,
+                    copyUrl: createFullURL(params, siteId),
+                    apiUrl: pageAPI,
                     currentLanguage: pageAPIResponse?.viewAs.language,
                     urlContentMap: store.isEditState()
                         ? (pageAPIResponse?.urlContentMap ?? null)
@@ -94,7 +96,7 @@ export function withEditorToolbar() {
                     unlockButton: shouldShowUnlock ? unlockButton : null,
                     showInfoDisplay: shouldShowInfoDisplay,
                     deviceSelector: {
-                        apiLink: `${params?.clientHost ?? window.location.origin}${pageAPI}`,
+                        apiLink: `${clientHost}${pageAPI}`,
                         hideSocialMedia: !store.isTraditionalPage()
                     },
                     personaSelector: {

core-web/libs/portlets/edit-ema/portlet/src/lib/utils/index.ts

@@ -271,16 +271,27 @@ export function createFavoritePagesURL(params: {
 }
 
 /**
- * Create a pure URL from the params
  *
+ * @description Create a full URL with the clientHost
  * @export
  * @param {DotPageApiParams} params
  * @return {*}  {string}
  */
-export function createPureURL(params: DotPageApiParams): string {
+/**
+ * @description Create a full URL with the clientHost
+ * @export
+ * @param {DotPageApiParams} params
+ * @param {string} [siteId]
+ * @return {*}  {string}
+ */
+export function createFullURL(params: DotPageApiParams, siteId?: string): string {
     // If we are going to delete properties from the params, we need to make a copy of it
     const paramsCopy = { ...params };
 
+    if (siteId) {
+        paramsCopy['host_id'] = siteId;
+    }
+
     const clientHost = paramsCopy?.clientHost ?? window.location.origin;
     const url = paramsCopy?.url;
 
@@ -289,9 +300,11 @@ export function createPureURL(params: DotPageApiParams): string {
     delete paramsCopy?.url;
     delete paramsCopy?.mode;
 
-    const searchParams = new URLSearchParams(paramsCopy as unknown as Record<string, string>);
+    const searchParams = new URLSearchParams(paramsCopy);
+
+    const pureURL = new URL(`${url}?${searchParams.toString()}`, clientHost);
 
-    return `${clientHost}/${url}?${searchParams.toString()}`;
+    return pureURL.toString();
 }
 
 /**

core-web/libs/portlets/edit-ema/portlet/src/lib/utils/utils.spec.ts

@@ -13,7 +13,8 @@ import {
     mapContainerStructureToArrayOfContainers,
     mapContainerStructureToDotContainerMap,
     areContainersEquals,
-    compareUrlPaths
+    compareUrlPaths,
+    createFullURL
 } from '.';
 
 import { dotPageContainerStructureMock } from '../shared/mocks';
@@ -591,4 +592,45 @@ describe('utils functions', () => {
             expect(compareUrlPaths('/test', '/test2')).toBe(false);
         });
     });
+
+    describe('createFullURL', () => {
+        const expectedURL =
+            'http://localhost:4200/page?language_id=1&com.dotmarketing.persona.id=persona&variantName=new&experimentId=1&depth=1';
+        const params = {
+            url: 'page',
+            language_id: '1',
+            'com.dotmarketing.persona.id': 'persona',
+            variantName: 'new',
+            experimentId: '1',
+            mode: 'EDIT_MODE',
+            clientHost: 'http://localhost:4200/',
+            depth: '1'
+        };
+
+        it('should return the correct url', () => {
+            const result = createFullURL(params);
+            expect(result).toBe(expectedURL);
+        });
+
+        it('should ignore the double slash in the clientHost or path', () => {
+            const result = createFullURL({
+                ...params,
+                clientHost: 'http://localhost:4200//',
+                url: '/page'
+            });
+            expect(result).toBe(expectedURL);
+        });
+
+        it('should add the host_id if the side identifier is passed', () => {
+            const result = createFullURL(
+                {
+                    ...params,
+                    clientHost: 'http://localhost:4200//',
+                    url: '/page'
+                },
+                '123'
+            );
+            expect(result).toBe(`${expectedURL}${'&host_id=123'}`);
+        });
+    });
 });