@superblocksteam/cli 2.0.6-next.22 → 2.0.6-next.24

package/README.md

@@ -14,7 +14,7 @@ $ npm install -g @superblocksteam/cli
 $ superblocks COMMAND
 running command...
 $ superblocks (--version)
-@superblocksteam/cli/2.0.6-next.22 linux-x64 node-v20.19.0
+@superblocksteam/cli/2.0.6-next.24 linux-x64 node-v20.19.0
 $ superblocks --help [COMMAND]
 USAGE
   $ superblocks COMMAND

package/dist/index.js

@@ -431941,6 +431941,7 @@ init_cjs_shims();
 import path21 from "node:path";
 var PAGES_DIRECTORY = "pages";
 var CUSTOM_COMPONENTS_DIRECTORY = "components";
+var API_FOLDER = "apis";
 var ROUTES_FILE = "routes.json";
 var SCOPE_FILE = "scope.ts";
 function getPageFolder(rootPath, pageName) {
@@ -431952,6 +431953,9 @@ function getPageFilePath(rootPath, pageName) {
 function isPageFilePath(filePath) {
   return /pages\/.*\/index\.tsx/.test(filePath);
 }
+function getApiFilePath(rootPath, pageName, apiName) {
+  return path21.join(getPageFolder(rootPath, pageName), API_FOLDER, apiName, "api.yaml");
+}
 
 // ../../../vite-plugin-file-sync/dist/traverse.js
 init_cjs_shims();
@@ -436807,6 +436811,9 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
   registeredComponentPaths = {};
   renameManager = new RenameManager();
   _tracer;
+  transactionNonce = Date.now();
+  pendingTransactions = /* @__PURE__ */ new Set();
+  processedTransactions = [];
   constructor(fsOperationQueue, generationNumberSequence, tracer2) {
     super(tracer2, { captureRejections: true });
     this.rootDir = "/";
@@ -436863,27 +436870,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
     }
     return path27.join(this.rootDir, "App.tsx");
   }
-  updateApi = (content2, path55) => {
-    if (!this.rootDir) {
-      throw new Error("Root directory not set");
-    }
-    const { api: apiContents, stepPathMap } = content2;
-    const pageName = getPageName2(path55);
-    let scopeId = this.sourceTracker?.getScopeDefinitionForPage(pageName)?.id;
-    if (!scopeId) {
-      console.warn("Scope ID not found for API", apiContents.metadata.name);
-      scopeId = "";
-    }
-    const updatedApi = {
-      apiPb: import_yaml2.default.parse(JSON.stringify(apiContents)),
-      pageName,
-      stepPathMap,
-      scopeId
-    };
-    const isNewApi = !this.apiFiles[path55];
-    this.apiFiles[path55] = updatedApi;
-    return { updatedApi, pageName, isNewApi };
-  };
+  // MARK: core setup/init
   async watch(watcher, rootPath) {
     const logger3 = getLogger();
     this.rootDir = rootPath;
@@ -436961,11 +436948,113 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
         return;
       const { type: type2, path: path55 } = file;
       if (type2 === "api") {
-        this.updateApi(content2, path55);
+        this.updateInternalApiData(content2, path55);
       }
     });
     watcher.on("all", this.handleFileChange);
   }
+  initializeSourceTracker() {
+    this.sourceTracker = new SourceTracker(this._tracer);
+    this.sourceTracker.initializeSourceTracker({
+      files: this.tsFiles
+    });
+  }
+  handleNonVisualChangeByDeletingIds(path55, content2) {
+    if (!this.sourceTracker) {
+      throw new Error("Source tracker not initialized");
+    }
+    return this.sourceTracker.handleNonVisualChangeByDeletingIds(path55, content2);
+  }
+  async getFileWithIds(filePath) {
+    const logger3 = getLogger();
+    if (!this.sourceTracker) {
+      throw new Error("Source tracker not initialized");
+    }
+    const files = this.sourceTracker.getCurrentFiles();
+    if (!files[filePath]) {
+      throw new Error("File not found in source tracker " + filePath);
+    }
+    const ast = files[filePath].ast;
+    if (!ast) {
+      throw new Error("No AST found for file in source tracker " + filePath);
+    }
+    const clonedAst = await (0, import_core3.transformFromAstAsync)(ast, void 0, {
+      ast: true
+    });
+    if (!clonedAst?.ast) {
+      throw new Error("Failed to clone AST for file " + filePath);
+    }
+    const componentsManager = ComponentsManager.getInstance();
+    const processedTransactions = this.getProcessedTransactionsWithNonce();
+    const customImports = /* @__PURE__ */ new Set();
+    traverse(clonedAst.ast, {
+      Program: {
+        exit(nodePath) {
+          if (isCustomBuildEnabled()) {
+            addLegacyCustomComponentVariables(nodePath, customImports);
+          }
+          const name18 = componentsManager.getComponentName(filePath);
+          if (name18) {
+            nodePath.pushContainer("body", import_types26.default.variableDeclaration("const", [
+              import_types26.default.variableDeclarator(import_types26.default.identifier("componentName"), import_types26.default.stringLiteral(name18))
+            ]));
+          }
+        }
+      },
+      ImportDeclaration(path55) {
+        if (isCustomBuildEnabled()) {
+          modifyLegacyCustomComponentImports(path55, customImports);
+        }
+      },
+      JSXElement(path55) {
+        if (isCustomBuildEnabled()) {
+          modifyLegacyCustomComponentElements(path55, customImports);
+        }
+      },
+      ReturnStatement(path55) {
+        const argument = path55.get("argument");
+        if (!argument.isJSXElement()) {
+          return;
+        }
+        const openingElement = argument.get("openingElement");
+        if (!openingElement.isJSXOpeningElement()) {
+          return;
+        }
+        openingElement.pushContainer("attributes", makeJSXAttribute(ROOT_WIDGET_ATTRIBUTE, "true"));
+        openingElement.pushContainer("attributes", generateJSXAttribute(PROCESSED_TRANSACTIONS_ATTRIBUTE, {
+          value: processedTransactions,
+          type: "EXPRESSION",
+          __info: true
+        }));
+      },
+      JSXOpeningElement(path55) {
+        const elementId = getSbElementId(path55.node);
+        if (elementId) {
+          path55.pushContainer("attributes", makeJSXAttribute(WIDGET_SOURCE_ID_ATTRIBUTE, elementId));
+        }
+      },
+      ObjectProperty(path55) {
+        const elementId = getSbElementId(path55.node);
+        if (!elementId) {
+          path55.skip();
+          return;
+        }
+        path55.traverse({
+          ObjectExpression(path56) {
+            path56.pushContainer("properties", import_types26.default.objectProperty(import_types26.default.identifier("id"), import_types26.default.stringLiteral(elementId)));
+            path56.skip();
+          }
+        });
+      }
+    });
+    try {
+      const result = generate(clonedAst.ast);
+      return result.code;
+    } catch (e) {
+      logger3.error("Error generating file with ids", getErrorMeta(e));
+      return null;
+    }
+  }
   enableOperationsQueue() {
     this.operationProcessor.enable();
   }
