attio 0.0.1-experimental.20240911.2 → 0.0.1-experimental.20240913

package/lib/build/client/create-client-build-config.js

@@ -1,12 +1,8 @@
 import globalExternals from "@fal-works/esbuild-plugin-global-externals";
 import { proxyServerModulesPlugin } from "../proxy-server-modules-plugin.js";
-export function createClientBuildConfig({ appDir, contents, }) {
+export function createClientBuildConfig({ appDir, entryPoint, }) {
     return {
-        stdin: {
-            contents,
-            resolveDir: ".",
-            loader: "tsx",
-        },
+        entryPoints: [entryPoint],
         logLevel: "silent",
         bundle: true,
         platform: "browser",
@@ -14,7 +10,7 @@ export function createClientBuildConfig({ appDir, contents, }) {
         plugins: [
             globalExternals({
                 "react": "React",
-                "@attio/extension-sdk": {
+                "attio/client": {
                     varName: "ATTIO_CLIENT_EXTENSION_SDK",
                     type: "cjs",
                 },

package/lib/build/client/generate-client-entry.js

@@ -1,7 +1,9 @@
+import fs from "fs/promises";
 import { glob } from "glob";
 import path from "path";
 const ROUTE_FILE_EXTENSIONS = ["tsx", "jsx", "ts", "js"];
-export async function generateClientEntry({ appDir, routes, log, }) {
+const ASSET_FILE_EXTENSIONS = ["png"];
+export async function generateClientEntry({ filePath, appDir, assetsDir, routes, log, }) {
     log?.(`💥 Found entry point at ${path.resolve(appDir)}`);
     const paths = routes.flatMap((route) => ROUTE_FILE_EXTENSIONS.map((fileExtension) => route + "." + fileExtension));
     const concreteRoutes = (await Promise.all(paths.map(async (path) => {
@@ -22,11 +24,36 @@ export async function generateClientEntry({ appDir, routes, log, }) {
             return [];
         }
     }))).flat();
+    let assetFiles;
+    try {
+        assetFiles = await fs.readdir(assetsDir, { recursive: true });
+    }
+    catch {
+        assetFiles = [];
+    }
+    const assets = assetFiles
+        .filter((relativeAssetPath) => ASSET_FILE_EXTENSIONS.some((extension) => relativeAssetPath.endsWith(extension)))
+        .map((relativeAssetPath) => ({
+        path: path.join(assetsDir, relativeAssetPath),
+        name: relativeAssetPath,
+    }));
     return `
 ${concreteRoutes
-        .map((routeAndPath, index) => `import C${index} from ${JSON.stringify(`.${path.sep}${path.join(appDir, routeAndPath.path)}`)}`)
+        .map((routeAndPath, index) => `import C${index} from ${JSON.stringify(path.relative(filePath, path.join(appDir, routeAndPath.path)))}`)
         .join("\n")}
 
+    const assets = []
+
+${assets
+        .map((asset, index) => `
+import A${index} from ${JSON.stringify(path.relative(filePath, asset.path))};
+            
+assets.push({name: ${JSON.stringify(asset.name)}, data: A${index}})
+            `)
+        .join("\n")}
+
+registerAssets(assets)
+
 ${concreteRoutes
         .map((routeAndPath, index) => `registerExtensionComponent({route: ${JSON.stringify(routeAndPath.route)}, component: C${index}})`)
         .join("\n")}

package/lib/build/server/create-server-build-config.js

@@ -1,17 +1,13 @@
 import globalExternals from "@fal-works/esbuild-plugin-global-externals";
-export function createServerBuildConfig(contents) {
+export function createServerBuildConfig(entryPoint) {
     return {
-        stdin: {
-            contents,
-            resolveDir: ".",
-            loader: "ts",
-        },
+        entryPoints: [entryPoint],
         bundle: true,
         platform: "browser",
         format: "esm",
         plugins: [
             globalExternals({
-                "@attio/extension-sdk": {
+                "attio/client": {
                     varName: "ATTIO_CLIENT_EXTENSION_SDK",
                     type: "cjs",
                 },

package/lib/build/server/generate-server-entry.js

@@ -1,55 +1,89 @@
 import { glob } from "glob";
 import path from "path";
 import { getModuleHash } from "../get-module-hash.js";
-export async function generateServerEntry({ appDir, log, }) {
-    const concretePaths = (await Promise.all([
-        glob("**/*.server.ts", { nodir: true, cwd: appDir }),
-        glob("**/*.server.js", { nodir: true, cwd: appDir }),
-    ])).flat();
-    const modules = concretePaths.map((path) => ({
+export async function generateServerEntry({ appDir, webhooksDir, filePath, log, }) {
+    const [serverFunctionConcretePaths, webhookConcretePaths] = await Promise.all([
+        Promise.all([
+            glob("**/*.server.ts", { nodir: true, cwd: appDir }),
+            glob("**/*.server.js", { nodir: true, cwd: appDir }),
+        ]).then((paths) => paths.flat()),
+        Promise.all([
+            glob("**/*.webhook.ts", { nodir: true, cwd: webhooksDir }),
+            glob("**/*.webhook.js", { nodir: true, cwd: webhooksDir }),
+        ]).then((paths) => paths.flat()),
+    ]);
+    const serverFunctionModules = serverFunctionConcretePaths.map((path) => ({
         path,
         hash: getModuleHash(path.replace(/\.(js|ts)$/, "")),
     }));
-    for (const module of modules) {
+    const webhookModules = webhookConcretePaths.map((path) => ({
+        path,
+        id: path.replace(/\.webhook\.(js|ts)$/, ""),
+    }));
+    for (const module of serverFunctionModules) {
         log?.(`🔎 Found server module "${module.path}"`);
     }
     return `
     
         const modules = new Map()
-
+        const webhookModules = new Map()
 
     
-        ${modules
-        .map((module) => `modules.set("${module.hash}", () => import(${JSON.stringify(`.${path.sep}${path.join(appDir, module.path)}`)}))`)
+        ${serverFunctionModules
+        .map((module) => `modules.set("${module.hash}", () => import(${JSON.stringify(path.relative(filePath, path.join(appDir, module.path)))}))`)
         .join("\n")}
 
+        ${webhookModules
+        .map((module) => `webhookModules.set("${module.id}", () => import(${JSON.stringify(path.relative(filePath, path.join(webhooksDir, module.path)))}))`)
+        .join("\n")}
 
-var stdin_default;
-function main() {
-    stdin_default = async function(moduleHash, args) {
+        var stdin_default;
+        var stdin_webhooks_default;
+        function main() {
+            stdin_default = async function(moduleHash, args) {
+                const module = modules.get(moduleHash)
 
+                if (!module) {
+                    throw new Error(\`Module \${moduleHash} not found\`)
+                }
 
-        const module = modules.get(moduleHash)
+                const func = (await module()).default
 
-        if (!module) {
-            throw new Error(\`Module \${moduleHash} not found\`)
-        }
+                if (!func) {
+                    throw new Error(\`Default export not found in module \${moduleHash}\`)
+                }
 
-        const func = (await module()).default
+                if (typeof func !== "function") {
+                    throw new Error(\`\${moduleHash} does not export a function\`)
+                }
 
-        if (!func) {
-            throw new Error(\`Default export not found in module \${moduleHash}\`)
-        }
+                return func(...args)
+            }
+
+            stdin_webhooks_default = async function(webhookModuleId, args) {
+                const module = webhookModules.get(webhookModuleId)
 
-        if (typeof func !== "function") {
-            throw new Error(\`\${moduleHash} does not export a function\`)
+                if (!module) {
+                    throw new Error(\`Webhook handler not found: \${webhookModuleId}\`)
+                }
+
+                const func = (await module()).default
+
+                if (!func) {
+                    throw new Error(\`Default export not found in module \${webhookModuleId}\`)
+                }
+
+                if (typeof func !== "function") {
+                    throw new Error(\`\${webhookModuleId} does not export a function\`)
+                }
+
+                return func(...args)
+            }
         }
 
-        return func(...args)
-    }
-}
 
-main()
+
+        main()
 
 `;
 }

package/lib/machines/dev-machine.js

@@ -93,7 +93,7 @@ export const devMachine = setup({
             upload().catch((error) => sendBack({ type: "Upload Error", error }));
         }),
         watch: fromCallback(({ sendBack }) => {
-            const watcher = chokidar.watch("src/app");
+            const watcher = chokidar.watch(["src/app", "src/assets", "src/webhooks"]);
             watcher.on("ready", () => watcher.on("all", () => {
                 sendBack({ type: "Change" });
             }));

package/lib/machines/js-machine.js

@@ -1,5 +1,7 @@
 import * as esbuild from "esbuild";
+import fs from "fs/promises";
 import path from "path";
+import tmp from "tmp-promise";
 import { assign, setup, fromCallback, sendTo } from "xstate";
 import { ROUTES, errorSchema } from "../build.js";
 import { createClientBuildConfig } from "../build/client/create-client-build-config.js";
@@ -20,20 +22,85 @@ export const jsMachine = setup({
             let buildContexts;
             const prepare = async () => {
                 const appDir = "src/app";
+                const assetsDir = "src/assets";
+                const webhooksDir = "src/webhooks";
                 const log = (message) => {
                     sendBack({ type: "Log", message });
                 };
                 buildContexts = (await Promise.all([
-                    generateClientEntry({ appDir, routes: ROUTES, log }).then(async (contents) => await esbuild.context({
-                        ...createClientBuildConfig({ contents, appDir }),
-                        write,
-                        outfile: path.resolve("dist", "index.js"),
-                    })),
-                    generateServerEntry({ appDir, log }).then(async (contents) => await esbuild.context({
-                        ...createServerBuildConfig(contents),
-                        write,
-                        outfile: path.resolve("dist", "server.js"),
-                    })),
+                    tmp.file({ postfix: ".js" }).then(async (tempFile) => {
+                        let lastJS;
+                        const updateTempFile = async () => {
+                            const js = await generateClientEntry({
+                                filePath: tempFile.path,
+                                appDir,
+                                assetsDir,
+                                routes: ROUTES,
+                                log,
+                            });
+                            if (js === lastJS) {
+                                return;
+                            }
+                            lastJS = js;
+                            await fs.writeFile(tempFile.path, js);
+                        };
+                        await updateTempFile();
+                        const esbuildContext = await esbuild.context({
+                            ...createClientBuildConfig({
+                                entryPoint: tempFile.path,
+                                appDir,
+                            }),
+                            write,
+                            outfile: path.resolve("dist", "index.js"),
+                            loader: { ".png": "dataurl" },
+                        });
+                        return {
+                            rebuild: async () => {
+                                await updateTempFile();
+                                return esbuildContext.rebuild();
+                            },
+                            dispose: async () => {
+                                await Promise.all([
+                                    esbuildContext.dispose(),
+                                    tempFile.cleanup(),
+                                ]);
+                            },
+                        };
+                    }),
+                    tmp.file({ postfix: ".js" }).then(async (tempFile) => {
+                        let lastJS;
+                        const updateTempFile = async () => {
+                            const js = await generateServerEntry({
+                                filePath: tempFile.path,
+                                appDir,
+                                webhooksDir,
+                                log,
+                            });
+                            if (js === lastJS) {
+                                return;
+                            }
+                            lastJS = js;
+                            await fs.writeFile(tempFile.path, js);
+                        };
+                        await updateTempFile();
+                        const esbuildContext = await esbuild.context({
+                            ...createServerBuildConfig(tempFile.path),
+                            write,
+                            outfile: path.resolve("dist", "server.js"),
+                        });
+                        return {
+                            rebuild: async () => {
+                                await updateTempFile();
+                                return esbuildContext.rebuild();
+                            },
+                            dispose: async () => {
+                                await Promise.all([
+                                    esbuildContext.dispose(),
+                                    tempFile.cleanup(),
+                                ]);
+                            },
+                        };
+                    }),
                 ])).flat();
                 sendBack({
                     type: "Build Contexts Prepared",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "attio",
-  "version": "0.0.1-experimental.20240911.2",
+  "version": "0.0.1-experimental.20240913",
   "files": [
     "lib",
     "attio.js",