Merge pull request #506 from contentstack/develop_v4

Develop v4

Author: KANE-99

.github/workflows/secrets-scan.yml

@@ -10,6 +10,8 @@ fileignoreconfig:
       checksum: d0ef271ee5381d9feab06bda6e7e89bd0a882fee87495627bd811c1f0a5459c7
     - filename: package-lock.json
       checksum: fd06363871d0ee16ebfb5d9d0cc479e0922a615bb76584b80bb6933ee6c3e237
+    - filename: src/visualBuilder/utils/__test__/handleFieldMouseDown.test.ts
+      checksum: dc20802eab76834de7aadb797b14076f1f1a9c0662b32493563fe68fd5cd6e16
     - filename: CHANGELOG.md
       checksum: 873106e25dafe0355c55724936cfe0ecc9d0192a2a82c98eddaf5648f23d5ee7
 version: "1.0"

.talismanrc

@@ -1 +1,11 @@
-* @contentstack/security-admin
+* @contentstack/ghost-pr-reviewers
+
+.github/workflows/sca-scan.yml @contentstack/security-admin
+
+.github/workflows/codeql-anaylsis.yml @contentstack/security-admin
+
+**/.snyk @contentstack/security-admin
+
+.github/workflows/policy-scan.yml @contentstack/security-admin
+
+.github/workflows/issues-jira.yml @contentstack/security-admin

CODEOWNERS

@@ -15,7 +15,7 @@ npm install @contentstack/live-preview-utils
 Alternatively, if you want to include the package directly in your website HTML code, use the following command:
 
 ```html
-<script type='module'  integrity='sha384-b6G+ggU20rGxqCqsgaS6zludFgj5N11xsuXhMEIARMuQY2PtyDS04TU0H5goP+32' crossorigin="anonymous">
+<script type='module' crossorigin="anonymous">
      import ContentstackLivePreview from 'https://esm.sh/@contentstack/live-preview-utils@4.0.1';
 
      ContentstackLivePreview.init({
@@ -51,7 +51,7 @@ ContentstackLivePreview.init({
 
 MIT License
 
-Copyright © 2024 [Contentstack](https://www.contentstack.com/). All Rights Reserved
+Copyright © 2021-2025 [Contentstack](https://www.contentstack.com/). All Rights Reserved
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

README.md

@@ -15,7 +15,7 @@ npm install @contentstack/live-preview-utils
 Alternatively, if you want to include the package directly in your website HTML code, use the following command:
 
 ```html
