diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index ff551751da..be553066b9 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -42,6 +42,7 @@ const INITIAL_FRONTEND_STATE = { libraries: null, appId: "", routes: {}, + clientLibPath: "", } export const getFrontendStore = () => { @@ -49,7 +50,7 @@ export const getFrontendStore = () => { store.actions = { initialise: async pkg => { - const { layouts, screens, application } = pkg + const { layouts, screens, application, clientLibPath } = pkg const components = await fetchComponentLibDefinitions(application._id) store.update(state => ({ ...state, @@ -63,6 +64,7 @@ export const getFrontendStore = () => { screens, hasAppPackage: true, appInstance: application.instance, + clientLibPath, })) await hostingStore.actions.fetch() diff --git a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte index 45607431e4..cb56877ae3 100644 --- a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte +++ b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte @@ -18,6 +18,12 @@ .instanceName("Content Placeholder") .json() + // Construct iframe template + $: template = iframeTemplate.replace( + /\{\{ CLIENT_LIB_PATH }}/, + $store.clientLibPath + ) + // Extract data to pass to the iframe $: { if ($store.currentFrontEndType === FrontendTypes.LAYOUT) { @@ -76,7 +82,7 @@ style="height: 100%; width: 100%" title="componentPreview" bind:this={iframe} - srcdoc={iframeTemplate} /> + srcdoc={template} /> - +