Insert script tags for custom component bundles to app preview

packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/AppPreview.svelte

@@ -41,10 +41,23 @@
   }
 
   // Construct iframe template
-  $: template = iframeTemplate.replace(
+  $: pluginLinks = generatePluginLinks($store.usedPlugins)
-    /\{\{ CLIENT_LIB_PATH }}/,
+  $: template = iframeTemplate
-    $store.clientLibPath
+    .replace(/\{\{ CLIENT_LIB_PATH }}/, $store.clientLibPath)
-  )
+    .replace(/\{\{ PLUGINS }}/, pluginLinks)
+
+  const generatePluginLinks = plugins => {
+    if (!plugins?.length) {
+      return ""
+    }
+    return plugins
+      .map(plugin => {
+        // Split up like this as otherwise parsing fails because the script
+        // tags confuse svelte
+        return `<` + `script src="/plugins/${plugin.jsUrl}"></` + `script>`
+      })
+      .join("")
+  }
 
   const placeholderScreen = new Screen()
     .name("Screen Placeholder")
@@ -92,6 +105,7 @@
         ? [$store.componentToPaste?._id]
         : [],
     isBudibaseEvent: true,
+    usedPlugins: $store.usedPlugins,
   }
 
   // Refresh the preview when required

packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/iframeTemplate.js

@@ -37,9 +37,7 @@ export default `
       }
     </style>
     <script src='{{ CLIENT_LIB_PATH }}'></script>
-    <script
+    {{ PLUGINS }}
-      type="application/javascript"
-      src="https://cdn.kingston.dev/plugin.min.js"></script>
     <script>
       function receiveMessage(event) { 
         if (!event.data) {