fix(preview): add util function to allow operations in preview share

Author: ZuhairAhmed-cs

src/utils/index.ts

@@ -44,3 +44,13 @@ export function isOpenInBuilder(): boolean {
     }
     return false;
 }
+
+
+export function isOpenInPreviewShare(): boolean {
+    if (hasWindow()) {
+        const urlParams = new URLSearchParams(window.location.search);
+        const previewShare = urlParams.get("preview_share");
+        return !!previewShare;
+    }
+    return false;
+}

src/visualBuilder/__test__/hover/fields/date.test.ts

@@ -30,6 +30,7 @@ vi.mock("../../../../utils/index.ts", () => {
     return {
         __esModule: true,
         isOpenInBuilder: vi.fn().mockReturnValue(true),
+        isOpenInPreviewShare: vi.fn().mockReturnValue(false),
         isOpeningInTimeline: vi.fn().mockReturnValue(false),
         hasWindow: vi.fn().mockReturnValue(true),
         addLivePreviewQueryTags: vi.fn(),

src/visualBuilder/components/VisualBuilder.tsx

@@ -5,15 +5,18 @@ import {
     VisualBuilderGlobalStyles,
 } from "../visualBuilder.style";
 import React from "preact/compat";
-import { isOpenInBuilder } from "../../utils";
+import { isOpenInBuilder , isOpenInPreviewShare} from "../../utils";
 
 interface VisualBuilderProps {
     visualBuilderContainer: HTMLDivElement | null;
     resizeObserver: ResizeObserver;
 }
 
 function VisualBuilderComponent(props: VisualBuilderProps): JSX.Element | null {
-    if (!isOpenInBuilder()) {
+    const isInBuilder = isOpenInBuilder();
+    const isInPreviewShare = isOpenInPreviewShare();
+
+    if (!isInBuilder && !isInPreviewShare) {
         return null;
     }
 

src/visualBuilder/components/index.tsx

@@ -2,7 +2,7 @@ import { render } from "preact";
 import VisualBuilderComponent from "./VisualBuilder";
 import { visualBuilderStyles } from "../visualBuilder.style";
 import React from "preact/compat";
-import { isOpenInBuilder } from "../../utils";
+import { isOpenInBuilder , isOpenInPreviewShare} from "../../utils";
 
 interface InitUIParams {
     resizeObserver: ResizeObserver;
@@ -14,8 +14,9 @@ function initUI(props: InitUIParams): void {
     );
 
     const isInBuilder = isOpenInBuilder();
+    const isInPreviewShare = isOpenInPreviewShare();
 
-    if (!visualBuilderDOM && isInBuilder) {
+    if (!visualBuilderDOM && (isInBuilder || isInPreviewShare)) {
         const visualBuilderContainer = document.createElement("div");
         visualBuilderContainer.classList.add(
             visualBuilderStyles()["visual-builder__container"],