@joystick.js/cli-canary 0.0.0-canary.1

package/src/functions/push/providers.js

@@ -0,0 +1,6 @@
+export default [
+  // { name: 'AWS', value: 'aws' },
+  { name: 'Digital Ocean', value: 'digitalOcean' },
+  { name: 'Linode', value: 'linode' },
+  { name: 'Vultr', value: 'vultr' },
+];

package/src/functions/reset/reset.js

@@ -0,0 +1,163 @@
+import fs from "fs";
+import util from "util";
+import child_process from "child_process";
+import commandExists from "command-exists";
+import chalk from "chalk";
+import Mongo from "mongodb";
+import ps from "ps-node";
+import mongoUri from "mongo-uri-tool";
+import Loader from "../../lib/loader.js";
+import settings from "../../lib/settings.js";
+
+const exec = util.promisify(child_process.exec);
+
+const resetDatabase = async (mongodb) => {
+  const collections =
+    mongodb && mongodb.db && (await mongodb.db.listCollections().toArray());
+
+  for (let i = 0; i < collections.length; i += 1) {
+    const collectionFromList = collections[i];
+    const collectionName = collectionFromList && collectionFromList.name;
+    const collection = collectionName && mongodb.db.collection(collectionName);
+
+    if (collection) {
+      await collection.deleteMany();
+    }
+  }
+
+  return true;
+};
+
+const handleCleanup = (processIds = []) => {
+  process.loader.stop();
+
+  processIds.forEach((processId) => {
+    ps.kill(processId);
+  });
+
+  process.exit();
+};
+
+const handleSignalEvents = (processIds = []) => {
+  process.on("SIGINT", () => handleCleanup(processIds));
+  process.on("SIGTERM", () => handleCleanup(processIds));
+};
+
+const getMongoProcessId = (stdout = null) => {
+  const forkedProcessId = stdout && stdout.match(/forked process:+\s[0-9]+/gi);
+  const processId =
+    forkedProcessId &&
+    forkedProcessId[0] &&
+    forkedProcessId[0].replace("forked process: ", "");
+
+  return processId && parseInt(processId, 10);
+};
+
+const getConnectionOptions = () => {
+  const mongodbSettings =
+    settings && settings.databases && settings.databases.mongodb;
+  const uri = mongodbSettings && mongodbSettings.uri;
+
+  if (!mongodbSettings || (mongodbSettings && !uri)) {
+    throw new Error(
+      chalk.redBright(
+        "Must have a valid databases.mongodb.uri value in your settings-<env>.json file to connect to MongoDB."
+      )
+    );
+  }
+
+  return {
+    uri,
+    parsedUri: mongoUri.parseUri(uri),
+    options: Object.assign({}, mongodbSettings.options),
+  };
+};
+
+const connectToMongoDB = async () => {
+  const connectionOptions = getConnectionOptions();
+
+  if (!process.mongodb && connectionOptions) {
+    const mongodb = await Mongo.MongoClient.connect(connectionOptions.uri, {
+      poolSize: process.env.NODE_ENV === "development" ? 10 : 100,
+      useNewUrlParser: true,
+      useUnifiedTopology: true,
+      authSource: "admin",
+      ssl: process.env.NODE_ENV !== "development",
+      ...connectionOptions.options,
+    });
+
+    const db = mongodb.db(connectionOptions.parsedUri.db);
+
+    return {
+      db,
+      Collection: db.collection.bind(db),
+      connection: mongodb,
+    };
+  }
+
+  return null;
+};
+
+const startMongoDB = async () => {
+  const dataDirectoryExists = fs.existsSync(".data/mongodb");
+
+  if (!dataDirectoryExists) {
+    fs.mkdirSync(".data/mongodb", { recursive: true });
+  }
+
+  const { stdout } = await exec(
+    "mongod --port 27017 --dbpath ./.data/mongodb --quiet --fork --logpath ./.data/mongodb/log"
+  );
+
+  const mongoProcessId = getMongoProcessId(stdout);
+  process.mongoProcessId = mongoProcessId;
+
+  return mongoProcessId;
+};
+
+const warnMongoDBMissing = () => {
+  console.warn(`
+  ${chalk.red("MongoDB not installed.")}\n
+  ${chalk.green(
+    "Download MongoDB at https://www.mongodb.com/try/download/community"
+  )}
+
+  After installation, try to run this command again to start MongoDB alongside your app.\n
+  `);
+};
+
+const reset = async () => {
+  if (process.env.NODE_ENV !== "development") {
+    console.log(
+      chalk.redBright(
+        "To prevent catastrophic data loss, reset is disabled outside of your development environment."
+      )
+    );
+    process.exit(1);
+  }
+
+  process.isReset = true; // NOTE: Set this so we can signal context to dependencies.
+  process.loader = new Loader();
+  process.loader.start("Resetting database...");
+
+  const mongodbExists = commandExists.sync("mongod");
+
+  if (mongodbExists) {
+    const mongoProcessId = await startMongoDB();
+    handleSignalEvents([mongoProcessId]);
+
+    const mongodb = await connectToMongoDB();
+    await resetDatabase(mongodb);
+
+    ps.kill(mongoProcessId);
+
+    process.loader.stable("Database reset!\n\n");
+    process.exit();
+  } else {
+    process.loader.stop();
+    warnMongoDBMissing();
+    process.exit(1);
+  }
+};
+
+(async () => reset())();

