@eventra_dev/eventra-cli 0.0.4 → 0.0.6

package/src/commands/sync.ts

@@ -1,31 +1,39 @@
-import { Project, SyntaxKind } from "ts-morph";
-import fg from "fast-glob";
 import chalk from "chalk";
-import inquirer from "inquirer";
+import fg from "fast-glob";
+import { Project } from "ts-morph";
+import fs from "fs/promises";
+
 import {
   loadConfig,
   saveConfig
 } from "../utils/config";
 
+import { detectParser } from "../utils/parsers/router";
+import { parseVue } from "../utils/parsers/vue";
+import { parseSvelte } from "../utils/parsers/svelte";
+import { parseAstro } from "../utils/parsers/astro";
+
+import { scanTrack } from "../utils/scanners/track";
+import { scanFunctionWrappers } from "../utils/scanners/function-wrappers";
+import { scanComponentWrappers } from "../utils/scanners/component-wrappers";
+
 export async function sync() {
-  let config = await loadConfig();
+  const config = await loadConfig();
 
   if (!config) {
     console.log(
-      chalk.red(
-        "Run 'eventra init' first"
-      )
+      chalk.red("Run 'eventra init'")
     );
     return;
   }
 
-  const events = new Set<string>();
-  const project = new Project();
-
   console.log(
     chalk.blue("Scanning project...")
   );
 
+  const project = new Project();
+  const events = new Set<string>();
+
   const files = await fg(
     config.sync.include,
     {
@@ -33,365 +41,78 @@ export async function sync() {
     }
   );
 
-  // track()
-  for (const file of files) {
-    const sourceFile =
-      project.addSourceFileAtPath(file);
-
-    const calls =
-      sourceFile.getDescendantsOfKind(
-        SyntaxKind.CallExpression
-      );
-
-    for (const call of calls) {
-      const expression =
-        call.getExpression();
-
-      if (
-        expression.getKind() ===
-        SyntaxKind.PropertyAccessExpression
-      ) {
-        const prop =
-          expression.asKind(
-            SyntaxKind.PropertyAccessExpression
-          );
-
-        if (!prop) continue;
-
-        if (prop.getName() !== "track")
-          continue;
-
-        const args =
-          call.getArguments();
-
-        const eventArg =
-          args[0];
-
-        if (!eventArg) continue;
-
-        let event: string | null = null;
-
-        // "event"
-        if (
-          eventArg.getKind() ===
-          SyntaxKind.StringLiteral
-        ) {
-          event =
-            eventArg
-              .asKindOrThrow(
-                SyntaxKind.StringLiteral
-              )
-              .getLiteralText();
-        }
-
-        // `event`
-        if (
-          eventArg.getKind() ===
-          SyntaxKind.NoSubstitutionTemplateLiteral
-        ) {
-          event =
-            eventArg
-              .asKindOrThrow(
-                SyntaxKind.NoSubstitutionTemplateLiteral
-              )
-              .getLiteralText();
-        }
-
-        if (event) {
-          events.add(event);
-        }
-      }
-    }
-  }
-
-  console.log(
-    chalk.green(
-      `Found ${events.size} track events`
-    )
-  );
-
-  // wrappers setup
-  if (!config.wrappers.length) {
-    const { useWrapper } =
-      await inquirer.prompt([
-        {
-          type: "confirm",
-          name: "useWrapper",
-          message:
-            "Use wrapper components?",
-          default: true
-        }
-      ]);
-
-    if (useWrapper) {
-      const wrappers = [];
-
-      let addMore = true;
-
-      while (addMore) {
-        const answers =
-          await inquirer.prompt([
-            {
-              type: "input",
-              name: "name",
-              message:
-                "Wrapper component name:"
-            },
-            {
-              type: "input",
-              name: "prop",
-              message:
-                "Event prop name:"
-            }
-          ]);
-
-        wrappers.push({
-          name: answers.name,
-          prop: answers.prop
-        });
-
-        const more =
-          await inquirer.prompt([
-            {
-              type: "confirm",
-              name: "more",
-              message:
-                "Add another wrapper?",
-              default: false
-            }
-          ]);
-
-        addMore = more.more;
-      }
-
-      config.wrappers = wrappers;
-    }
-  }
-
-  // scan wrappers
-  if (config.wrappers.length) {
-    console.log(
-      chalk.blue(
-        "Scanning wrappers..."
-      )
+  const functionWrappers =
+    (config.functionWrappers ?? []).map(
+      (w) => ({
+        ...w,
+        path: w.path ?? "0"
+      })
     );
 
-    for (const file of files) {
-      const sourceFile =
-        project.addSourceFileAtPath(file);
-
-      const elements = [
-        ...sourceFile.getDescendantsOfKind(
-          SyntaxKind.JsxOpeningElement
-        ),
-        ...sourceFile.getDescendantsOfKind(
-          SyntaxKind.JsxSelfClosingElement
-        )
-      ];
-
-      for (const element of elements) {
-        const tagName =
-          element
-            .getTagNameNode()
-            .getText()
-            .toLowerCase();
-
-        for (const wrapper of config.wrappers) {
-          if (
-            tagName !==
-            wrapper.name.toLowerCase()
-          )
-            continue;
+  const componentWrappers =
+    config.wrappers ?? [];
 
-          const attrs =
-            element.getAttributes();
-
-          for (const attr of attrs) {
-            if (
-              attr.getKind() !==
-              SyntaxKind.JsxAttribute
-            )
-              continue;
-
-            const attrNode =
-              attr.asKind(
-                SyntaxKind.JsxAttribute
-              );
-
-            if (!attrNode) continue;
-
-            const attrName =
-              attrNode
-                .getNameNode()
-                .getText()
-                .toLowerCase();
-
-            if (
-              attrName !==
-              wrapper.prop.toLowerCase()
-            )
-              continue;
-
-            const initializer =
-              attrNode.getInitializer();
-
-            if (!initializer) continue;
-
-            let value: string | null = null;
-
-            // event="signup"
-            if (
-              initializer.getKind() ===
-              SyntaxKind.StringLiteral
-            ) {
-              value =
-                initializer
-                  .asKindOrThrow(
-                    SyntaxKind.StringLiteral
-                  )
-                  .getLiteralText();
-            }
-
-            // event={"signup"}
-            if (
-              initializer.getKind() ===
-              SyntaxKind.JsxExpression
-            ) {
-              const expr =
-                initializer
-                  .asKindOrThrow(
-                    SyntaxKind.JsxExpression
-                  )
-                  .getExpression();
-
-              if (
-                expr?.getKind() ===
-                SyntaxKind.StringLiteral
-              ) {
-                value =
-                  expr
-                    .asKindOrThrow(
-                      SyntaxKind.StringLiteral
-                    )
-                    .getLiteralText();
-              }
-            }
-
-            if (value) {
-              events.add(value);
-            }
-          }
-        }
-      }
-    }
-  }
-
-  // results
-  const list =
-    [...events].sort();
-
-  console.log("");
-
-  console.log(
-    chalk.green("Found events:")
-  );
-
-  list.forEach((e) =>
-    console.log(
-      chalk.gray(`- ${e}`)
-    )
-  );
-
-  console.log("");
+  for (const file of files) {
+    const parser =
+      detectParser(file);
 
-  // diff
-  const previous =
-    config.events ?? [];
+    let content =
+      await fs.readFile(
+        file,
+        "utf-8"
+      );
 
-  const added = list.filter(
-    (e) => !previous.includes(e)
-  );
+    if (parser === "vue")
+      content = parseVue(content);
 
-  const removed =
-    previous.filter(
-      (e: string) =>
-        !list.includes(e)
-    );
+    if (parser === "svelte")
+      content = parseSvelte(content);
 
-  if (added.length || removed.length) {
-    console.log(
-      chalk.blue("Changes:")
-    );
+    if (parser === "astro")
+      content = parseAstro(content);
 
-    if (added.length) {
-      console.log(
-        chalk.green(
-          "New events:"
-        )
-      );
+    const virtualFile =
+      parser === "ts"
+        ? file
+        : file + ".tsx";
 
-      added.forEach((e) =>
-        console.log(
-          chalk.green(
-            `+ ${e}`
-          )
-        )
+    const source =
+      project.createSourceFile(
+        virtualFile,
+        content,
+        { overwrite: true }
       );
-    }
 
-    if (removed.length) {
-      console.log(
-        chalk.red(
-          "Removed events:"
-        )
-      );
+    scanTrack(source).forEach(
+      (e) => events.add(e)
+    );
 
-      removed.forEach((e: unknown) =>
-        console.log(
-          chalk.red(
-            `- ${e}`
-          )
-        )
-      );
-    }
 
-    console.log("");
-  } else {
-    console.log(
-      chalk.gray(
-        "No changes detected"
-      )
+    scanFunctionWrappers(
+      source,
+      functionWrappers
+    ).forEach((e) =>
+      events.add(e)
     );
-  }
-
-  // confirm
-  const { confirm } =
-    await inquirer.prompt([
-      {
-        type: "confirm",
-        name: "confirm",
-        message:
-          "Sync these events?",
-        default: true
-      }
-    ]);
 
-  if (!confirm) {
-    console.log(
-      chalk.yellow(
-        "Sync cancelled"
-      )
+    scanComponentWrappers(
+      source,
+      componentWrappers
+    ).forEach((e) =>
+      events.add(e)
     );
-    return;
   }
 
+  const list =
+    [...events].sort();
+
   config.events = list;
 
   await saveConfig(config);
 
   console.log(
     chalk.green(
-      "eventra.json updated"
+      `Found ${list.length} events`
     )
   );
 }

package/src/types.ts

@@ -0,0 +1,20 @@
+export type ComponentWrapper = {
+  name: string;
+  prop: string;
+};
+
+export type FunctionWrapper = {
+  name: string;
+  path?: string;
+};
+
+export type EventraConfig = {
+  apiKey?: string;
+  events: string[];
+  wrappers: ComponentWrapper[];
+  functionWrappers: FunctionWrapper[];
+  sync: {
+    include: string[];
+    exclude: string[];
+  };
+};

package/src/utils/config.ts

@@ -1,15 +1,22 @@
 import fs from "fs-extra";
 import path from "path";
+import { EventraConfig } from "../types";
 
 export const CONFIG_NAME = "eventra.json";
 
-export function normalizeConfig(config: any) {
+export function normalizeConfig(
+  config: Partial<EventraConfig>
+): EventraConfig {
   return {
     apiKey: config.apiKey ?? "",
     events: config.events ?? [],
     wrappers: config.wrappers ?? [],
+    functionWrappers:
+      config.functionWrappers ?? [],
     sync: config.sync ?? {
-      include: ["**/*.{ts,tsx,js,jsx}"],
+      include: [
+        "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
+      ],
       exclude: [
         "node_modules",
         "dist",
@@ -20,28 +27,38 @@ export function normalizeConfig(config: any) {
   };
 }
 
-export async function loadConfig() {
+export async function loadConfig(): Promise<EventraConfig | null> {
   const configPath = path.join(
     process.cwd(),
     CONFIG_NAME
   );
 
-  if (!(await fs.pathExists(configPath))) {
+  if (
+    !(await fs.pathExists(
+      configPath
+    ))
+  ) {
     return null;
   }
 
-  const config = await fs.readJSON(configPath);
+  const config =
+    await fs.readJSON(
+      configPath
+    );
 
   return normalizeConfig(config);
 }
 
-export async function saveConfig(config: any) {
+export async function saveConfig(
+  config: EventraConfig
+) {
   const configPath = path.join(
     process.cwd(),
     CONFIG_NAME
   );
 
-  const normalized = normalizeConfig(config);
+  const normalized =
+    normalizeConfig(config);
 
   await fs.writeJSON(
     configPath,

package/src/utils/extract.ts

@@ -0,0 +1,74 @@
+import {
+  CallExpression,
+  Node,
+  ObjectLiteralExpression,
+  SyntaxKind,
+} from "ts-morph";
+
+export function extractEvent(
+  call: CallExpression,
+  path: string
+): string | null {
+  const parts = path.split(".");
+
+  let node: Node | undefined =
+    call.getArguments()[Number(parts[0])];
+
+  if (!node) return null;
+
+  node = unwrap(node);
+
+  for (let i = 1; i < parts.length; i++) {
+    if (!Node.isObjectLiteralExpression(node)) {
+      return null;
+    }
+
+    const obj: ObjectLiteralExpression =
+      node;
+
+    const prop =
+      obj.getProperty(parts[i]);
+
+    if (!prop) return null;
+
+    if (!Node.isPropertyAssignment(prop)) {
+      return null;
+    }
+
+    const initializer =
+      prop.getInitializer();
+
+    if (!initializer) return null;
+
+    node = unwrap(initializer);
+  }
+
+  if (Node.isStringLiteral(node)) {
+    return node.getLiteralText();
+  }
+
+  if (
+    node.getKind() ===
+    SyntaxKind.NoSubstitutionTemplateLiteral
+  ) {
+    return node
+      .getText()
+      .replace(/`/g, "");
+  }
+
+  return null;
+}
+
+function unwrap(node: Node): Node {
+  let current = node;
+
+  while (
+    Node.isParenthesizedExpression(
+      current
+    )
+    ) {
+    current = current.getExpression();
+  }
+
+  return current;
+}

package/src/utils/parsers/astro.ts

@@ -0,0 +1,5 @@
+export function parseAstro(
+  content: string
+) {
+  return content;
+}

package/src/utils/parsers/router.ts

@@ -0,0 +1,14 @@
+export function detectParser(
+  file: string
+) {
+  if (file.endsWith(".vue"))
+    return "vue";
+
+  if (file.endsWith(".svelte"))
+    return "svelte";
+
+  if (file.endsWith(".astro"))
+    return "astro";
+
+  return "ts";
+}

package/src/utils/parsers/svelte.ts

@@ -0,0 +1,5 @@
+export function parseSvelte(
+  content: string
+) {
+  return content;
+}

package/src/utils/parsers/vue.ts

@@ -0,0 +1,25 @@
+export function parseVue(
+  content: string
+) {
+  const template =
+    content.match(
+      /<template[\s\S]*?>([\s\S]*?)<\/template>/
+    );
+
+  const script =
+    content.match(
+      /<script[\s\S]*?>([\s\S]*?)<\/script>/
+    );
+
+  return `
+${script?.[1] ?? ""}
+
+function __vue_template__() {
+  return (
+    <>
+      ${template?.[1] ?? ""}
+    </>
+  );
+}
+`;
+}