diff --git a/resources/js/next/initializeScreenCacheFromMeta.js b/resources/js/next/initializeScreenCacheFromMeta.js new file mode 100644 index 0000000000..69f6189449 --- /dev/null +++ b/resources/js/next/initializeScreenCacheFromMeta.js @@ -0,0 +1,31 @@ +import { initializeScreenCache } from "@processmaker/screen-builder"; +import { getGlobalPMVariable, setGlobalPMVariable } from "./globalVariables"; + +let cacheInitialized = false; + +function getScreenConfigFromMeta() { + const screenCacheEnabled = document.head.querySelector('meta[name="screen-cache-enabled"]')?.content ?? "false"; + const screenCacheTimeout = document.head.querySelector('meta[name="screen-cache-timeout"]')?.content ?? "5000"; + const screenSecureHandlerToggleVisible = document.head.querySelector("meta[name='screen-secure-handler-toggle-visible']"); + const screenMergeDraftOnRestore = document.head.querySelector("meta[name='screen-merge-draft-on-restore']")?.content ?? "true"; + + return { + cacheEnabled: screenCacheEnabled === "true", + cacheTimeout: Number(screenCacheTimeout), + secureHandlerToggleVisible: !!Number(screenSecureHandlerToggleVisible?.content), + mergeDraftOnRestore: screenMergeDraftOnRestore === "true", + }; +} + +export default function initializeScreenCacheFromMeta(apiClient = getGlobalPMVariable("apiClient")) { + if (cacheInitialized) { + return getGlobalPMVariable("screen"); + } + + const screen = getScreenConfigFromMeta(); + setGlobalPMVariable("screen", screen); + initializeScreenCache(apiClient, screen); + cacheInitialized = true; + + return screen; +} diff --git a/resources/js/next/screenBuilder.js b/resources/js/next/screenBuilder.js index d0d009849e..ee1b45951c 100644 --- a/resources/js/next/screenBuilder.js +++ b/resources/js/next/screenBuilder.js @@ -1,6 +1,7 @@ import { - getGlobalVariable, setGlobalVariable, getGlobalPMVariable, setGlobalPMVariable, + getGlobalVariable, setGlobalVariable, getGlobalPMVariable, } from "./globalVariables"; +import initializeScreenCacheFromMeta from "./initializeScreenCacheFromMeta"; const addScriptsToDOM = async function (scripts) { for (const script of scripts) { @@ -26,24 +27,8 @@ export default () => { import("@processmaker/screen-builder").then((ScreenBuilder) => { const apiClient = getGlobalPMVariable("apiClient"); - const { initializeScreenCache } = ScreenBuilder; - // Configuration Global object used by ScreenBuilder - // @link https://processmaker.atlassian.net/browse/FOUR-6833 Cache configuration - const screenCacheEnabled = document.head.querySelector("meta[name=\"screen-cache-enabled\"]")?.content ?? "false"; - const screenCacheTimeout = document.head.querySelector("meta[name=\"screen-cache-timeout\"]")?.content ?? "5000"; - const screenSecureHandlerToggleVisible = document.head.querySelector("meta[name='screen-secure-handler-toggle-visible']"); - const screenMergeDraftOnRestore = document.head.querySelector("meta[name='screen-merge-draft-on-restore']")?.content ?? "true"; - const screen = { - cacheEnabled: screenCacheEnabled === "true", - cacheTimeout: Number(screenCacheTimeout), - secureHandlerToggleVisible: !!Number(screenSecureHandlerToggleVisible?.content), - mergeDraftOnRestore: screenMergeDraftOnRestore === "true", - }; - setGlobalVariable("ScreenBuilder", ScreenBuilder); - setGlobalPMVariable("screen", screen); - // Initialize screen-builder cache - initializeScreenCache(apiClient, screen);// TODO: Its a bad practice to use the apiClient here + initializeScreenCacheFromMeta(apiClient); if (screenBuilderScripts) { addScriptsToDOM(screenBuilderScripts).then(() => { // The order of the scripts is important, the screenBuilderScripts must be loaded before the ScreenBuilder.default diff --git a/resources/js/processes/screen-builder/loaderScreen.js b/resources/js/processes/screen-builder/loaderScreen.js index d19bafca22..c6ec9b09d5 100644 --- a/resources/js/processes/screen-builder/loaderScreen.js +++ b/resources/js/processes/screen-builder/loaderScreen.js @@ -1,4 +1,5 @@ import * as ScreenBuilder from "@processmaker/screen-builder"; +import initializeScreenCacheFromMeta from "../../next/initializeScreenCacheFromMeta"; import { setupMain } from "../../next/setupMain"; import monaco from "../../next/monaco"; import vueFormElements from "../../next/libraries/vueFormElements"; @@ -10,6 +11,7 @@ import("@processmaker/screen-builder/dist/vue-form-builder.css"); window.ScreenBuilder = ScreenBuilder; setupMain(); +initializeScreenCacheFromMeta(); monaco(); window.Vue.use(ScreenBuilder.default); diff --git a/resources/js/processes/screens/loaderScreenPreview.js b/resources/js/processes/screens/loaderScreenPreview.js index ef6876bfeb..aecdafc591 100644 --- a/resources/js/processes/screens/loaderScreenPreview.js +++ b/resources/js/processes/screens/loaderScreenPreview.js @@ -1,8 +1,11 @@ import * as ScreenBuilder from "@processmaker/screen-builder"; import VueFormElements from "@processmaker/vue-form-elements"; +import initializeScreenCacheFromMeta from "../../next/initializeScreenCacheFromMeta"; import { setupMain } from "../../next/setupMain"; setupMain(); +initializeScreenCacheFromMeta(); + window.ScreenBuilder = ScreenBuilder; window.VueFormElements = VueFormElements; window.Vue.use(ScreenBuilder.default); diff --git a/resources/js/requests/loaderRequestsPreview.js b/resources/js/requests/loaderRequestsPreview.js index c9c5a013f8..0b6cb0f6ab 100644 --- a/resources/js/requests/loaderRequestsPreview.js +++ b/resources/js/requests/loaderRequestsPreview.js @@ -2,12 +2,14 @@ import Mustache from "mustache"; import "../next/libraries/vueFormElements"; import screenBuilder from "../next/screenBuilder"; import * as ScreenBuilder from "@processmaker/screen-builder"; +import initializeScreenCacheFromMeta from "../next/initializeScreenCacheFromMeta"; import { setupMain } from "../next/setupMain"; import "./preview"; import ScreenDetail from "./components/screenDetail.vue"; window.Mustache = Mustache; setupMain(); +initializeScreenCacheFromMeta(); screenBuilder(); Vue.use(ScreenBuilder.default); diff --git a/resources/js/requests/loaderRequestsShow.js b/resources/js/requests/loaderRequestsShow.js index 6160ebe806..ce4a2d577a 100644 --- a/resources/js/requests/loaderRequestsShow.js +++ b/resources/js/requests/loaderRequestsShow.js @@ -1,3 +1,4 @@ +import initializeScreenCacheFromMeta from "../next/initializeScreenCacheFromMeta"; import { setupMain } from "../next/setupMain"; import monaco from "../next/monaco"; import modeler from "../next/modeler"; @@ -9,6 +10,7 @@ import("@processmaker/screen-builder/dist/vue-form-builder.css"); import("@processmaker/vue-form-elements/dist/vue-form-elements.css"); setupMain(); +initializeScreenCacheFromMeta(); monaco(); modeler(); diff --git a/resources/js/tasks/loaderTasks.js b/resources/js/tasks/loaderTasks.js index 8f60a9e4b0..9b1a652275 100644 --- a/resources/js/tasks/loaderTasks.js +++ b/resources/js/tasks/loaderTasks.js @@ -1,10 +1,12 @@ import * as ScreenBuilder from "@processmaker/screen-builder"; import VueFormElement from "../next/libraries/vueFormElements"; +import initializeScreenCacheFromMeta from "../next/initializeScreenCacheFromMeta"; import { setupMain } from "../next/setupMain"; import screenBuilderNext from "../next/screenBuilder"; import "@processmaker/screen-builder/dist/vue-form-builder.css"; setupMain(); +initializeScreenCacheFromMeta(); screenBuilderNext(); window.ScreenBuilder = ScreenBuilder; window.Vue.use(ScreenBuilder.default); diff --git a/resources/js/vite/tasks/loaderTasks.js b/resources/js/vite/tasks/loaderTasks.js index 87bbb2d15c..2a8328b716 100644 --- a/resources/js/vite/tasks/loaderTasks.js +++ b/resources/js/vite/tasks/loaderTasks.js @@ -1,4 +1,5 @@ import "../../../js/vite/bootstrap-globals.js"; +import initializeScreenCacheFromMeta from "../../../js/next/initializeScreenCacheFromMeta"; import { setupMain } from "../../../js/next/setupMain"; import { withMomentDateFormats } from "../../next/config/user"; import vueFormElements from "../../../js/next/libraries/vueFormElements"; @@ -12,6 +13,7 @@ import "@processmaker/screen-builder/dist/vue-form-builder.css"; window.ScreenBuilder = ScreenBuilder; setupMain(); +initializeScreenCacheFromMeta(); screenBuilderNext(); window.Vue.use(ScreenBuilder.default); modeler(); diff --git a/resources/views/layouts/previewscreennextvite.blade.php b/resources/views/layouts/previewscreennextvite.blade.php index 6483134404..eebd271ada 100644 --- a/resources/views/layouts/previewscreennextvite.blade.php +++ b/resources/views/layouts/previewscreennextvite.blade.php @@ -130,7 +130,6 @@ @endforeach -PORE @yield('js')