@@ -436975,6 +437064,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
   async flushOperations() {
     await this.operationProcessor.flush();
   }
+  // MARK: file change handling
   handleFileChange = async (event, filePath) => {
     const logger3 = getLogger();
     logger3.info(`File changed: ${filePath}, event: ${event}`);
@@ -437024,7 +437114,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
                 case "api":
                 case "python-api-step":
                 case "js-api-step": {
-                  await this.processApiUpdates(filePath, fileType);
+                  await this.processApiFileUpdates(filePath, fileType);
                   break;
                 }
               }
@@ -437085,7 +437175,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
                 case "python-api-step":
                 case "js-api-step":
                   {
-                    await this.processApiUpdates(filePath, fileType2);
+                    await this.processApiFileUpdates(filePath, fileType2);
                   }
                   break;
               }
@@ -437110,7 +437200,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
               filePath
             },
             execute: async () => {
-              await this.deleteApiFile(filePath);
+              await this.removeApiData(filePath);
             }
           });
         }
@@ -437118,9 +437208,6 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
       }
     }
   };
-  getApiFiles() {
-    return this.formatApisToClientApis(this.apiFiles);
-  }
   async deleteTsFile(filePath) {
     delete this.tsFiles[filePath];
     this.sourceTracker?.removeFile(filePath);
@@ -437128,35 +437215,13 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
       this.emit("deletePage", filePath);
     }
   }
-  async deleteApiFile(filePath) {
-    const api = this.apiFiles[filePath];
-    if (!api) {
-      return;
-    }
-    delete this.apiFiles[filePath];
-    this.sourceTracker?.deleteApi({
-      pageName: api.pageName,
-      apiName: api.apiPb.metadata.name
-    });
-    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
-    await this.writeChanges(changes);
-    const scopeId = this.sourceTracker?.getScopeDefinitionForPage(api.pageName)?.id;
-    this.emit("apiManualDelete", {
-      api: {
-        id: getClientApiId(api.apiPb.metadata.name, api.pageName),
-        apiName: api.apiPb.metadata.name,
-        // TODO(saksham): get pagename more defensively
-        pageName: getPageName2(filePath),
-        scopeId
-      }
-    });
-  }
   getTsFilePaths() {
     return Object.keys(this.tsFiles);
   }
   getSourceTracker() {
     return this.sourceTracker;
   }