package/src/functions/start/bootstrapLayoutComponent.js

@@ -0,0 +1,57 @@
+import chalk from "chalk";
+import { EXPORT_DEFAULT_REGEX } from "../../lib/regexes.js";
+
+export default () => {
+  return {
+    transform(code, id) {
+      const shouldBootstrap = ["layouts"].some((bootstrapTarget) => {
+        return id.includes(bootstrapTarget);
+      });
+
+      if (shouldBootstrap) {
+        const matches = code.match(EXPORT_DEFAULT_REGEX) || [];
+        const match = matches && matches[0];
+
+        if (!match) {
+          console.log(" ");
+          console.warn(
+            chalk.yellowBright(
+              `All components in the ui/layouts directory must have an export default statement (e.g., export default MyLayout). Please check the file at ${id}.`
+            )
+          );
+          console.log(" ");
+          return null;
+        }
+
+        const matchParts = (match && match.split(" ")) || [];
+        const componentName = matchParts.pop();
+
+        if (componentName) {
+          return {
+            code: code.replace(
+              `${match};`,
+              `if (
+                typeof window !== 'undefined' &&
+                window.__joystick_ssr__ === true &&
+                window.__joystick_layout_page__ &&
+                ui &&
+                ui.mount
+              ) {
+                fetch(window.__joystick_layout_page_url__).then(async (response) => {
+                  const file = await response.text();
+                  const component = eval(file);
+                  ui.mount(${componentName}, Object.assign({ ...window.__joystick_ssr_props__ }, { page: window[window.__joystick_layout_page__].js }), document.getElementById('app'));
+                });
+              }
+            
+            export default ${componentName};
+              `
+            ),
+          };
+        }
+      }
+
+      return null;
+    },
+  };
+};

package/src/functions/start/bootstrapPageComponent.js

@@ -0,0 +1,54 @@
+import chalk from "chalk";
+import { EXPORT_DEFAULT_REGEX } from "../../lib/regexes.js";
+
+export default () => {
+  return {
+    transform(code, id) {
+      const shouldBootstrap = ["pages"].some((bootstrapTarget) => {
+        return id.includes(bootstrapTarget);
+      });
+
+      if (shouldBootstrap) {
+        const matches = code.match(EXPORT_DEFAULT_REGEX) || [];
+        const match = matches && matches[0];
+
+        if (!match) {
+          console.log(" ");
+          console.warn(
+            chalk.yellowBright(
+              `All components in the ui/pages directory must have an export default statement (e.g., export default MyPage). Please check the file at ${id}.`
+            )
+          );
+          console.log(" ");
+          return null;
+        }
+
+        const matchParts = (match && match.split(" ")) || [];
+        const componentName = matchParts.pop();
+
+        if (componentName) {
+          return {
+            code: code.replace(
+              `${match};`,
+              `            
+            if (
+              typeof window !== 'undefined' &&
+              window.__joystick_ssr__ === true &&
+              !window.__joystick_layout_page__ &&
+              ui &&
+              ui.mount
+            ) {
+              ui.mount(${componentName}, window.__joystick_ssr_props__ || {}, document.getElementById('app'));
+            }
+            
+            export default ${componentName};
+              `
+            ),
+          };
+        }
+      }
+
+      return null;
+    },
+  };
+};

