@griddo/ax 12.7.0 → 12.8.0

package/src/__tests__/hooks/broadcast.test.tsx

@@ -0,0 +1,263 @@
+import { act, renderHook } from "@testing-library/react";
+import "@testing-library/jest-dom";
+
+import type * as React from "react";
+import { Provider } from "react-redux";
+
+import { SET_COPY_MODULE } from "@ax/containers/PageEditor/constants";
+import { useBroadcastChannel, useBroadcastClipboard, useBroadcastContentUpdate, useBroadcastLogout } from "@ax/hooks";
+
+import configureStore from "redux-mock-store";
+
+// --- Controllable BroadcastChannel mock -------------------------------------
+// jsdom has no BroadcastChannel and Node's implementation delivers asynchronously
+// and keeps the event loop alive. This in-memory mock delivers synchronously and
+// mirrors the real contract: a message reaches every OTHER open channel with the
+// same name, never the sender itself.
+type Listener = (event: { data: any }) => void;
+
+class MockBroadcastChannel {
+	static registry = new Map<string, Set<MockBroadcastChannel>>();
+	name: string;
+	onmessage: Listener | null = null;
+	private listeners = new Set<Listener>();
+	private closed = false;
+
+	constructor(name: string) {
+		this.name = name;
+		const peers = MockBroadcastChannel.registry.get(name) ?? new Set<MockBroadcastChannel>();
+		peers.add(this);
+		MockBroadcastChannel.registry.set(name, peers);
+	}
+
+	postMessage(data: any) {
+		const peers = MockBroadcastChannel.registry.get(this.name);
+		if (!peers) return;
+		for (const peer of peers) {
+			if (peer === this || peer.closed) continue;
+			const event = { data };
+			peer.onmessage?.(event);
+			peer.listeners.forEach((listener) => {
+				listener(event);
+			});
+		}
+	}
+
+	addEventListener(type: string, listener: Listener) {
+		if (type === "message") this.listeners.add(listener);
+	}
+
+	removeEventListener(type: string, listener: Listener) {
+		if (type === "message") this.listeners.delete(listener);
+	}
+
+	close() {
+		this.closed = true;
+		MockBroadcastChannel.registry.get(this.name)?.delete(this);
+	}
+
+	static reset() {
+		MockBroadcastChannel.registry.clear();
+	}
+}
+
+const originalBroadcastChannel = globalThis.BroadcastChannel;
+
+beforeAll(() => {
+	globalThis.BroadcastChannel = MockBroadcastChannel as unknown as typeof BroadcastChannel;
+});
+
+afterAll(() => {
+	globalThis.BroadcastChannel = originalBroadcastChannel;
+});
+
+beforeEach(() => {
+	MockBroadcastChannel.reset();
+});
+
+describe("useBroadcastChannel", () => {
+	it("posts messages (stamped with a timestamp) to other channels of the same name", () => {
+		const received: any[] = [];
+		const peer = new BroadcastChannel("test-channel");
+		peer.addEventListener("message", (e) => received.push(e.data));
+
+		const { result } = renderHook(() => useBroadcastChannel("test-channel", vi.fn()));
+
+		act(() => {
+			result.current.postMessage({ type: "ping" });
+		});
+
+		expect(received).toHaveLength(1);
+		expect(received[0]).toMatchObject({ type: "ping", timestamp: expect.any(Number) });
+	});
+
+	it("invokes onMessage when a peer posts to the channel", () => {
+		const onMessage = vi.fn();
+		renderHook(() => useBroadcastChannel("test-channel", onMessage));
+
+		const peer = new BroadcastChannel("test-channel");
+		act(() => {
+			peer.postMessage({ type: "pong" });
+		});
+
+		expect(onMessage).toHaveBeenCalledWith({ type: "pong" });
+	});
+
+	it("uses the latest onMessage after a re-render without re-subscribing", () => {
+		const first = vi.fn();
+		const second = vi.fn();
+		const { rerender } = renderHook(({ cb }) => useBroadcastChannel("test-channel", cb), {
+			initialProps: { cb: first },
+		});
+
+		rerender({ cb: second });
+
+		const peer = new BroadcastChannel("test-channel");
+		act(() => {
+			peer.postMessage({ type: "update" });
+		});
+
+		expect(first).not.toHaveBeenCalled();
+		expect(second).toHaveBeenCalledWith({ type: "update" });
+	});
+});
+
+describe("[UC-AX-work-across-tabs] ciclo de vida del canal", () => {
+	it("AC9 · una pestaña desmontada deja de recibir avisos", () => {
+		const onMessage = vi.fn();
+		const { unmount } = renderHook(() => useBroadcastChannel("test-channel", onMessage));
+
+		unmount();
+
+		const peer = new BroadcastChannel("test-channel");
+		act(() => {
+			peer.postMessage({ type: "late" });
+		});
+
+		expect(onMessage).not.toHaveBeenCalled();
+	});
+});
+
+describe("[UC-AX-work-across-tabs] aviso de contenido guardado", () => {
+	it("AC1 · guardar avisa a las demás pestañas con el identificador del contenido", () => {
+		const received: any[] = [];
+		const peer = new BroadcastChannel("griddo-page-updates");
+		peer.addEventListener("message", (e) => received.push(e.data));
+
+		const { result } = renderHook(() => useBroadcastContentUpdate(10));
+
+		act(() => {
+			result.current.broadcastPageSave(10);
+		});
+
+		expect(received[0]).toMatchObject({ type: "page-saved", payload: { contentID: 10 } });
+	});
+
+	it("AC2 · la pestaña con ese mismo contenido abierto anota el aviso y puede descartarlo", () => {
+		const { result } = renderHook(() => useBroadcastContentUpdate(10));
+		const peer = new BroadcastChannel("griddo-page-updates");
+
+		act(() => {
+			peer.postMessage({ type: "page-saved", payload: { contentID: 10 } });
+		});
+		expect(result.current.remotePageUpdate).toEqual({ contentID: 10 });
+
+		act(() => {
+			result.current.clearRemoteUpdate();
+		});
+		expect(result.current.remotePageUpdate).toBeNull();
+	});
+
+	it("AC3 · un aviso sobre otro contenido distinto no anota nada", () => {
+		const { result } = renderHook(() => useBroadcastContentUpdate(10));
+		const peer = new BroadcastChannel("griddo-page-updates");
+
+		act(() => {
+			peer.postMessage({ type: "page-saved", payload: { contentID: 99 } });
+		});
+
+		expect(result.current.remotePageUpdate).toBeNull();
+	});
+});
+
+describe("[UC-AX-work-across-tabs] cierre de sesión entre pestañas", () => {
+	it("AC4 · cerrar sesión en una pestaña se anuncia a las demás", () => {
+		const received: any[] = [];
+		const peer = new BroadcastChannel("griddo-logout");
+		peer.addEventListener("message", (e) => received.push(e.data));
+
+		const { result } = renderHook(() => useBroadcastLogout(vi.fn()));
+
+		act(() => {
+			result.current.broadcastLogout();
+		});
+
+		expect(received[0]).toMatchObject({ type: "user-logout" });
+	});
+
+	it("AC5 · la pestaña que recibe el anuncio cierra su sesión", () => {
+		const onRemoteLogout = vi.fn();
+		renderHook(() => useBroadcastLogout(onRemoteLogout));
+
+		const peer = new BroadcastChannel("griddo-logout");
+		act(() => {
+			peer.postMessage({ type: "user-logout" });
+		});
+
+		expect(onRemoteLogout).toHaveBeenCalledTimes(1);
+	});
+});
+
+describe("[UC-AX-work-across-tabs] portapapeles compartido entre pestañas", () => {
+	const mockStore = configureStore([]);
+	const wrapperWith = (state: any) => {
+		const store = mockStore(state);
+		const wrapper = ({ children }: { children: React.ReactNode }) => <Provider store={store}>{children}</Provider>;
+		return { store, wrapper };
+	};
+
+	it("AC6 · un módulo copiado en otra pestaña queda disponible para pegar en esta", () => {
+		const { store, wrapper } = wrapperWith({ pageEditor: { moduleCopy: null } });
+		renderHook(() => useBroadcastClipboard(), { wrapper });
+
+		const peer = new BroadcastChannel("griddo-clipboard");
+		act(() => {
+			peer.postMessage({
+				type: "module-copied",
+				senderId: "another-tab",
+				payload: { id: 1, date: "2026-07-02T00:00:00.000Z" },
+			});
+		});
+
+		const actions = store.getActions();
+		expect(actions).toHaveLength(1);
+		expect(actions[0].type).toBe(SET_COPY_MODULE);
+		expect(actions[0].payload.moduleCopy).toMatchObject({ id: 1 });
+		expect(actions[0].payload.moduleCopy.date).toBeInstanceOf(Date);
+	});
+
+	it("AC7 · un mensaje que no sea de copia de módulo se ignora", () => {
+		const { store, wrapper } = wrapperWith({ pageEditor: { moduleCopy: null } });
+		renderHook(() => useBroadcastClipboard(), { wrapper });
+
+		const peer = new BroadcastChannel("griddo-clipboard");
+		act(() => {
+			peer.postMessage({ type: "something-else", payload: {} });
+		});
+
+		expect(store.getActions()).toHaveLength(0);
+	});
+
+	it("AC8 · al montarse, una pestaña anuncia lo que ya tiene en el portapapeles", () => {
+		const moduleCopy = { id: 7, date: new Date("2026-07-02T00:00:00.000Z") };
+		const received: any[] = [];
+		const peer = new BroadcastChannel("griddo-clipboard");
+		peer.addEventListener("message", (e) => received.push(e.data));
+
+		const { wrapper } = wrapperWith({ pageEditor: { moduleCopy } });
+		renderHook(() => useBroadcastClipboard(), { wrapper });
+
+		expect(received).toHaveLength(1);
+		expect(received[0]).toMatchObject({ type: "module-copied", senderId: expect.any(String) });
+	});
+});

