@mochabug/adaptkit 1.0.0-beta.12 → 1.0.0-beta.3

package/assets/build-client.js

@@ -1,7 +1,5 @@
 import { build } from 'esbuild';
-import { sync as glob } from 'glob';
 import fs from 'node:fs';
-import path from 'node:path';
 
 if (!process.env.PLUGINS_CDN) {
   console.error('PLUGINS_CDN is required');
@@ -15,93 +13,34 @@ if (!manifest.organization || !manifest.name || !manifest.version) {
 }
 const CDN_PATH = `${process.env.PLUGINS_CDN}/${manifest.organization}/${manifest.name}/${manifest.version}`;
 
-fs.rmSync('./cdn', { recursive: true });
+if (fs.existsSync('cdn')) {
+  fs.rmSync('cdn', { recursive: true, force: true })
+}
 
-// Build the client and place all the assets onto the corresponding CDN for the plugin
-const loader = {
-  '.css': 'css',
-  '.woff': 'file',
-  '.woff2': 'file',
-  '.png': 'file',
-  '.jpg': 'file',
-  '.jpeg': 'file',
-  '.gif': 'file',
-  '.svg': 'file',
-  '.ttf': 'file',
-  '.otf': 'file',
-};
-const result = await build({
-  entryPoints: glob('./src/vertices/**/ui/*.main.tsx'),
+build({
+  entryPoints: [___ENTRYPOINTS___],
   outdir: 'cdn',
   bundle: true,
   minify: true,
+  sourcemap: true,
   platform: 'browser',
   splitting: true,
-  tsconfig: 'tsconfig.json',
   format: 'esm',
-  metafile: true,
-  publicPath: CDN_PATH,
-  loader,
-});
-
-const entrypoints = {
-  configurators: {},
-  executors: {},
-  vertices: [],
-};
-for (const [outputPath, outputMeta] of Object.entries(result.metafile.outputs)) {
-  if (!outputMeta.entryPoint) {
-    continue;
-  }
-  let vertex = path.dirname(path.dirname(path.relative('./src/vertices', outputMeta.entryPoint)));
-  if (entrypoints.vertices.findIndex((v) => v === vertex) === -1 && manifest.vertices.find((v) => v.name === vertex)) {
-    entrypoints.vertices.push(vertex);
-  }
-  if (outputMeta.entryPoint.endsWith('executor.main.tsx')) {
-    entrypoints.executors[vertex] = { js: `${CDN_PATH}/${outputPath.substring(4)}` };
-    if (outputMeta.cssBundle) {
-      entrypoints.executors[vertex].css = `${CDN_PATH}/${outputMeta.cssBundle.substring(4)}`;
-    }
-  } else if (outputMeta.entryPoint.endsWith('configurator.main.tsx')) {
-    entrypoints.configurators[vertex] = { js: `${CDN_PATH}/${outputPath.substring(4)}` };
-    if (outputMeta.cssBundle) {
-      entrypoints.configurators[vertex].css = `${CDN_PATH}/${outputMeta.cssBundle.substring(4)}`;
-    }
-  }
-}
-
-// Build the static site, make sure that we have the CDN as the public path for the assets
-await build({
-  entryPoints: glob('./src/vertices/**/*.ssg.tsx'),
-  outdir: 'dist',
-  tsconfig: 'tsconfig.json',
-  bundle: true,
-  platform: 'node',
-  format: 'cjs',
-  target: 'esnext',
   publicPath: CDN_PATH,
-  loader,
-  outExtension: {
-    '.js': '.cjs',
+  metafile: true,
+  loader: {
+    '.css': 'css',
+    '.woff': 'file',
+    '.woff2': 'file',
+    '.png': 'file',
+    '.jpg': 'file',
+    '.jpeg': 'file',
+    '.gif': 'file',
+    '.svg': 'file',
+    '.ttf': 'file',
+    '.otf': 'file',
   },
-});
-
-const configIndices = {};
-for (const file of glob('./dist/**/configurator.ssg.cjs')) {
-  const { default: render } = await import(`file://${path.resolve(file)}`);
-  const vertex = entrypoints.vertices.length === 1 ? entrypoints.vertices[0] : path.dirname(path.dirname(path.relative('./dist', file)));
-  const entrypoint = entrypoints.configurators[vertex];
-  if (entrypoint) {
-    configIndices[vertex] = render.default(entrypoint.js, entrypoint.css);
-  }
-}
-fs.writeFileSync('./dist/configurator-index-html.json', JSON.stringify(configIndices));
-const execIndices = {};
-for (const file of glob('./dist/**/executor.ssg.cjs')) {
-  const { default: render } = await import(`file://${path.resolve(file)}`);
-  const vertex = entrypoints.vertices.length === 1 ? entrypoints.vertices[0] : path.dirname(path.dirname(path.relative('./dist', file)));
-
-  const entrypoint = entrypoints.executors[vertex];
-  execIndices[vertex] = render.default(entrypoint.js, entrypoint.css);
-}
-fs.writeFileSync('./dist/executor-index-html.json', JSON.stringify(execIndices));
+}).catch((err) => {
+  console.error(err);
+  process.exit(1);
+});

package/assets/build.js

@@ -17,31 +17,20 @@ const CDN_PATH = `${process.env.PLUGINS_CDN}/${manifest.organization}/${manifest
 
 const { env } = defineEnv({ nodeCompat: true, presets: [cloudflare] });
 
+if (fs.existsSync('dist')) {
+  fs.rmSync('dist', { recursive: true, force: true })
+}
 const entryPoints = ['./src/executors']
 if (fs.existsSync('./src/configurators.ts')) {
   entryPoints.push('./src/configurators')
 }
 
-// Set up the defines, this will automatically load ssg index.html files if they exists
-const define = {
-  PLUGINS_CDN: JSON.stringify(CDN_PATH)
-};
-if (fs.existsSync('./dist/configurator-index-html.json')) {
-  const CONFIGURATOR_INDEX_HTML = fs.readFileSync('./dist/configurator-index-html.json', 'utf8');
-  define.CONFIGURATOR_INDEX_HTML = CONFIGURATOR_INDEX_HTML;
-}
-if (fs.existsSync('./dist/executor-index-html.json')) {
-  const EXECUTOR_INDEX_HTML = fs.readFileSync('./dist/executor-index-html.json', 'utf8');
-  define.EXECUTOR_INDEX_HTML = EXECUTOR_INDEX_HTML;
-}
-
-await build({
+build({
   entryPoints,
   outdir: 'dist',
   bundle: true,
   minify: true,
   treeShaking: true,
-  sourcemap: false,
   splitting: false,
   format: 'esm',
   platform: 'node',
@@ -52,6 +41,10 @@ await build({
   conditions: ["workerd"],
   external: env.external,
   alias: env.alias,
-  publicPath: CDN_PATH,
-  define,
+  define: {
+    PLUGINS_CDN: JSON.stringify(CDN_PATH),
+  }
+}).catch((error) => {
+  console.error(error)
+  process.exit(1)
 });

package/assets/configurator_react.tsx

@@ -6,6 +6,9 @@ import {
   ExternalConfiguratorRouter,
   InternalConfiguratorRouter
 } from '@mochabug/adapt-plugin-toolkit/router';
+import React from 'react';
+import { renderToString } from 'react-dom/server';
+import App from './../../frontend/___APP_IMPORT___';
 
 export default {
   external: new ExternalConfiguratorRouter()
@@ -30,9 +33,25 @@ export default {
       });
     })
     .add('GET', '{*any}', async () => {
-      return new Response(CONFIGURATOR_INDEX_HTML['___VERTEX_NAME___'], {
-        headers: { 'Content-Type': 'text/html' }
+      return new Response(readIndexHtml(), {
+        headers: {
+          'Content-Type': 'text/html; charset=utf-8'
+        }
       });
     }),
   internal: new InternalConfiguratorRouter()
 };
+function readIndexHtml() {
+  return `
+  <!DOCTYPE html>
+  <html>
+    <head>
+      <title>My SSR App</title>
+    </head>
+    <body>
+      <div id="root">${renderToString(<App />)}</div>
+      <script type="module" src="${PLUGINS_CDN}/___CLIENT__NAME___.js"></script>
+    </body>
+  </html>
+`;
+}

package/assets/executor_browser_react.tsx

@@ -6,6 +6,9 @@ import {
   ExternalExecutorRouter,
   InternalExecutorRouter
 } from '@mochabug/adapt-plugin-toolkit/router';
+import React from 'react';
+import { renderToString } from 'react-dom/server';
+import App from './../../frontend/___APP_IMPORT___';
 
 export default {
   external: new ExternalExecutorRouter()
@@ -27,8 +30,10 @@ export default {
       return new Response();
     })
     .add('GET', '{*any}', async () => {
-      return new Response(EXECUTOR_INDEX_HTML['___VERTEX_NAME___'], {
-        headers: { 'Content-Type': 'text/html' }
+      return new Response(readIndexHtml(), {
+        headers: {
+          'Content-Type': 'text/html; charset=utf-8'
+        }
       });
     }),
   internal: new InternalExecutorRouter()
@@ -49,3 +54,17 @@ export default {
       console.log(res);
     })
 };
+function readIndexHtml() {
+  return `
+  <!DOCTYPE html>
+  <html>
+    <head>
+      <title>My SSR App</title>
+    </head>
+    <body>
+      <div id="root">${renderToString(<App />)}</div>
+      <script type="module" src="${PLUGINS_CDN}/___CLIENT__NAME___.js"></script>
+    </body>
+  </html>
+`;
+}

package/assets/global.d.ts

@@ -1,7 +1,5 @@
 declare global {
   const PLUGINS_CDN: string;
-  const CONFIGURATOR_INDEX_HTML: Record<string, string>;
-  const EXECUTOR_INDEX_HTML: Record<string, string>;
 }
 
 export {};

package/assets/inject.js

@@ -9,6 +9,13 @@ import consoleModule from '@cloudflare/unenv-preset/runtime/node/console/index'
 if (typeof globalThis.console === 'undefined') {
   globalThis.console = consoleModule
 }
+import * as timers from '@cloudflare/unenv-preset/runtime/node/timers/index'
+if (typeof globalThis.setImmediate === 'undefined') {
+  globalThis.setImmediate = timers.setImmediate
+}
+if (typeof globalThis.clearImmediate === 'undefined') {
+  globalThis.clearImmediate = timers.clearImmediate
+}
 import perfModule from 'unenv/runtime/polyfill/performance'
 if (typeof globalThis.performance === 'undefined') {
   globalThis.performance = perfModule

package/assets/react_client.tsx

@@ -0,0 +1,5 @@
+import React from 'react';
+import { hydrateRoot } from 'react-dom/client';
+import App from '___APP_IMPORT___';
+
+hydrateRoot(document.getElementById('root')!, <App />);