package/src/functions/start/buildFile.js

@@ -0,0 +1,97 @@
+import esbuild from "esbuild";
+import svg from "esbuild-plugin-svg";
+import fs from "fs";
+import plugins from "./buildPlugins.js";
+import onWarn from "./onWarn.js";
+import getCodeFrame from "../../lib/getCodeFrame.js";
+
+const configs = {
+  node: (inputPath, outputPath = null, environment = "development") => ({
+    entryPoints: [inputPath],
+    bundle: false,
+    outfile: `${outputPath || "./.joystick/build"}/${inputPath}`,
+    platform: "node",
+    format: "esm",
+    define: {
+      "process.env.NODE_ENV": `'${environment}'`,
+    },
+    // minify: environment !== "development",
+    logLevel: "silent",
+    plugins: [plugins.warnNodeEnvironment, plugins.generateFileDependencyMap],
+  }),
+  browser: (inputPath, outputPath = null, environment = "development") => {
+    return {
+      target: "es2020",
+      entryPoints: [inputPath],
+      bundle: true,
+      outfile: `${outputPath || "./.joystick/build"}/${inputPath}`,
+      platform: "browser",
+      format: "esm",
+      define: {
+        "process.env.NODE_ENV": `'${environment}'`,
+      },
+      // minify: environment !== "development",
+      logLevel: "silent",
+      plugins: [
+        plugins.warnNodeEnvironment,
+        plugins.generateFileDependencyMap,
+        plugins.bootstrapComponent,
+        svg(),
+      ],
+    };
+  },
+};
+
+export default async (
+  file = "",
+  platform = "",
+  outputPath = "",
+  environment = "development"
+) => {
+  return new Promise(async (resolve) => {
+    const config =
+      configs[platform] && configs[platform](file, outputPath, environment);
+
+    if (config) {
+      try {
+        await esbuild.build(config);
+        return resolve({
+          success: true,
+        });
+      } catch (exception) {
+        console.warn(exception);
+        const error = exception?.errors && exception?.errors[0];
+
+        const snippet = fs.existsSync(file)
+          ? getCodeFrame(file, {
+              line: error?.location?.line,
+              column: error?.location?.column,
+            })
+          : null;
+
+        onWarn({
+          file,
+          stack: exception?.stack,
+          line: error?.location?.line,
+          column: error?.location?.column,
+          snippet,
+          lineWithError: error?.location?.lineText?.trim(),
+          message: error?.text,
+        });
+
+        return resolve({
+          success: false,
+          path: file,
+          error: {
+            stack: exception?.stack,
+            snippet,
+          },
+        });
+      }
+    }
+
+    return resolve({
+      success: true,
+    });
+  });
+};

package/src/functions/start/buildFiles.js

@@ -0,0 +1,101 @@
+import fs from "fs-extra";
+import esbuild from "esbuild";
+import filesToCopy from "./filesToCopy.js";
+import buildFile from "./buildFile.js";
+import minifyFile from "./minifyFile.js";
+import getPlatformSafePath from "../../lib/getPlatformSafePath.js";
+
+const getFilePlatform = (path = "") => {
+  let platform = "copy";
+
+  const browserPaths = [
+    getPlatformSafePath("email/"),
+    getPlatformSafePath("lib/"),
+    getPlatformSafePath("lib/browser"),
+    getPlatformSafePath("ui/"),
+    "index.client.js",
+  ];
+
+  const browserExclusions = [getPlatformSafePath("lib/node")];
+
+  const nodePaths = [
+    getPlatformSafePath("api/"),
+    getPlatformSafePath("routes/"),
+    getPlatformSafePath("fixtures/"),
+    getPlatformSafePath("lib/node"),
+    "index.server.js",
+  ];
+
+  const nodeExclusions = [getPlatformSafePath("lib/browser")];
+
+  const isBrowser =
+    browserPaths.some((browserPath) => {
+      return path.includes(browserPath);
+    }) &&
+    !browserExclusions.some((browserExclusionPath) => {
+      return path.includes(browserExclusionPath);
+    });
+
+  const isNode =
+    nodePaths.some((nodePath) => {
+      return path.includes(nodePath);
+    }) &&
+    !nodeExclusions.some((nodeExclusionPath) => {
+      return path.includes(nodeExclusionPath);
+    });
+
+  if (isBrowser) {
+    platform = "browser";
+  }
+
+  if (isNode) {
+    platform = "node";
+  }
+
+  return platform;
+};
+
+const isNotJavaScript = (path = "") => {
+  const extension = path.split(".").pop();
+  return extension && !extension.match(/\js$/);
+};
+
+export default async (
+  filesToBuild = [],
+  outputPath = null,
+  environment = "development"
+) => {
+  return Promise.all(
+    filesToBuild.map(async (fileToBuild) => {
+      const platform = getFilePlatform(fileToBuild);
+      const isFileToCopy =
+        platform === "copy" ||
+        isNotJavaScript(fileToBuild) ||
+        filesToCopy.some((fileToCopy) => {
+          return fileToCopy.regex.test(fileToBuild);
+        });
+
+      if (isFileToCopy) {
+        fs.outputFileSync(
+          `${outputPath || "./.joystick/build"}/${fileToBuild}`,
+          fs.readFileSync(fileToBuild)
+        );
+
+        return fileToBuild;
+      }
+
+      const build = await buildFile(
+        fileToBuild,
+        platform,
+        outputPath,
+        environment
+      );
+
+      if (environment !== 'development') {
+        await minifyFile(`${outputPath || "./.joystick/build"}/${fileToBuild}`);
+      }
+
+      return build;
+    })
+  );
+};

