Fixes build script for deeply nested routes (#89)

* adds good test

* replace file path separator in build

examples/single/widget/deeply/nested/home.jsx

@@ -0,0 +1 @@
+return <p>Hello world</p>;

examples/single/widget/nested/home.jsx

@@ -0,0 +1 @@
+return <p>Hello world</p>;

lib/build.ts

@@ -1,10 +1,10 @@
-import path from "path";
 import { readConfig } from "@/lib/config";
-import { writeJson, copy, loopThroughFiles, outputFile, readdir, readFile, readJson, remove } from "@/lib/utils/fs";
-import { transpileJS, EvalCustomSyntaxParams } from "@/lib/parser";
-import { Log } from "@/lib/types";
-import { UploadToIPFSOptions, uploadToIPFS } from "@/lib/ipfs";
 import { generateData } from "@/lib/data";
+import { uploadToIPFS, UploadToIPFSOptions } from "@/lib/ipfs";
+import { EvalCustomSyntaxParams, transpileJS } from "@/lib/parser";
+import { Log } from "@/lib/types";
+import { copy, loopThroughFiles, outputFile, readFile, readJson, remove, writeJson } from "@/lib/utils/fs";
+import path from "path";
 
 // - reads all the files in src 
 //   - check for bos.config.js
@@ -67,6 +67,12 @@ export async function buildApp(src: string, dest: string, network: string = "mai
   };
 
   const new_build_files: string[] = [];
+  const original_build_files: string[] = [];
+
+  // we need to keep track of the original build files
+  await loopThroughFiles(path.join(dest, "src", "widget"), async (file: string) => {
+    original_build_files.push(file);
+  })
 
   // module transpilation
   const loadingModules = log.loading(`Transpiling ${modules.length} modules`, LogLevels.BUILD);
@@ -129,7 +135,7 @@ export async function buildApp(src: string, dest: string, network: string = "mai
 
       // write to dest
       let new_file_name = path.relative(path.join(src, "widget"), file).replace(path.sep, ".");
-      new_file_name = new_file_name.substring(0, new_file_name.length - path.extname(file).length);
+      new_file_name = new_file_name.substring(0, new_file_name.length - path.extname(file).length).split(path.sep).join(".");
       new_file_name += ".jsx";
 
       const new_file_path = path.join(dest, "src", "widget", new_file_name);
@@ -144,14 +150,11 @@ export async function buildApp(src: string, dest: string, network: string = "mai
     throw e;
   }
 
-  // remove unnecessary build files
-  const original_build_files = await readdir(path.join(dest, "src", "widget")).catch(() => []);
   for (const file of original_build_files) {
-    const filePath = path.join(dest, "src", "widget", file);
-    if (new_build_files.includes(filePath))
+    if (new_build_files.includes(file))
       continue;
 
-    await remove(filePath);
+    await remove(file);
   }
 
   await log.wait(

lib/utils/fs.ts

@@ -1,4 +1,4 @@
-import { copy, readFile, lstat, readJson, writeJson, ensureDir, outputFile, readdir, remove, move, pathExists } from 'fs-extra';
+import { copy, ensureDir, move, outputFile, pathExists, readdir, readFile, readJson, remove, writeJson } from 'fs-extra';
 import path from 'path';
 
 async function loopThroughFiles(pwd: string, callback: (file: string) => Promise<void>) {
@@ -16,4 +16,5 @@ async function loopThroughFiles(pwd: string, callback: (file: string) => Promise
   }
 }
 
-export { copy, readJson, writeJson, ensureDir, outputFile, loopThroughFiles, readFile, readdir, remove, move, pathExists };
+export { copy, ensureDir, loopThroughFiles, move, outputFile, pathExists, readdir, readFile, readJson, remove, writeJson };
+

tests/unit/build.ts

@@ -30,6 +30,16 @@ const app_example_1 = {
     name: "Nested Hello",
     description: "Nested Hello world widget",
   }),
+  "./widget/deeply/nested/index.tsx": "type Hello = {}; const hello: Hello = 'hi'; export default hello;",
+  "./widget/deeply/nested/index.metadata.json": JSON.stringify({
+    name: "Deeply nested Hello",
+    description: "Deeply nested Hello world widget",
+  }),
+  "./widget/very/deeply/nested/index.tsx": "type Hello = {}; const hello: Hello = 'hi'; export default hello;",
+  "./widget/very/deeply/nested/index.metadata.json": JSON.stringify({
+    name: "Very deeply nested Hello",
+    description: "Very deeply nested Hello world widget",
+  }),
   "./widget/module.tsx": "VM.require('${module_hello_utils}'); export default hello('world');",
   "./widget/config.jsx": "return <h1>${config_account}${config_account_deploy}</h1>;",
   "./widget/alias.tsx": "export default <h1>Hello ${alias_name}!</h1>;",
@@ -49,6 +59,8 @@ const app_example_1_output = {
   "/build/src/widget/hello.utils.module.js": "const hello = (name) => `Hello, ${name}!`;\nreturn { hello };\n",
   "/build/src/widget/index.jsx": "const hello = \"hi\";\nreturn hello(props);\n",
   "/build/src/widget/nested.index.jsx": "const hello = \"hi\";\nreturn hello(props);\n",
+  "/build/src/widget/deeply.nested.index.jsx": "const hello = \"hi\";\nreturn hello(props);\n",
+  "/build/src/widget/very.deeply.nested.index.jsx": "const hello = \"hi\";\nreturn hello(props);\n",
   "/build/src/widget/module.jsx": "VM.require(\"test.near/widget/hello.utils.module\");\nreturn hello(\"world\");\n",
   "/build/src/widget/config.jsx": "return <h1>test.neartest.near</h1>;\n",
   "/build/src/widget/alias.jsx": "return <h1>Hello world!</h1>;\n",
@@ -64,6 +76,12 @@ const app_example_1_output = {
         })
       },
       widget: {
+        "deeply.nested.index": {
+          metadata: {
+            name: "Deeply nested Hello",
+            description: "Deeply nested Hello world widget",
+          }
+        },
         index: {
           metadata: {
             name: "Hello",
@@ -75,7 +93,12 @@ const app_example_1_output = {
             name: "Nested Hello",
             description: "Nested Hello world widget",
           }
-
+        },
+        "very.deeply.nested.index": {
+          metadata: {
+            name: "Very deeply nested Hello",
+            description: "Very deeply nested Hello world widget",
+          }
         }
       }
     }