-<script type='module'  integrity='{{integrity}}' crossorigin="anonymous">
+<script type='module' crossorigin="anonymous">
      import ContentstackLivePreview from 'https://esm.sh/@contentstack/live-preview-utils@{{packageVersion}}';
 
      ContentstackLivePreview.init({
@@ -51,7 +51,7 @@ ContentstackLivePreview.init({
 
 MIT License
 
-Copyright © 2024 [Contentstack](https://www.contentstack.com/). All Rights Reserved
+Copyright © 2021-{{currentYear}} [Contentstack](https://www.contentstack.com/). All Rights Reserved
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

main.mustache

@@ -1,20 +1,17 @@
 // index.js
 // import { render } from 'mustache';
 import * as mustache from 'mustache';
-import { readFile, readFileSync, writeFileSync } from 'fs';
+import { readFile, writeFileSync } from 'fs';
 import packageJson from "./package.json" assert { type: "json" };
-import ssri from 'ssri';
 const MUSTACHE_MAIN_DIR = './main.mustache';
-const fileContent = readFileSync('./dist/modern/index.js'); 
-const integrity = ssri.fromData(fileContent, { algorithms: ['sha384'] }); 
 /**
   * DATA is the object that contains all
   * the data to be provided to Mustache
   * Notice the "name" and "date" property.
 */
 const DATA = {
   packageVersion: packageJson.version,
-  integrity: integrity.toString(),
+  currentYear: new Date().getFullYear(),
 };
 function generateReadMe() {
 

mustache.ts

@@ -56,7 +56,6 @@
         "@types/mustache": "^4.2.2",
         "@types/react": "^18.2.57",
         "@types/react-dom": "^18.2.19",
-        "@types/ssri": "^7.1.5",
         "@types/uuid": "^8.3.1",
         "@vitest/coverage-v8": "^2.1.2",
         "@vitest/ui": "^2.1.2",
@@ -71,7 +70,6 @@
         "jsdom": "^25.0.0",
         "prettier": "^3.3.3",
         "prettier-eslint": "^15.0.1",
-        "ssri": "^11.0.0",
         "ts-node": "^10.9.2",
         "tsc": "^2.0.4",
         "tsup": "^8.0.1",

package-lock.json

@@ -159,9 +159,9 @@ describe("postMessageEvent.hooks", () => {
                 (Config.get as any).mockReturnValue(mockConfig);
             });
 
-            it("should reload window when ssr is true and no event_type", () => {
-                // Set URL to include live_preview parameter so reload path is taken
-                mockWindow.location.href = "https://example.com?live_preview=old-hash";
+            it("should reload window when ssr is true and no event_type and all params present", () => {
+                // Set URL to include all required params so reload path is taken
+                mockWindow.location.href = "https://example.com?live_preview=old-hash&content_type_uid=blog&entry_uid=entry-123";
 
                 const eventData: OnChangeLivePreviewPostMessageEventData = {
                     hash: "test-hash",

package.json

@@ -50,7 +50,7 @@ export function useOnEntryUpdatePostMessageEvent(): void {
         LIVE_PREVIEW_POST_MESSAGE_EVENTS.ON_CHANGE,
         (event) => {
             try {
-                const { ssr, onChange } = Config.get();
+                const { ssr, onChange, stackDetails } = Config.get();
                 const event_type = event.data._metadata?.event_type;
                 setConfigFromParams({
                     live_preview: event.data.hash,
@@ -59,41 +59,57 @@ export function useOnEntryUpdatePostMessageEvent(): void {
                 // This section will run when there is a change in the entry and the website is CSR
                 if (!ssr && !event_type) {
                     onChange();
-                } 
+                }
 
-                if(isOpeningInNewTab()) {
-                    if(!window) {
+                if (isOpeningInNewTab()) {
+                    if (!window) {
                         PublicLogger.error("window is not defined");
                         return;
                     };
-                    
-                    // This section will run when there is a change in the entry and the website is SSR
-                    if(ssr && !event_type) {
-                        if(window.location.href.includes("live_preview")) {
+
+                    if (ssr && !event_type) {
+                        const url = new URL(window.location.href);
+                        let live_preview = url.searchParams.get("live_preview");
+                        let content_type_uid = url.searchParams.get("content_type_uid");
+                        let entry_uid = url.searchParams.get("entry_uid");
+
+                        if (live_preview && content_type_uid && entry_uid) {
+                            // All required params are present, just reload
                             window.location.reload();
                         } else {
-                            const url = new URL(window.location.href);
-                            url.searchParams.set("live_preview", event.data.hash);
-                            url.searchParams.set("content_type_uid", Config.get().stackDetails.contentTypeUid || "");
-                            url.searchParams.set("entry_uid", Config.get().stackDetails.entryUid || "");
+                            live_preview = event.data.hash;
+                            content_type_uid = event.data.content_type_uid || stackDetails.$contentTypeUid?.toString() || "";
+                            entry_uid = event.data.entry_uid || stackDetails.$entryUid?.toString() || "";
+                            // Set missing params and redirect
+                            url.searchParams.set("live_preview", live_preview);
+                            if (content_type_uid) {
+                                url.searchParams.set(
+                                    "content_type_uid",
+                                    content_type_uid
+                                );
+                            }
+                            if (entry_uid) {
+                                url.searchParams.set(
+                                    "entry_uid",
+                                    entry_uid
+                                );
+                            }
                             window.location.href = url.toString();
                         }
                     }
-    
+
                     // This section will run when the hash changes and the website is SSR or CSR
-                    if(event_type === OnChangeLivePreviewPostMessageEventTypes.HASH_CHANGE){
+                    if (event_type === OnChangeLivePreviewPostMessageEventTypes.HASH_CHANGE) {
                         const newUrl = new URL(window.location.href);
                         newUrl.searchParams.set("live_preview", event.data.hash);
                         window.history.pushState({}, "", newUrl.toString());
                     }
-    
+
                     // This section will run when the URL of the page changes
-                    if(event_type === OnChangeLivePreviewPostMessageEventTypes.URL_CHANGE && event.data.url){
+                    if (event_type === OnChangeLivePreviewPostMessageEventTypes.URL_CHANGE && event.data.url) {
                         window.location.href = event.data.url;
                     }
                 }
-
-                
             } catch (error) {
                 PublicLogger.error("Error handling live preview update:", error);
                 return;