package/src/functions/start/buildPlugins.js

@@ -0,0 +1,215 @@
+import fs from "fs";
+import chalk from "chalk";
+import updateFileMap from "./updateFileMap.js";
+import {
+  JOYSTICK_UI_REGEX,
+  EXPORT_DEFAULT_REGEX,
+  JOYSTICK_COMPONENT_REGEX,
+  JOYSTICK_COMMENT_REGEX,
+} from "../../lib/regexes.js";
+import generateId from "./generateId.js";
+import getPlatformSafePath from "../../lib/getPlatformSafePath.js";
+import setComponentId from "./setComponentId.js";
+
+export default {
+  bootstrapComponent: {
+    name: "bootstrapComponent",
+    setup(build) {
+      // NOTE: Generate SSR ID and then replace the necessary markup. Make contents a let so we can perform
+      // additional modifications below.
+      const ssrId = generateId();
+
+      build.onLoad({ filter: /\.js$/ }, (args = {}) => {
+        try {
+          const shouldSetSSRId = [getPlatformSafePath("ui/")].some(
+            (bootstrapTarget) => {
+              return args.path.includes(bootstrapTarget);
+            }
+          );
+          const isLayoutComponent = [getPlatformSafePath("ui/layouts")].some(
+            (bootstrapTarget) => {
+              return args.path.includes(bootstrapTarget);
+            }
+          );
+          const isPageComponent = [getPlatformSafePath("ui/pages")].some(
+            (bootstrapTarget) => {
+              return args.path.includes(bootstrapTarget);
+            }
+          );
+          const isEmailComponent = [getPlatformSafePath("email/")].some(
+            (bootstrapTarget) => {
+              return args.path.includes(bootstrapTarget);
+            }
+          );
+
+          if (
+            shouldSetSSRId ||
+            isLayoutComponent ||
+            isPageComponent ||
+            isEmailComponent
+          ) {
+            const code = fs.readFileSync(
+              getPlatformSafePath(args.path),
+              "utf-8"
+            );
+
+            // NOTE: Check to see if we have a valid component file.
+            const joystickUIMatches = code.match(JOYSTICK_UI_REGEX) || [];
+            const joystickUIMatch = joystickUIMatches && joystickUIMatches[0];
+            const exportDefaultMatches = code.match(EXPORT_DEFAULT_REGEX) || [];
+            const exportDefaultMatch =
+              exportDefaultMatches && exportDefaultMatches[0];
+
+            if (joystickUIMatch && !exportDefaultMatch) {
+              console.log(" ");
+              console.warn(
+                chalk.yellowBright(
+                  `All Joystick components in the ui directory must have an export default statement (e.g., export default MyComponent, export default MyLayout, or export default MyPage). Please check the file at ${args.path}.`
+                )
+              );
+              console.log(" ");
+              return;
+            }
+
+            let contents = setComponentId(code)?.replace(
+              /\.component\(\/\*\*\//g,
+              ".component("
+            );
+
+            // contents = contents.replace(
+            //   "ui.component({",
+            //   `ui.component({\n  _ssrId: '${ssrId}',`
+            // );
+
+            // NOTE: Remove any commented code inside of render() so it doesn't get rendered during SSR
+            // or in the browser.
+            contents = contents.replace(JOYSTICK_COMMENT_REGEX, "");
+
+            const exportDefaultMatchParts =
+              (exportDefaultMatch && exportDefaultMatch.split(" ")) || [];
+            const componentName = exportDefaultMatchParts.pop();
+
+            if (componentName && isLayoutComponent) {
+              contents = contents.replace(
+                `${exportDefaultMatch};`,
+                `if (
+                  typeof window !== 'undefined' &&
+                  window.__joystick_ssr__ === true &&
+                  window.__joystick_layout_page__ &&
+                  ui &&
+                  ui.mount
+                ) {
+                  (async () => {
+                    const layoutComponentFile = await import(window.__joystick_layout__);
+                    const pageComponentFile = await import(window.window.__joystick_layout_page_url__);
+                    const layout = layoutComponentFile.default;
+                    const page = pageComponentFile.default;
+                    ui.mount(layout, Object.assign({ ...window.__joystick_ssr_props__ }, { page }), document.getElementById('app'));
+                  })();
+                }
+              
+              export default ${componentName};
+                `
+              );
+            }
+
+            if (componentName && isPageComponent) {
+              contents = contents.replace(
+                `${exportDefaultMatch};`,
+                `if (
+                  typeof window !== 'undefined' &&
+                  window.__joystick_ssr__ === true &&
+                  !window.__joystick_layout_page__ &&
+                  ui &&
+                  ui.mount
+                ) {
+                  ui.mount(${componentName}, window.__joystick_ssr_props__ || {}, document.getElementById('app'));
+                }
+                
+                export default ${componentName};
+                `
+              );
+            }
+
+            return {
+              contents,
+              loader: "js",
+            };
+          }
+        } catch (exception) {
+          console.warn(exception);
+        }
+      });
+
+      build.onEnd(() => {
+        return new Promise((resolve) => {
+          const shouldSetComponentId = [
+            getPlatformSafePath("ui/"),
+            getPlatformSafePath("email/"),
+          ].some((bootstrapTarget) => {
+            return build.initialOptions.outfile.includes(bootstrapTarget);
+          });
+
+          if (shouldSetComponentId) {
+            const file = fs.readFileSync(build.initialOptions.outfile, "utf-8");
+            const joystickUIMatches =
+              file?.match(JOYSTICK_COMPONENT_REGEX) || [];
+
+            if (joystickUIMatches?.length > 0) {
+              let contents = setComponentId(file)?.replace(
+                /\.component\(\/\*\*\//g,
+                ".component("
+              );
+              fs.writeFileSync(build.initialOptions.outfile, contents);
+            }
+          }
+
+          resolve();
+        });
+      });
+    },
+  },
+  generateFileDependencyMap: {
+    name: "generateFileDependencyMap",
+    setup(build) {
+      build.onLoad({ filter: /\.js$/ }, (args) => {
+        try {
+          const canAddToMap = ![
+            "node_modules",
+            ".joystick",
+            "?",
+            "commonjsHelpers.js",
+          ].some((excludedPath) => {
+            return getPlatformSafePath(args.path).includes(excludedPath);
+          });
+
+          if (canAddToMap) {
+            const code = fs.readFileSync(
+              getPlatformSafePath(args.path),
+              "utf-8"
+            );
+            updateFileMap(getPlatformSafePath(args.path), code);
+          }
+        } catch (exception) {
+          console.warn(exception);
+        }
+      });
+    },
+  },
+  warnNodeEnvironment: {
+    name: "warnNodeEnvironment",
+    setup(build) {
+      build.onLoad({ filter: /\.js$/ }, (args = {}) => {
+        const code = fs.readFileSync(args.path, "utf-8");
+
+        if (code?.match(/process.env.NODE_ENV\s+=\s/gi)?.length) {
+          console.warn(
+            chalk.yellowBright(
+              "\n[WARNING] process.env.NODE_ENV should only be set via a CLI flag in development or via external environment variables in production.\n"
+            )
+          );
+        }
+      });
+    },
+  },
+};