added 'replaceIdentifierInCode', new feature to replace content names…

… using Babel. This is util for the resource where the duplicated names are renamed.
wpdas · Apr 18, 2024 · f20125f · f20125f
1 parent 3f67cfa
commit f20125f
Show file tree

Hide file tree

Showing 6 changed files with 115 additions and 123 deletions.
diff --git a/lib/actions/handleNames.js b/lib/actions/handleNames.js
@@ -2,6 +2,7 @@
  * Handle const/var/let names to avoid duplicates
  */
 
+const replaceIdentifierInCode = require("../parsers/replaceIdentifierInCode");
 const {
   BETWEEN_EXPORT_CONST_AND_EQUAL,
   SPACES,
@@ -189,10 +190,22 @@ const replaceItemNamesInOtherFilesContent = (
       // RegExp aqui
       // Regex: Troca somente e tão somente o item, nem mais nem menos, evitando assim
       // trocar items erronamente como na descricao acima.
-      const replaceItemRegexp = new RegExp("\\b" + itemName + "\\b", "gm");
-
-      fileSchemaContent = fileSchemaContent.replaceAll(
-        replaceItemRegexp,
+      // const replaceItemRegexp = new RegExp("\\b" + itemName + "\\b", "gm");
+
+      // fileSchemaContent = fileSchemaContent.replaceAll(
+      //   replaceItemRegexp,
+      //   newItemName,
+      // );
+
+      // fileSchemaContent = replaceContentInCurrentFile(
+      //   fileSchemaContent,
+      //   itemName,
+      //   newItemName,
+      // );
+
+      fileSchemaContent = replaceIdentifierInCode(
+        fileSchemaContent,
+        itemName,
         newItemName,
       );
 
@@ -210,14 +223,18 @@ const replaceItemNamesInOtherFilesContent = (
  * @param {string} content
  * @param {{filePath: string, toImport: string[], content: string}[]} fileSchemas schemas to change the files content when a item gets its name changed
  */
-const replaceContentInCurrentFile = (contentFilePath, content, fileSchemas) => {
+const replaceContentInCurrentFile = (
+  contentFilePath,
+  newContent,
+  fileSchemas,
+) => {
   const currentFileSchema = fileSchemas.find(
     (item) => item.filePath === contentFilePath,
   );
   const fileSchemaIndex = fileSchemas.indexOf(currentFileSchema);
 
   // Update content
-  currentFileSchema.content = content;
+  currentFileSchema.content = newContent;
 
   fileSchemas[fileSchemaIndex] = currentFileSchema;
 
@@ -226,6 +243,9 @@ const replaceContentInCurrentFile = (contentFilePath, content, fileSchemas) => {
 
 /**
  * Replace the item name inside the content
+ *
+ * Troca o nome dos items dentro dos arquivos desejados
+ *
  * @param {string} content
  * @param {string} itemName
  * @param {string} newItemName
@@ -239,114 +259,24 @@ const replaceNamesInContent = (
   contentFilePath,
   fileSchemas,
 ) => {
-  // Replace const values
-  // ex: const App
-  // nao pega: const AppRoute
-  // O mesmo para os proximos
-  // (const App)[^a-zA-Z0-9=]
-  // TODO: reutilizar os do checkIfItemExistInContent
-  const constRegExp = new RegExp(`(const ${itemName})[^a-zA-Z0-9=]`, "gm");
-  const letRegExp = new RegExp(`(let ${itemName})[^a-zA-Z0-9=]`, "gm");
-  const varRegExp = new RegExp(`(var ${itemName})[^a-zA-Z0-9=]`, "gm");
-  const functionRegExp = new RegExp(
-    `(function ${itemName})[^a-zA-Z0-9=]`,
-    "gm",
+  content = replaceIdentifierInCode(content, itemName, newItemName);
+
+  // 1 - mudar o nome dos items no corpo do arquivo atual
+  // Replace content (with updated item names) in current file
+  fileSchemas = replaceContentInCurrentFile(
+    contentFilePath,
+    content,
+    fileSchemas,
   );
 
-  // 1 - Testa, se aprovado, mudar o nome dos items no corpo do arquivo atual
   // 2 - Ir em todos arquivos que dependem deste arquivo e mudar o nome do item lá
-
-  // Const
-  const testConst = content.match(constRegExp);
-  if (testConst) {
-    const constName = testConst.join("");
-    const newConstName = constName.replaceAll(itemName, newItemName);
-    content = content.replaceAll(constName, newConstName);
-
-    // Replace content (with updated item names) in current file
-    fileSchemas = replaceContentInCurrentFile(
-      contentFilePath,
-      content,
-      fileSchemas,
-    );
-
-    // Replace item names in other files content
-    fileSchemas = replaceItemNamesInOtherFilesContent(
-      contentFilePath,
-      itemName,
-      newItemName,
-      fileSchemas,
-    );
-  }
-
-  // Let
-  const testLet = content.match(letRegExp);
-  if (testLet) {
-    const letName = testLet.join("");
-    const newLetName = letName.replaceAll(itemName, newItemName);
-    content = content.replaceAll(letName, newLetName);
-
-    // Replace content (with updated item names) in current file
-    fileSchemas = replaceContentInCurrentFile(
-      contentFilePath,
-      content,
-      fileSchemas,
-    );
-
-    // Replace item names in other files content
-    fileSchemas = replaceItemNamesInOtherFilesContent(
-      contentFilePath,
-      itemName,
-      newItemName,
-      fileSchemas,
-    );
-  }
-
-  // Var
-  const testVar = content.match(varRegExp);
-  if (testVar) {
-    const varName = testVar.join("");
-    const newVarName = varName.replaceAll(itemName, newItemName);
-    content = content.replaceAll(varName, newVarName);
-
-    // Replace content (with updated item names) in current file
-    fileSchemas = replaceContentInCurrentFile(
-      contentFilePath,
-      content,
-      fileSchemas,
-    );
-
-    // Replace item names in other files content
-    fileSchemas = replaceItemNamesInOtherFilesContent(
-      contentFilePath,
-      itemName,
-      newItemName,
-      fileSchemas,
-    );
-  }
-
-  // Function
-  const testFunction = content.match(functionRegExp);
-  if (testFunction) {
-    const functionName = testFunction.join("");
-    const newFunctionName = functionName.replaceAll(itemName, newItemName);
-    content = content.replaceAll(functionName, newFunctionName);
-
-    // Replace content (with updated item names) in current file
-    fileSchemas = replaceContentInCurrentFile(
-      contentFilePath,
-      content,
-      fileSchemas,
-    );
-
-    // Replace item names in other files content
-    fileSchemas = replaceItemNamesInOtherFilesContent(
-      contentFilePath,
-      itemName,
-      newItemName,
-      fileSchemas,
-    );
-  }
+  // Replace item names in other files content
+  fileSchemas = replaceItemNamesInOtherFilesContent(
+    contentFilePath,
+    itemName,
+    newItemName,
+    fileSchemas,
+  );
 
   return { content, fileSchemas };
 };

diff --git a/lib/actions/loadFilesInfo.js b/lib/actions/loadFilesInfo.js
@@ -72,9 +72,6 @@ const processFileSchema = (filePath) => {
     }
   }
 
-
-  //console.log('File path:', filePath);
-
   let fileContent = fs.readFileSync(filePath, "utf8");
 
   // Remove comments from file

diff --git a/lib/alem-vm/alem-vm.d.ts b/lib/alem-vm/alem-vm.d.ts
@@ -285,7 +285,7 @@ export declare var props: any;
 export declare var context: BosContext;
 
 export declare const Widget: (params: {
-  loading?: JSX.Element | JSX.Element[] | string | number;
+  loading?: JSX.Element | JSX.Element[] | string | number | ReactElement;
   code?: string;
   src?: string;
   props?: object;
@@ -694,7 +694,7 @@ export declare const CommitButton: (params: {
   className?: string;
   data?: {};
   onCommit?: () => void;
-  children?: JSX.Element | JSX.Element[] | string | number;
+  children?: JSX.Element | JSX.Element[] | string | number | ReactElement;
 }) => React.ReactNode;
 
 /**
@@ -703,7 +703,7 @@ export declare const CommitButton: (params: {
  * Know more: https://docs.near.org/bos/api/builtin-components#files
  */
 export declare const Files: (params: {
-  children?: JSX.Element;
+  children?: JSX.Element | ReactElement;
   multiple?: boolean;
   accepts: string[];
   clickable?: boolean;
@@ -754,8 +754,8 @@ export declare const InfiniteScroll: (params: {
   useWindow?: boolean;
   pageStart?: number;
   threshold?: number;
-  loader?: JSX.Element | JSX.Element[] | string | number;
-  children?: JSX.Element | JSX.Element[] | string | number;
+  loader?: JSX.Element | JSX.Element[] | string | number | ReactElement;
+  children?: JSX.Element | JSX.Element[] | string | number | ReactElement;
 }) => React.ReactNode;
 
 /**
@@ -775,7 +775,7 @@ export declare const TypeAhead: (params: {
  */
 export declare const Tooltip: (params: {
   id?: string;
-  children: JSX.Element;
+  children: JSX.Element | ReactElement;
 }) => React.ReactNode;
 
 /**

diff --git a/lib/compiler.js b/lib/compiler.js
@@ -113,8 +113,9 @@ function compile_files() {
   saveFinalBundleFile(bundleContent);
 
   // Save final file schemas
-  // INFO: dev only
-  // saveFileSchemas(finishedSchemaProcessForWidgets.completeFileSchemas);
+  if (process.env.SAVE_SCHEMAS === "true") {
+    saveFileSchemas(finishedSchemaProcessForWidgets.completeFileSchemas);
+  }
 }
 
 module.exports = {

diff --git a/lib/parsers/replaceIdentifierInCode.js b/lib/parsers/replaceIdentifierInCode.js
@@ -0,0 +1,64 @@
+const { parse } = require("@babel/parser");
+const traverse = require("@babel/traverse").default;
+const generate = require("@babel/generator").default;
+
+/**
+ * Troca o nome do recurso dentro do código, tanto para o arquivo principal quanto para os arquivos que dependem
+ * do arquivo original.
+ *
+ * Se um arquivo com nome Foo tiver seu nome trocado, isso será aplicado corretamente sem alterar
+ * outros dados ou estruturas.
+ *
+ * Já um arquivo que depende do principal (quando esse principal é alterado) ira sofrer alterações somente
+ * no nome do recurso específico. Ou sejá, se Foo for mudado para Bar, somente este item será mudado em todo o arquivo
+ * incluindo JSX. Exemplo:
+ *
+ * import Foo from "./caminho/Foo"
+ * console.log(Foo);
+ * <Test>Foo<Test/>
+ * <Foo />
+ *
+ * se tornará
+ *
+ * import Bar from "./caminho/Bar"
+ * console.log(Bar);
+ * <Test>Foo<Test/>
+ * <Bar />
+ *
+ *
+ * @param {*} code
+ * @param {*} identifier
+ * @param {*} newIdentifier
+ * @returns
+ */
+function replaceIdentifierInCode(code, identifier, newIdentifier) {
+  const ast = parse(code, {
+    sourceType: "module",
+    plugins: ["jsx", "typescript"], // Support for TypeScript and JSX
+  });
+
+  traverse(ast, {
+    enter(path) {
+      if (
+        path.isIdentifier({ name: identifier }) ||
+        path.isJSXIdentifier({ name: identifier })
+      ) {
+        path.node.name = newIdentifier;
+      } else if (
+        path.isImportSpecifier() &&
+        path.node.imported.name === identifier
+      ) {
+        path.node.imported.name = newIdentifier;
+      } else if (
+        path.isImportDefaultSpecifier() &&
+        path.node.local.name === identifier
+      ) {
+        path.node.local.name = newIdentifier;
+      }
+    },
+  });
+
+  return generate(ast, { retainLines: true }).code;
+}
+
+module.exports = replaceIdentifierInCode;
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "alem",
   "description": "Create web3 applications for NEAR BOS with a focus on performance and friendly development.",
-  "version": "1.0.0-beta.20",
+  "version": "1.0.0-beta.21",
   "main": "main.js",
   "types": "index.d.ts",
   "author": "Wenderson Pires - wendersonpires.near",
-Original file line number
+Diff line change
@@ Expand Up / @@ -72,9 +72,6 @@ const processFileSchema = (filePath) => { @@
         }
       }
-      //console.log('File path:', filePath);
       let fileContent = fs.readFileSync(filePath, "utf8");
       // Remove comments from file
@@ Expand Down @@