+  // MARK: fs read/write
   async writeFile(path55, content2, kind) {
     if (kind === "ts") {
       this.tsFiles[path55] = content2;
@@ -437170,7 +437235,7 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
         delete apiPb.metadata.id;
       }
       const stepPathMap = currentApiFile?.stepPathMap ?? {};
-      this.updateApi({ api: apiPb, stepPathMap }, path55);
+      this.updateInternalApiData({ api: apiPb, stepPathMap }, path55);
       await this.fsOperationQueue.enqueue(async () => {
         await (0, import_util23.writeApiFiles)({ apiPb }, "api", path55.split("/").slice(0, -1).join("/"), false, [], [], { extractLargeSourceFiles: true, minLinesForExtraction: 1 }, new Set(Object.keys(this.apiFiles)), stepPathMap);
         if (this.apiFiles[path55]) {
@@ -437182,124 +437247,43 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
   readFile(path55) {
     return this.tsFiles[path55];
   }
-  initializeSourceTracker() {
-    this.sourceTracker = new SourceTracker(this._tracer);
-    this.sourceTracker.initializeSourceTracker({
-      files: this.tsFiles
-    });
+  async addRoute(route, filePath) {
+    if (!this.rootDir) {
+      throw new Error("Root directory not set");
+    }
+    this.routes[route] = { file: this.getRelativeRoutePath(filePath) };
+    await this.writeFile(path27.join(this.rootDir, ROUTES_FILE), JSON.stringify(this.routes, null, 2));
   }
-  handleNonVisualChangeByDeletingIds(path55, content2) {
-    if (!this.sourceTracker) {
-      throw new Error("Source tracker not initialized");
+  async removeRoute(filePath) {
+    if (!this.rootDir) {
+      throw new Error("Root directory not set");
     }
-    return this.sourceTracker.handleNonVisualChangeByDeletingIds(path55, content2);
+    const relativeFilePath = this.getRelativeRoutePath(filePath);
+    this.routes = Object.fromEntries(Object.entries(this.routes).filter(([_, value2]) => value2.file !== relativeFilePath));
+    await this.writeFile(path27.join(this.rootDir, ROUTES_FILE), JSON.stringify(this.routes, null, 2));
   }
-  async getFileWithIds(filePath) {
+  async writeChanges(changes, callback) {
+    return Promise.all(changes.map(async ({ fileName, source: source2, kind }) => {
+      await this.writeFile(fileName, source2, kind);
+      return callback?.(fileName, source2);
+    }));
+  }
+  getLocalBindingEntities(path55) {
     const logger3 = getLogger();
-    if (!this.sourceTracker) {
-      throw new Error("Source tracker not initialized");
-    }
-    const files = this.sourceTracker.getCurrentFiles();
-    if (!files[filePath]) {
-      throw new Error("File not found in source tracker " + filePath);
+    const files = this.sourceTracker?.getCurrentFiles();
+    if (!files || !files[path55]) {
+      logger3.warn(`File not found in source tracker for local binding entities: ${path55}`);
+      return [];
     }
-    const ast = files[filePath].ast;
+    const ast = files[path55].ast;
     if (!ast) {
-      throw new Error("No AST found for file in source tracker " + filePath);
-    }
-    const clonedAst = await (0, import_core3.transformFromAstAsync)(ast, void 0, {
-      ast: true
-    });
-    if (!clonedAst?.ast) {
-      throw new Error("Failed to clone AST for file " + filePath);
+      logger3.warn(`No AST found for file in source tracker for local binding entities: ${path55}`);
+      return [];
     }
-    const componentsManager = ComponentsManager.getInstance();
-    const processedTransactions = this.getProcessedTransactionsWithNonce();
-    const customImports = /* @__PURE__ */ new Set();
-    traverse(clonedAst.ast, {
-      Program: {
-        exit(nodePath) {
-          if (isCustomBuildEnabled()) {
-            addLegacyCustomComponentVariables(nodePath, customImports);
-          }
-          const name18 = componentsManager.getComponentName(filePath);
-          if (name18) {
-            nodePath.pushContainer("body", import_types26.default.variableDeclaration("const", [
-              import_types26.default.variableDeclarator(import_types26.default.identifier("componentName"), import_types26.default.stringLiteral(name18))
-            ]));
-          }
-        }
-      },
-      ImportDeclaration(path55) {
-        if (isCustomBuildEnabled()) {
-          modifyLegacyCustomComponentImports(path55, customImports);
-        }
-      },
-      JSXElement(path55) {
-        if (isCustomBuildEnabled()) {
-          modifyLegacyCustomComponentElements(path55, customImports);
-        }
-      },
-      ReturnStatement(path55) {
-        const argument = path55.get("argument");
-        if (!argument.isJSXElement()) {
-          return;
-        }
-        const openingElement = argument.get("openingElement");
-        if (!openingElement.isJSXOpeningElement()) {
-          return;
-        }
-        openingElement.pushContainer("attributes", makeJSXAttribute(ROOT_WIDGET_ATTRIBUTE, "true"));
-        openingElement.pushContainer("attributes", generateJSXAttribute(PROCESSED_TRANSACTIONS_ATTRIBUTE, {
-          value: processedTransactions,
-          type: "EXPRESSION",
-          __info: true
-        }));
-      },
-      JSXOpeningElement(path55) {
-        const elementId = getSbElementId(path55.node);
-        if (elementId) {
-          path55.pushContainer("attributes", makeJSXAttribute(WIDGET_SOURCE_ID_ATTRIBUTE, elementId));
-        }
-      },
-      ObjectProperty(path55) {
-        const elementId = getSbElementId(path55.node);
-        if (!elementId) {
-          path55.skip();
-          return;
-        }
-        path55.traverse({
-          ObjectExpression(path56) {
-            path56.pushContainer("properties", import_types26.default.objectProperty(import_types26.default.identifier("id"), import_types26.default.stringLiteral(elementId)));
-            path56.skip();
-          }
-        });
-      }
-    });
-    try {
-      const result = generate(clonedAst.ast);
-      return result.code;
-    } catch (e) {
-      logger3.error("Error generating file with ids", getErrorMeta(e));
-      return null;
-    }
-  }
-  getLocalBindingEntities(path55) {
-    const logger3 = getLogger();
-    const files = this.sourceTracker?.getCurrentFiles();
-    if (!files || !files[path55]) {
-      logger3.warn(`File not found in source tracker for local binding entities: ${path55}`);
-      return [];
-    }
-    const ast = files[path55].ast;
-    if (!ast) {
-      logger3.warn(`No AST found for file in source tracker for local binding entities: ${path55}`);
-      return [];
-    }
-    const localBindingEntities = /* @__PURE__ */ new Set();
-    traverse(ast, {
-      JSXOpeningElement(path56) {
-        const elementId = getSbElementId(path56.node);
+    const localBindingEntities = /* @__PURE__ */ new Set();
+    traverse(ast, {
+      JSXOpeningElement(path56) {
+        const elementId = getSbElementId(path56.node);
         if (!elementId) {
           return;
         }
@@ -437311,8 +437295,35 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
     });
     return Array.from(localBindingEntities);
   }
-  pendingTransactions = /* @__PURE__ */ new Set();
-  processedTransactions = [];
+  getPageRoots(filePath) {
+    const scopeFilePath = path27.join(path27.dirname(filePath), "index.tsx");
+    const currentFile = this.sourceTracker?.getCurrentFiles()[scopeFilePath];
+    if (!currentFile) {
+      return null;
+    }
+    return getPageRoots(filePath, currentFile);
+  }
+  getScope(filePath) {
+    const scopeFilePath = path27.join(path27.dirname(filePath), SCOPE_FILE);
+    const currentFile = this.sourceTracker?.getCurrentFiles()[scopeFilePath];
+    if (!currentFile) {
+      console.log("File not found", scopeFilePath);
+      return null;
+    }
+    const scope = getScope(scopeFilePath, currentFile);
+    return scope;
+  }
+  getRoutes() {
+    const routes = [];
+    for (const [path55, { file }] of Object.entries(this.routes)) {
+      routes.push({
+        path: path55,
+        component: file
+      });
+    }
+    return routes;
+  }
+  // MARK: transaction handling
   flushTransactions = () => {
     this.processedTransactions = this.processedTransactions.slice(-20);
     this.processedTransactions.push(...Array.from(this.pendingTransactions));
@@ -437324,13 +437335,13 @@ var FileSystemManager = class extends import_shared32.TracedEventEmitter {
     }
     this.pendingTransactions.add(transactionId);
   };
-  transactionNonce = Date.now();
   // Until we have a sophisticated way to track ALL operations, including non-UI initiated ops, we will use a nonce
   // TODO https://github.com/superblocksteam/superblocks/pull/11788
   getProcessedTransactionsWithNonce() {
     const nonce = `t-${this.transactionNonce++}`;
     return this.processedTransactions.concat(nonce);
   }
+  // MARK: editor operations
   handleCreatePage = async (payload) => {
     const { name: name18 } = payload;
     if (!this.rootDir) {
@@ -437350,7 +437361,9 @@ function Page() {
 export default registerPage(Page, { name: "${name18}" });
 `
     );
-    await fs12.mkdir(pagePath, { recursive: true });
+    await this.fsOperationQueue.enqueue(async () => {
+      await fs12.mkdir(pagePath, { recursive: true });
+    });
     await this.writeFile(pageIndexPath, pageContent, "ts");
     await this.handleNonVisualChangeByDeletingIds(pageIndexPath, pageContent);
     this.emit("addPage", pageIndexPath);
@@ -437477,173 +437490,7 @@ export default registerPage(Page, { name: "${name18}" });
     this.flushTransactions();
     return returnValues;
   };
-  handleUpdateApi = async (payload) => {
-    const { api } = payload;
-    if (!this.sourceTracker) {
-      throw new Error("Source tracker not initialized");
-    }
-    if (!this.rootDir) {
-      throw new Error("Root directory not set");
-    }
-    if (!api.pageName) {
-      throw new Error("API page name is not set");
-    }
-    const apiName = api.apiPb.metadata.name;
-    if (!apiName) {
-      throw new Error("API name is not set");
-    }
-    const apiDir = path27.join(this.rootDir, "pages", api.pageName, "apis", apiName);
-    const apiPath = path27.join(apiDir, "api.yaml");
-    const isNewApi = !this.getApiFiles()[apiPath];
-    try {
-      const stats = await fs12.stat(apiDir);
-      if (!stats.isDirectory()) {
-        await fs12.mkdir(apiDir, { recursive: true });
-      }
-    } catch {
-      await fs12.mkdir(apiDir, { recursive: true });
-    }
-    await this.writeFile(apiPath, import_yaml2.default.stringify(api.apiPb), "api");
-    const generationNumber = this.generationNumberSequence.next();
-    const apiDef = this.createClientApi(api);
-    let scopeId = "";
-    if (isNewApi) {
-      scopeId = await this.createScopedApi(api);
-    } else {
-      const scopeDef = this.sourceTracker.getScopeDefinitionForPage(api.pageName);
-      scopeId = scopeDef?.id ?? "";
-    }
-    this.emit("apiUpdate", { api: apiDef, scopeId });
-    return { api: apiDef, scopeId, generationNumber };
-  };
-  createScopedApi = async (api) => {
-    if (!this.sourceTracker) {
-      throw new Error("Source tracker not initialized");
-    }
-    const scopeId = await this.sourceTracker.addApi({
-      pageName: api.pageName,
-      apiName: api.apiPb.metadata.name
-    });
-    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
-    await this.writeChanges(changes);
-    return scopeId;
-  };
-  handleDeleteApi = async (payload) => {
-    const logger3 = getLogger();
-    const { apis } = payload;
-    if (!this.rootDir) {
-      throw new Error("Root directory not set");
-    }
-    const rootDir = this.rootDir;
-    const executeDeleteApis = Promise.all(apis.map(({ apiName, pageName }) => {
-      return new Promise(
-        // eslint-disable-next-line no-async-promise-executor
-        async (resolve9) => {
-          const apiFilePath = path27.join(rootDir, "pages", pageName, "apis", apiName, "api.yaml");
-          const api = this.apiFiles[apiFilePath];
-          if (!api || !this.sourceTracker) {
-            return resolve9(void 0);
-          }
-          const apiDir = path27.join(rootDir, "pages", pageName, "apis", apiName);
-          try {
-            const stats = await fs12.stat(apiDir);
-            if (stats.isDirectory()) {
-              await fs12.rmdir(apiDir, { recursive: true });
-            }
-            delete this.apiFiles[apiFilePath];
-            const scopeId = this.sourceTracker.deleteApi({
-              pageName,
-              apiName
-            });
-            resolve9({
-              apiName,
-              pageName,
-              scopeId
-            });
-          } catch (e) {
-            logger3.warn(`Could not delete api ${apiFilePath} ${JSON.stringify(e)}`);
-            resolve9(void 0);
-          }
-          resolve9(void 0);
-        }
-      );
-    }));
-    const deletedApis = (await executeDeleteApis).filter((api) => api !== void 0);
-    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
-    await this.writeChanges(changes);
-    this.emit("apiDelete", {
-      apis: deletedApis.filter((api) => api !== void 0)
-    });
-    return { deletedApis };
-  };
-  handleRenameApi = async (payload) => {
-    const { oldName, newName, pageName } = payload;
-    if (!this.rootDir) {
-      throw new Error("Root directory not set");
-    }
-    const pagePath = getPageFolder(this.rootDir, pageName);
-    const existingApiFolder = path27.join(this.rootDir, "pages", pageName, "apis", oldName);
-    const newApiFolder = path27.join(this.rootDir, "pages", pageName, "apis", newName);
-    const files = this.sourceTracker?.getCurrentFiles();
-    const file = files?.[path27.join(pagePath, "index.tsx")];
-    if (!file || !file.ast) {
-      throw new Error(`Page ${pageName} not found`);
-    }
-    const apiFilePath = path27.join(existingApiFolder, "api.yaml");
-    const apiDef = this.apiFiles[apiFilePath];
-    if (!apiDef) {
-      throw new Error(`API ${oldName} not found`);
-    }
-    const otherPageAPIs = structuredClone(Object.keys(this.apiFiles).filter((path55) => path55.startsWith(pagePath) && path55 !== apiFilePath).map((path55) => ({
-      api: { apiPb: this.apiFiles[path55]?.apiPb },
-      filePath: path55
-    })).filter((api) => !!api.api));
-    const newApiFolderExists = await fs12.stat(newApiFolder).catch(() => false);
-    if (newApiFolderExists) {
-      throw new Error(`API ${newName} already exists`);
-    }
-    this.watcher?.unwatch(existingApiFolder);
-    this.watcher?.unwatch(newApiFolder);
-    apiDef.apiPb.metadata.name = newName;
-    await fs12.rename(existingApiFolder, newApiFolder);
-    const scopeDef = this.sourceTracker?.getScopeDefinitionForPage(pageName);
-    if (!scopeDef) {
-      throw new Error(`Scope definition not found for API`);
-    }
-    this.sourceTracker?.renameEntity({
-      oldName,
-      newName,
-      entityId: scopeDef.scopeNameToEntityId[oldName]
-    });
-    delete this.apiFiles[apiFilePath];
-    this.writeFile(path27.join(newApiFolder, "api.yaml"), import_yaml2.default.stringify(apiDef.apiPb), "api");
-    this.watcher?.add(existingApiFolder);
-    this.watcher?.add(newApiFolder);
-    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
-    await this.writeChanges(changes);
-    this.emit("apiManualUpdate", {
-      api: this.createClientApi(apiDef),
-      oldName,
-      pageName,
-      scopeId: scopeDef?.id ?? ""
-    }, true);
-    await this.renameManager.renameEntityInApis({
-      oldName,
-      newName,
-      apis: otherPageAPIs
-    });
-    await Promise.all(otherPageAPIs.map(async ({ api, filePath }) => {
-      if (isEqual_default(api?.apiPb, this.apiFiles[filePath]?.apiPb)) {
-        return Promise.resolve();
-      }
-      await this.writeFile(filePath, import_yaml2.default.stringify(api?.apiPb), "api");
-      this.emit("apiManualUpdate", {
-        api: this.createClientApi(api),
-        pageName,
-        scopeId: scopeDef?.id ?? ""
-      }, true);
-    }));
-  };
+  // MARK: entity operations
   handleAddEntity = async (payload) => {
     this.sourceTracker?.addEntity({
       scopeId: payload.scopeId,
@@ -437692,6 +437539,7 @@ export default registerPage(Page, { name: "${name18}" });
     const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
     await this.writeChanges(changes);
   };
+  // MARK: rename operations
   handleRenameElement = async (payload) => {
     if (payload.kind === "component") {
       return this.handleRenameComponent(payload);
@@ -437767,93 +437615,195 @@ export default registerPage(Page, { name: "${name18}" });
     this.watcher?.add(newPageFolder);
     this.watcher?.add(oldPageFolder);
   };
-  getPageRoots(filePath) {
-    const scopeFilePath = path27.join(path27.dirname(filePath), "index.tsx");
-    const currentFile = this.sourceTracker?.getCurrentFiles()[scopeFilePath];
-    if (!currentFile) {
-      return null;
+  getRelativeRoutePath(filePath) {
+    if (!this.rootDir) {
+      throw new Error("Root directory not set");
     }
-    return getPageRoots(filePath, currentFile);
+    return path27.relative(path27.join(this.rootDir, PAGES_DIRECTORY), filePath);
   }
-  getScope(filePath) {
-    const scopeFilePath = path27.join(path27.dirname(filePath), SCOPE_FILE);
-    const currentFile = this.sourceTracker?.getCurrentFiles()[scopeFilePath];
-    if (!currentFile) {
-      console.log("File not found", scopeFilePath);
-      return null;
+  // MARK: API operations
+  handleUpdateApi = async (payload) => {
+    const { api } = payload;
+    if (!this.sourceTracker) {
+      throw new Error("Source tracker not initialized");
     }
-    const scope = getScope(scopeFilePath, currentFile);
-    return scope;
-  }
-  getRoutes() {
-    const routes = [];
-    for (const [path55, { file }] of Object.entries(this.routes)) {
-      routes.push({
-        path: path55,
-        component: file
-      });
+    if (!this.rootDir) {
+      throw new Error("Root directory not set");
     }
-    return routes;
-  }
-  async addRoute(route, filePath) {
+    if (!api.pageName) {
+      throw new Error("API page name is not set");
+    }
+    const apiName = api.apiPb.metadata.name;
+    if (!apiName) {
+      throw new Error("API name is not set");
+    }
+    const apiFilePath = getApiFilePath(this.rootDir, api.pageName, apiName);
+    const apiDir = path27.dirname(apiFilePath);
+    const isNewApi = !this.getApiFiles()[apiFilePath];
+    try {
+      const stats = await fs12.stat(apiDir);
+      if (!stats.isDirectory()) {
+        await this.fsOperationQueue.enqueue(async () => await fs12.mkdir(apiDir, { recursive: true }));
+      }
+    } catch {
+      await this.fsOperationQueue.enqueue(async () => await fs12.mkdir(apiDir, { recursive: true }));
+    }
+    await this.writeFile(apiFilePath, import_yaml2.default.stringify(api.apiPb), "api");
+    const generationNumber = this.generationNumberSequence.next();
+    const apiDef = this.createClientApi(api);
+    let scopeId = "";
+    if (isNewApi) {
+      scopeId = await this.addApiToScope(api);
+    } else {
+      const scopeDef = this.sourceTracker.getScopeDefinitionForPage(api.pageName);
+      scopeId = scopeDef?.id ?? "";
+    }
+    this.emit("apiUpdate", { api: apiDef, scopeId });
+    return { api: apiDef, scopeId, generationNumber };
+  };
+  handleDeleteApi = async (payload) => {
+    const logger3 = getLogger();
+    const { apis } = payload;
     if (!this.rootDir) {
       throw new Error("Root directory not set");
     }
-    this.routes[route] = { file: this.getRelativeRoutePath(filePath) };
-    await this.writeFile(path27.join(this.rootDir, ROUTES_FILE), JSON.stringify(this.routes, null, 2));
-  }
-  async removeRoute(filePath) {
+    const rootDir = this.rootDir;
+    const deletedApis = [];
+    for (const { apiName, pageName } of apis) {
+      const apiFilePath = getApiFilePath(rootDir, pageName, apiName);
+      const api = this.apiFiles[apiFilePath];
+      if (!api || !this.sourceTracker) {
+        continue;
+      }
+      const apiDir = path27.dirname(apiFilePath);
+      try {
+        const stats = await fs12.stat(apiDir);
+        if (stats.isDirectory()) {
+          await fs12.rmdir(apiDir, { recursive: true });
+        }
+        delete this.apiFiles[apiFilePath];
+        const scopeId = this.sourceTracker.deleteApi({
+          pageName,
+          apiName
+        });
+        deletedApis.push({
+          apiName,
+          pageName,
+          scopeId
+        });
+      } catch (e) {
+        logger3.warn(`Could not delete api ${apiFilePath} ${JSON.stringify(e)}`);
+      }
+    }
+    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
+    await this.writeChanges(changes);
+    this.emit("apiDelete", {
+      apis: deletedApis.filter((api) => api !== void 0)
+    });
+    return { deletedApis };
+  };
+  handleRenameApi = async (payload) => {
+    const { oldName, newName, pageName } = payload;
     if (!this.rootDir) {
       throw new Error("Root directory not set");
     }
-    const relativeFilePath = this.getRelativeRoutePath(filePath);
-    this.routes = Object.fromEntries(Object.entries(this.routes).filter(([_, value2]) => value2.file !== relativeFilePath));
-    await this.writeFile(path27.join(this.rootDir, ROUTES_FILE), JSON.stringify(this.routes, null, 2));
-  }
-  async writeChanges(changes, callback) {
-    return Promise.all(changes.map(async ({ fileName, source: source2, kind }) => {
-      await this.writeFile(fileName, source2, kind);
-      return callback?.(fileName, source2);
-    }));
-  }
-  getNodeForWidgetSourceId(id2) {
-    return this.sourceTracker?.getElementToLocation(id2);
-  }
-  getAstForWidgetSourceId(id2) {
-    const filePath = this.sourceTracker?.getElementToFilePath(id2);
-    if (!filePath) {
-      return null;
+    const pagePath = getPageFolder(this.rootDir, pageName);
+    const existingApiFolder = path27.join(this.rootDir, "pages", pageName, "apis", oldName);
+    const newApiFolder = path27.join(this.rootDir, "pages", pageName, "apis", newName);
+    const files = this.sourceTracker?.getCurrentFiles();
+    const file = files?.[path27.join(pagePath, "index.tsx")];
+    if (!file || !file.ast) {
+      throw new Error(`Page ${pageName} not found`);
     }
-    return this.sourceTracker?.getCurrentFiles()[filePath]?.ast;
-  }
-  renameIdentifierInApis = async ({ elementId, oldName, newName, parentBinding }) => {
-    const apisInScope = structuredClone(this.getApisInScope(elementId));
+    const apiFilePath = path27.join(existingApiFolder, "api.yaml");
+    const apiDef = this.apiFiles[apiFilePath];
+    if (!apiDef) {
+      throw new Error(`API ${oldName} not found`);
+    }
+    const otherPageAPIs = structuredClone(Object.keys(this.apiFiles).filter((path55) => path55.startsWith(pagePath) && path55 !== apiFilePath).map((path55) => ({
+      api: { apiPb: this.apiFiles[path55]?.apiPb },
+      filePath: path55
+    })).filter((api) => !!api.api));
+    const newApiFolderExists = await fs12.stat(newApiFolder).catch(() => false);
+    if (newApiFolderExists) {
+      throw new Error(`API ${newName} already exists`);
+    }
+    this.watcher?.unwatch(existingApiFolder);
+    this.watcher?.unwatch(newApiFolder);
+    apiDef.apiPb.metadata.name = newName;
+    await fs12.rename(existingApiFolder, newApiFolder);
+    const scopeDef = this.sourceTracker?.getScopeDefinitionForPage(pageName);
+    if (!scopeDef) {
+      throw new Error(`Scope definition not found for API`);
+    }
+    this.sourceTracker?.renameEntity({
+      oldName,
+      newName,
+      entityId: scopeDef.scopeNameToEntityId[oldName]
+    });
+    delete this.apiFiles[apiFilePath];
+    this.writeFile(path27.join(newApiFolder, "api.yaml"), import_yaml2.default.stringify(apiDef.apiPb), "api");
+    this.watcher?.add(existingApiFolder);
+    this.watcher?.add(newApiFolder);
+    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
+    await this.writeChanges(changes);
+    this.emit("apiManualUpdate", {
+      api: this.createClientApi(apiDef),
+      oldName,
+      pageName,
+      scopeId: scopeDef?.id ?? ""
+    }, true);
     await this.renameManager.renameEntityInApis({
       oldName,
       newName,
-      parentBinding,
-      apis: apisInScope
+      apis: otherPageAPIs
     });
-    await Promise.all(apisInScope.map(({ api, filePath }) => {
+    await Promise.all(otherPageAPIs.map(async ({ api, filePath }) => {
       if (isEqual_default(api?.apiPb, this.apiFiles[filePath]?.apiPb)) {
         return Promise.resolve();
       }
-      return this.writeFile(filePath, import_yaml2.default.stringify(api?.apiPb), "api");
+      await this.writeFile(filePath, import_yaml2.default.stringify(api?.apiPb), "api");
+      this.emit("apiManualUpdate", {
+        api: this.createClientApi(api),
+        pageName,
+        scopeId: scopeDef?.id ?? ""
+      }, true);
     }));
   };
-  getApisInScope = (elementId) => {
-    const filePath = this.sourceTracker?.getElementToFilePath(elementId);
-    if (!filePath) {
-      return [];
-    }
-    const pagePath = path27.dirname(filePath);
-    return Object.entries(this.apiFiles).filter(([filePath2]) => filePath2.includes(pagePath)).map(([filePath2, api]) => ({ api, filePath: filePath2 }));
-  };
-  getRelativeRoutePath(filePath) {
-    if (!this.rootDir) {
-      throw new Error("Root directory not set");
+  async removeApiData(filePath) {
+    const api = this.apiFiles[filePath];
+    if (!api) {
+      return;
     }
-    return path27.relative(path27.join(this.rootDir, PAGES_DIRECTORY), filePath);
+    delete this.apiFiles[filePath];
+    this.sourceTracker?.deleteApi({
+      pageName: api.pageName,
+      apiName: api.apiPb.metadata.name
+    });
+    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
+    await this.writeChanges(changes);
+    const scopeId = this.sourceTracker?.getScopeDefinitionForPage(api.pageName)?.id;
+    this.emit("apiManualDelete", {
+      api: {
+        id: getClientApiId(api.apiPb.metadata.name, api.pageName),
+        apiName: api.apiPb.metadata.name,
+        // TODO(saksham): get pagename more defensively
+        pageName: getPageName2(filePath),
+        scopeId
+      }
+    });
+  }
+  getApiFiles() {
+    return Object.keys(this.apiFiles).reduce((acc, key2) => {
+      if (!this.apiFiles[key2]) {
+        return acc;
+      }
+      acc[key2] = {
+        api: this.createClientApi(this.apiFiles[key2]),
+        scopeId: this.apiFiles[key2].scopeId
+      };
+      return acc;
+    }, {});
   }
   // Utilities for converting server API format to Client API format
   // We internally save the API as the server does, but we return should always return it
@@ -437870,19 +437820,19 @@ export default registerPage(Page, { name: "${name18}" });
       }
     };
   }
-  formatApisToClientApis(serverApis) {
-    return Object.keys(serverApis).reduce((acc, key2) => {
-      if (!serverApis[key2]) {
-        return acc;
-      }
-      acc[key2] = {
-        api: this.createClientApi(serverApis[key2]),
-        scopeId: serverApis[key2].scopeId
-      };
-      return acc;
-    }, {});
-  }
-  async processApiUpdates(filePath, fileType) {
+  addApiToScope = async (api) => {
+    if (!this.sourceTracker) {
+      throw new Error("Source tracker not initialized");
+    }
+    const scopeId = await this.sourceTracker.addApi({
+      pageName: api.pageName,
+      apiName: api.apiPb.metadata.name
+    });
+    const changes = await this.sourceTracker?.getAndFlushChanges() ?? [];
+    await this.writeChanges(changes);
+    return scopeId;
+  };
+  async processApiFileUpdates(filePath, fileType) {
     let yamlPath = filePath;
     if (fileType.type === "python-api-step" || fileType.type === "js-api-step") {
       const apiFolderPath = filePath.split("/").slice(0, -1).join("/");
@@ -437898,7 +437848,7 @@ export default registerPage(Page, { name: "${name18}" });
       logger3.info(`API structure is valid: ${yamlPath}`);
       const parsedData = { apiPb: apiContent?.api };
       if (!(yamlPath in this.apiFiles && isEqual_default(this.apiFiles[yamlPath]?.apiPb, parsedData.apiPb))) {
-        const { updatedApi, pageName, isNewApi } = this.updateApi({
+        const { updatedApi, pageName, isNewApi } = this.updateInternalApiData({
           api: parsedData.apiPb,
           stepPathMap: apiContent.stepPathMap
         }, yamlPath);
@@ -437909,7 +437859,7 @@ export default registerPage(Page, { name: "${name18}" });
           return;
         }
         if (isNewApi) {
-          await this.createScopedApi(updatedApi);
+          await this.addApiToScope(updatedApi);
         }
         this.emit("apiManualUpdate", {
           api: this.createClientApi(updatedApi),
@@ -437923,6 +437873,50 @@ export default registerPage(Page, { name: "${name18}" });
       logger3.error(`Error updating API: ${yamlPath}, error: ${error}`);
     }
   }
+  updateInternalApiData = (content2, path55) => {
+    if (!this.rootDir) {
+      throw new Error("Root directory not set");
+    }
+    const { api: apiContents, stepPathMap } = content2;
+    const pageName = getPageName2(path55);
+    let scopeId = this.sourceTracker?.getScopeDefinitionForPage(pageName)?.id;
+    if (!scopeId) {
+      console.warn("Scope ID not found for API", apiContents.metadata.name);
+      scopeId = "";
+    }
+    const updatedApi = {
+      apiPb: import_yaml2.default.parse(JSON.stringify(apiContents)),
+      pageName,
+      stepPathMap,
+      scopeId
+    };
+    const isNewApi = !this.apiFiles[path55];
+    this.apiFiles[path55] = updatedApi;
+    return { updatedApi, pageName, isNewApi };
+  };
+  renameIdentifierInApis = async ({ elementId, oldName, newName, parentBinding }) => {
+    const apisInScope = structuredClone(this.getApisInScope(elementId));
+    await this.renameManager.renameEntityInApis({
+      oldName,
+      newName,
+      parentBinding,
+      apis: apisInScope
+    });
+    await Promise.all(apisInScope.map(({ api, filePath }) => {
+      if (isEqual_default(api?.apiPb, this.apiFiles[filePath]?.apiPb)) {
+        return Promise.resolve();
+      }
+      return this.writeFile(filePath, import_yaml2.default.stringify(api?.apiPb), "api");
+    }));
+  };
+  getApisInScope = (elementId) => {
+    const filePath = this.sourceTracker?.getElementToFilePath(elementId);
+    if (!filePath) {
+      return [];
+    }
+    const pagePath = path27.dirname(filePath);
+    return Object.entries(this.apiFiles).filter(([filePath2]) => filePath2.includes(pagePath)).map(([filePath2, api]) => ({ api, filePath: filePath2 }));
+  };
 };
 async function readFile6(path55) {
   try {
@@ -442801,7 +442795,7 @@ var import_util30 = __toESM(require_dist3(), 1);
 // ../sdk/package.json
 var package_default = {
   name: "@superblocksteam/sdk",
-  version: "2.0.6-next.22",
+  version: "2.0.6-next.24",
   type: "module",
   description: "Superblocks JS SDK",
   homepage: "https://www.superblocks.com",
@@ -442842,11 +442836,11 @@ var package_default = {
     "@opentelemetry/semantic-conventions": "^1.28.0",
     "@rollup/wasm-node": "^4.35.0",
     "@superblocksteam/bucketeer-sdk": "0.5.0",
-    "@superblocksteam/library": "2.0.6-next.22",
-    "@superblocksteam/library-shared": "2.0.6-next.22",
+    "@superblocksteam/library": "2.0.6-next.24",
+    "@superblocksteam/library-shared": "2.0.6-next.24",
     "@superblocksteam/shared": "0.9198.0",
-    "@superblocksteam/util": "2.0.6-next.22",
-    "@superblocksteam/vite-plugin-file-sync": "2.0.6-next.22",
+    "@superblocksteam/util": "2.0.6-next.24",
+    "@superblocksteam/vite-plugin-file-sync": "2.0.6-next.24",
     "@vitejs/plugin-react": "^4.3.4",
     axios: "^1.4.0",
     chokidar: "^4.0.3",
@@ -450418,7 +450412,7 @@ async function startVite({ app, httpServer: httpServer2, root: root2, mode, port
   const isCustomBuildEnabled2 = await isCustomComponentsEnabled();
   const customFolder = path37.join(root2, "custom");
   const draftsFolder = path37.join(root2, ".superblocks");
-  const cdnUrl = "https://assets-cdn.superblocks.com/library/2.0.6-next.22";
+  const cdnUrl = "https://assets-cdn.superblocks.com/library/2.0.6-next.24";
   const env3 = loadEnv(mode, root2, "");
   const hmrPort = await getFreePort();
   const hmrOptions = {

package/oclif.manifest.json

@@ -585,5 +585,5 @@
       "strict": true
     }
   },
-  "version": "2.0.6-next.22"
+  "version": "2.0.6-next.24"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@superblocksteam/cli",
-  "version": "2.0.6-next.22",
+  "version": "2.0.6-next.24",
   "type": "module",
   "description": "Official Superblocks CLI",
   "homepage": "https://www.superblocks.com",
@@ -42,9 +42,9 @@
   "devDependencies": {
     "@eslint/js": "^9.16.0",
     "@oclif/test": "^4.1.11",
-    "@superblocksteam/sdk": "2.0.6-next.22",
+    "@superblocksteam/sdk": "2.0.6-next.24",
     "@superblocksteam/shared": "0.9198.0",
-    "@superblocksteam/util": "2.0.6-next.22",
+    "@superblocksteam/util": "2.0.6-next.24",
     "@types/babel__core": "^7.20.0",
     "@types/chai": "^4",
     "@types/fs-extra": "^11.0.1",