Detect custom component usages in screens and save metadata in app doc

packages/server/src/api/controllers/screen.js

@@ -1,7 +1,14 @@
-const { getScreenParams, generateScreenID } = require("../../db/utils")
+const {
+  getScreenParams,
+  generateScreenID,
+  getPluginParams,
+  DocumentTypes,
+} = require("../../db/utils")
 const { AccessController } = require("@budibase/backend-core/roles")
 const { getAppDB } = require("@budibase/backend-core/context")
 const { events } = require("@budibase/backend-core")
+const { getGlobalDB } = require("@budibase/backend-core/tenancy")
+import { updateAppPackage } from "./application"
 
 exports.fetch = async ctx => {
   const db = getAppDB()
@@ -32,6 +39,48 @@ exports.save = async ctx => {
 
   const response = await db.put(screen)
 
+  // Find any custom components being used
+  let pluginNames = []
+  findPlugins(screen.props, pluginNames)
+  if (pluginNames.length) {
+    const globalDB = getGlobalDB()
+    const pluginsResponse = await globalDB.allDocs(
+      getPluginParams(null, {
+        include_docs: true,
+      })
+    )
+    const requiredPlugins = pluginsResponse.rows
+      .map(row => row.doc)
+      .filter(plugin => {
+        return (
+          plugin.schema.type === "component" &&
+          pluginNames.includes(`plugin/${plugin.name}/${plugin.version}`)
+        )
+      })
+
+    // Update the app metadata
+    const application = await db.get(DocumentTypes.APP_METADATA)
+    let usedPlugins = application.usedPlugins || []
+
+    let pluginAdded = false
+    requiredPlugins.forEach(plugin => {
+      if (!usedPlugins.find(x => x._id === plugin._id)) {
+        pluginAdded = true
+        usedPlugins.push({
+          _id: plugin._id,
+          name: plugin.name,
+          version: plugin.version,
+          jsUrl: plugin.jsUrl,
+        })
+      }
+    })
+
+    if (pluginAdded) {
+      console.log("plugin added! new plugins", usedPlugins)
+      await updateAppPackage({ usedPlugins }, ctx.appId)
+    }
+  }
+
   if (eventFn) {
     await eventFn(screen)
   }
@@ -56,3 +105,18 @@ exports.destroy = async ctx => {
   }
   ctx.status = 200
 }
+
+const findPlugins = (component, foundPlugins) => {
+  if (!component) {
+    return
+  }
+  if (component._component.startsWith("plugin")) {
+    if (!foundPlugins.includes(component._component)) {
+      foundPlugins.push(component._component)
+    }
+  }
+  if (!component._children || !component._children.length) {
+    return
+  }
+  component._children.forEach(child => findPlugins(child, foundPlugins))
+}