package/src/api/utils.tsx

@@ -1,5 +1,6 @@
 import axios, { type AxiosRequestConfig, type AxiosResponse, type Method, type ResponseType } from "axios";
 import { SET_ERROR } from "./../containers/App/constants";
+import { getStore } from "../storeRegistry";
 
 export interface IServiceConfig {
 	host: string | undefined;
@@ -24,15 +25,15 @@ const getToken = (): Record<string, unknown> | null => {
 };
 
 const getLang = (): Record<string, unknown> => {
-	const lang = JSON.parse(localStorage.getItem("langID") || "{}");
-
-	return { lang };
+	const store = getStore();
+	if (store) return { lang: store.getState()?.app?.lang?.id ?? null };
+	return { lang: JSON.parse(localStorage.getItem("langID") || "{}") };
 };
 
 const getSite = (): Record<string, unknown> => {
-	const site = JSON.parse(localStorage.getItem("siteID") || "{}");
-
-	return { site };
+	const store = getStore();
+	if (store) return { site: store.getState()?.sites?.currentSiteInfo?.id ?? null };
+	return { site: JSON.parse(localStorage.getItem("siteID") || "{}") };
 };
 
 const getHeaders = (headers: Record<string, unknown>, hasToken: boolean) => {

package/src/components/Browser/index.tsx

@@ -81,6 +81,14 @@ const Browser = (props: IBrowserProps): JSX.Element => {
 
 	useOnMessageReceivedFromIframe(actions);
 
+	const handleIframeLoad = (e: React.SyntheticEvent<HTMLIFrameElement>) => {
+		setIsIframeLoading(false);
+		const iframeWindow = (e.target as HTMLIFrameElement)?.contentWindow;
+		if (iframeWindow && (content as any)?.template) {
+			iframeWindow.postMessage({ type: "content-update", message: content }, "*");
+		}
+	};
+
 	useEffect(() => {
 		localStorage.setItem("selectedID", "0");
 		(window as any).browserRef = null;
@@ -326,7 +334,7 @@ const Browser = (props: IBrowserProps): JSX.Element => {
 									src={urlPreview}
 									loading="lazy"
 									className="frame-content"
-									onLoad={() => setIsIframeLoading(false)}
+									onLoad={handleIframeLoad}
 									style={{ visibility: isIframeLoading ? "hidden" : "visible" }}
 								/>
 							) : (
@@ -344,7 +352,7 @@ const Browser = (props: IBrowserProps): JSX.Element => {
 										src={urlPreview}
 										loading="lazy"
 										className="frame-content"
-										onLoad={() => setIsIframeLoading(false)}
+										onLoad={handleIframeLoad}
 										style={{
 											display: "block",
 											transform: isZoomEditor ? `scale(${parseInt(dimensions.zoom) / 100})` : "scale(1)",

package/src/components/ConfigPanel/GlobalPageForm/index.tsx

@@ -34,10 +34,9 @@ const GlobalPageForm = (props: IGlobalPageFormProps): JSX.Element => {
 	const handleClick = async () => {
 		if (isAllowedToEditGlobalData) {
 			const navigate = async () => {
-				await actions.getGlobalFromLocalPageAction();
-				const path = "/data/pages/editor";
-				setHistoryPush?.(path, true);
+				const pageID = await actions.getGlobalFromLocalPageAction();
 				actions.saveCurrentSiteInfoAction();
+				setHistoryPush?.(`/data/pages/editor/${pageID}`, true);
 			};
 
 			if (isDirty && onNavigateWithDirty) {
@@ -195,7 +194,7 @@ export interface IGlobalPageFormProps {
 	isDirty?: boolean;
 	onNavigateWithDirty?: (navigateCallback: () => void) => void;
 	actions: {
-		getGlobalFromLocalPageAction(): Promise<void>;
+		getGlobalFromLocalPageAction(): Promise<number | null>;
 		saveCurrentSiteInfoAction(): Promise<void>;
 		restorePageNavigationAction(type: string): Promise<void>;
 		setNotificationAction(notification: INotification): void;

package/src/components/Fields/Wysiwyg/atoms.tsx

@@ -86,7 +86,7 @@ const LinkPopover = (props: ILinkPopoverProps) => {
 	return createPortal(
 		<>
 			<S.PopoverOverlay onClick={handleOverlayClick} />
-			<S.PopoverContainer ref={popoverRef} x={position.x} y={position.y}>
+			<S.PopoverContainer ref={popoverRef} x={position.x} y={position.y} data-testid="link-popover">
 				{!linkData?.isImageLink && (
 					<FieldsBehavior
 						title="Text"

package/src/components/Fields/Wysiwyg/index.tsx

@@ -286,6 +286,33 @@ const Wysiwyg = (props: IWysiwygProps) => {
 						});
 					}
 				},
+				// Froala's fullscreen stashes the editor's z-index in `opts.z_index` but
+				// reads the option back from `opts.zIndex`, so leaving it restores
+				// undefined. Any popup opened while in fullscreen pins the toolbar at
+				// Froala's own 2147483642, and with the option gone nothing ever clears
+				// it: the toolbar then paints over every modal the field opens. Seed the
+				// key the plugin reads, and drop what it left inline on the way out.
+				"commands.before": function (this: any, cmd: string) {
+					if (cmd === "fullscreen" && !this.fullscreen.isActive()) {
+						this.opts.z_index = this.opts.zIndex;
+					}
+				},
+				"commands.after": function (this: any, cmd: string) {
+					if (cmd === "fullscreen" && !this.fullscreen.isActive()) {
+						this.$tb.css("z-index", "");
+					}
+				},
+				// Froala's shortcut dispatcher calls plugin commands unbound, so its own
+				// Ctrl/Cmd+K throws instead of opening anything. Returning false cancels
+				// it; commands.exec runs ours with the editor bound.
+				shortcut: function (this: any, e: KeyboardEvent, cmd: string) {
+					if (cmd !== "insertLink") return;
+					e.preventDefault();
+					if (!inline) {
+						this.commands.exec("insertLinkGriddo");
+					}
+					return false;
+				},
 				blur: function (this: any) {
 					const html = this.html.get();
 					const stripedHtml = decodeEntities(html);
@@ -318,6 +345,7 @@ const Wysiwyg = (props: IWysiwygProps) => {
 
 	return (
 		<>
+			<S.FullscreenGlobalStyle />
 			<S.EditorWrapper error={error} disabled={disabled} data-testid="wysiwyg-wrapper">
 				<FroalaEditorComponent tag="textarea" model={value} config={config} onModelChange={handleChange} />
 			</S.EditorWrapper>

package/src/components/Fields/Wysiwyg/style.tsx

@@ -1,6 +1,7 @@
 import { Wrapper } from "@ax/components/FieldsBehavior/style";
+import { Wrapper as FloatingPanelWrapper } from "@ax/components/FloatingPanel/style";
 
-import styled from "styled-components";
+import styled, { createGlobalStyle } from "styled-components";
 
 export const PopoverOverlay = styled.div`
 	position: fixed;
@@ -193,3 +194,42 @@ export const EditorWrapper = styled.div<{ error: boolean | undefined; disabled?:
     }
   }
 `;
+
+// Froala's fullscreen raises the editor and every ancestor up to <body> to
+// z-index 2147483640, which buries everything the field portals into <body>.
+// Bring the editor back into the app's scale and lift the overlays it can open
+// over it. It has to be global because both the ancestors it marks and the
+// portals live outside this file's tree, and scoped to `body.fr-fullscreen` so
+// nothing moves while the editor is inline.
+//
+// The editor goes over the app chrome and under the overlay layer (Modal), and
+// the overlays it can open ride over it: the link popover, and the page finder
+// panel that the popover opens on top of itself. The galleries need nothing,
+// Modal already sits above. Exported because these only hold as long as the
+// components they stack against keep their own values.
+export const FULLSCREEN_LAYER = {
+	editor: 1210,
+	popoverOverlay: 1220,
+	popover: 1230,
+	panel: 1235,
+};
+
+export const FullscreenGlobalStyle = createGlobalStyle`
+	body.fr-fullscreen {
+		/* An ancestor panel that *contains* the editor keeps the editor's own value
+		   here, because Froala marks it as a wrapper too and !important wins. */
+		.fr-fullscreen-wrapper {
+			z-index: ${FULLSCREEN_LAYER.editor} !important;
+		}
+
+		${PopoverOverlay} {
+			z-index: ${FULLSCREEN_LAYER.popoverOverlay};
+		}
+		${PopoverContainer} {
+			z-index: ${FULLSCREEN_LAYER.popover};
+		}
+		${FloatingPanelWrapper} {
+			z-index: ${FULLSCREEN_LAYER.panel};
+		}
+	}
+`;

package/src/components/MainWrapper/index.tsx

@@ -6,12 +6,12 @@ import AppBar, { type IAppBarProps } from "./AppBar";
 import * as S from "./style";
 
 const MainWrapper = (props: IWrapperProps): JSX.Element => {
-	const { children, fixedAppBar, fullWidth, hasAnimation } = props;
+	const { children, fixedAppBar, fullWidth, hasAnimation, screen } = props;
 
 	const { isOnline } = useNetworkStatus();
 
 	return (
-		<S.Wrapper fixedAppBar={fixedAppBar} data-testid="main-wrapper">
+		<S.Wrapper fixedAppBar={fixedAppBar} data-testid="main-wrapper" data-screen={screen}>
 			{hasAnimation && <S.BackgroundAnimation />}
 			<AppBar {...props} />
 			<S.Main fullWidth={fullWidth} data-testid="main-component" id="main-component">
@@ -30,6 +30,18 @@ const MainWrapper = (props: IWrapperProps): JSX.Element => {
 export interface IWrapperProps extends IAppBarProps {
 	children?: any[] | JSX.Element;
 	fullWidth?: boolean;
+	/**
+	 * Stable per-screen identifier for e2e, emitted as `data-screen`. Separate from
+	 * `data-testid="main-wrapper"`, which is the same on all 32 screens and is already
+	 * consumed by tests here and in griddo-qa's `identifiers.ts`.
+	 *
+	 * It exists because nothing else identifies a screen: `title` is display copy and
+	 * is not even unique — Robots and Redirects are both "SEO Settings", and the global
+	 * and the site Analytics screens are both "Analytics Settings". The e2e specs had
+	 * to assert on `location.pathname` with exact equality, and `/settings/analytics`
+	 * is a substring of `/sites/settings/analytics`.
+	 */
+	screen?: string;
 }
 
 export default MainWrapper;

package/src/components/Nav/index.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import { NavLink } from "react-router-dom";
 
 import { SubNav, MenuItem } from "@ax/components";
 import type { INavItem } from "@ax/types";
@@ -18,13 +17,29 @@ const Nav = (props: INavProps): JSX.Element => {
 					const selectedClass = isSelected ? "selected" : "";
 					const handleClick = () => onClick(item.path);
 
+					// No `NavLink` wrapping the label, on purpose (sc-118192). It used to be here with
+					// `to="#"`, which made every click navigate TWICE: the link's transition fires first —
+					// it is the inner element, so its handler runs first as the event bubbles, and by the
+					// time `MenuItem` calls `preventDefault` react-router has already read
+					// `defaultPrevented` as false and pushed — and then the real one from `onClick`.
+					//
+					// On a clean screen that left a spurious history entry before every real one. On a
+					// screen with unsaved changes it was worse: a `RouteLeavingGuard`'s `<Prompt>`
+					// intercepted both transitions and its handler toggles the modal
+					// (`hooks/modals.tsx:6-8`), so it opened and shut in the same tick — the click did
+					// nothing at all, no navigation and no warning, on the five settings screens that
+					// mount both.
+					//
+					// Nothing was lost by dropping it: `S.Link` is a `styled.div` that only reads `active`,
+					// no style hangs off the anchor, and `MenuItem` is already the focusable,
+					// keyboard-operable element (`role="button"`, `tabIndex={0}`, Enter handled) — so the
+					// `<a>` was a nested interactive element inside a button, which is worse semantics
+					// rather than better.
 					const menuItem = (
 						<MenuItem onClick={handleClick} key={key} className={selectedClass}>
-							<NavLink to="#">
-								<S.Link active={isSelected} data-testid="nav-link">
-									{item.title}
-								</S.Link>
-							</NavLink>
+							<S.Link active={isSelected} data-testid="nav-link">
+								{item.title}
+							</S.Link>
 						</MenuItem>
 					);
 

package/src/components/ResizePanel/index.tsx

@@ -31,9 +31,14 @@ const ResizePanel = (props: IResizePanelProps): JSX.Element => {
 
 		const updateWidth = () => {
 			frame = requestAnimationFrame(() => {
-				if (rightPanelRef.current) {
-					setRwidth(rightPanelRef.current.offsetWidth);
-				}
+				const panel = rightPanelRef.current;
+				// Froala's fullscreen tags every ancestor of the editor with
+				// .fr-fullscreen-wrapper, and its `width: 100% !important` lands on this
+				// panel too. Reading it while that class is on would store the width the
+				// editor borrowed as the panel's own, and the panel would keep it once
+				// fullscreen is closed.
+				if (!panel || panel.classList.contains("fr-fullscreen-wrapper")) return;
+				setRwidth(panel.offsetWidth);
 			});
 		};
 

package/src/components/Toast/index.tsx

@@ -11,7 +11,10 @@ const Toast = (props: IToastProps): JSX.Element => {
 	const toast = useRef<HTMLDivElement>(null);
 
 	const { pathname } = useLocation();
-	const isEditor = pathname.includes("/editor");
+	// Structured data items live under `/data/:id/content[/:contentId]`, page editors
+	// under `/editor`. Matched as a whole segment so `/settings/content-types` doesn't
+	// count as an editor.
+	const isEditor = /\/(editor|content)(\/|$)/.test(pathname);
 
 	let temp: NodeJS.Timeout;
 	const setTemp = (time: number) => {

package/src/containers/ActivityLog/actions.tsx

@@ -13,7 +13,6 @@ import type {
 import { logs } from "@ax/api";
 import { appActions } from "@ax/containers/App";
 import { usersActions } from "@ax/containers/Users";
-import { pageEditorActions } from "@ax/containers/PageEditor";
 import { sitesActions } from "@ax/containers/Sites";
 import { integrationsActions } from "@ax/containers/Integrations";
 import { formsActions } from "@ax/containers/Forms";
@@ -228,13 +227,11 @@ function goToLogContent(
 				case "template":
 					if (site) {
 						await sitesActions.getSite(site)(dispatch, getState);
-						dispatch(pageEditorActions.setCurrentPageID(contentType.id));
 						dispatch(appActions.setLanguage(language));
-						appActions.setHistoryPush("/sites/pages/editor", true)(dispatch);
+						appActions.setHistoryPush(`/sites/pages/editor/${contentType.id}`, true)(dispatch);
 					} else {
-						dispatch(pageEditorActions.setCurrentPageID(contentType.id));
 						dispatch(appActions.setLanguage(language));
-						appActions.setHistoryPush("/data/pages/editor", true)(dispatch);
+						appActions.setHistoryPush(`/data/pages/editor/${contentType.id}`, true)(dispatch);
 					}
 					break;
 				case "structuredData":
@@ -245,13 +242,13 @@ function goToLogContent(
 							dispatch(structuredDataActions.setCurrentDataID(contentType.id));
 							await structuredDataActions.getDataContent(contentType.id)(dispatch);
 							dispatch(appActions.setLanguage(language));
-							appActions.setHistoryPush(`/sites/data/${contentType.content.id}/editor`)(dispatch);
+							appActions.setHistoryPush(`/sites/data/${contentType.content.id}/content`)(dispatch);
 						} else {
 							structuredDataActions.setSelectedStructuredData(contentType.content.id, "global")(dispatch, getState);
 							dispatch(structuredDataActions.setCurrentDataID(contentType.id));
 							await structuredDataActions.getDataContent(contentType.id)(dispatch);
 							dispatch(appActions.setLanguage(language));
-							appActions.setHistoryPush(`/data/${contentType.content.id}/editor`)(dispatch);
+							appActions.setHistoryPush(`/data/${contentType.content.id}/content`)(dispatch);
 						}
 					}
 					break;

package/src/containers/PageEditor/actions.tsx

@@ -338,6 +338,10 @@ function getPage(
 	return async (dispatch, getState) => {
 		try {
 			dispatch(setIsLoading(true));
+
+			const savedCopy = localStorage.getItem("pageCopyModule");
+			if (savedCopy) dispatch(setCopyModule(JSON.parse(savedCopy)));
+
 			const {
 				sites: { currentSiteInfo },
 				pageEditor: { isNewTranslation, template },
@@ -688,15 +692,18 @@ function getPageLanguages(
 	};
 }
 
-function duplicatePage(pageID: number, data: any, siteID?: number): (dispatch: Dispatch) => Promise<boolean> {
+function duplicatePage(pageID: number, data: any, siteID?: number): (dispatch: Dispatch) => Promise<number | false> {
 	return async (dispatch) => {
 		try {
+			let duplicatedId: number | null = null;
+
 			const responseActions = {
 				handleSuccess: (data: any) => {
 					if (!siteID) {
 						dispatch(setCurrentPageID(data.id));
 						dispatch(setCurrentPageStatus(pageStatus.OFFLINE));
 					}
+					duplicatedId = data.id;
 					return true;
 				},
 				handleError: (response: any) => {
@@ -706,8 +713,9 @@ function duplicatePage(pageID: number, data: any, siteID?: number): (dispatch: D
 			};
 
 			const callback = async () => pages.duplicatePage(pageID, data, siteID);
+			const success = await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
 
-			return await handleRequest(callback, responseActions, [appActions.setIsSaving])(dispatch);
+			return success && duplicatedId !== null ? duplicatedId : false;
 		} catch (e) {
 			console.log(e);
 			return false;
@@ -1037,6 +1045,7 @@ function copyModule(editorID: number[]): (dispatch: Dispatch, getState: () => IR
 			};
 
 			dispatch(setCopyModule(payload));
+			localStorage.setItem("pageCopyModule", JSON.stringify(payload));
 
 			return payload.elements.length;
 		} else {
@@ -1441,7 +1450,7 @@ function deleteError(error: IErrorItem): (dispatch: Dispatch, getState: () => IR
 	};
 }
 
-function getGlobalFromLocalPage(): (dispatch: Dispatch, getState: any) => Promise<void> {
+function getGlobalFromLocalPage(): (dispatch: Dispatch, getState: any) => Promise<number | null> {
 	return async (dispatch, getState) => {
 		try {
 			dispatch(setIsLoading(true));
@@ -1457,8 +1466,10 @@ function getGlobalFromLocalPage(): (dispatch: Dispatch, getState: any) => Promis
 			structuredDataActions.setSelectedStructuredData(structuredData, "global")(dispatch, getState);
 			usersActions.getUserCurrentPermissions("global")(dispatch, getState);
 			dispatch(setIsLoading(false));
+			return originalGlobalPage as number;
 		} catch (e) {
 			console.log(e);
+			return null;
 		}
 	};
 }