@superblocksteam/sdk 2.0.6 → 2.0.7

package/src/dev-utils/vite-plugin-build-manifest-stub.mts

@@ -0,0 +1,30 @@
+import type { Plugin } from "vite";
+
+const BUILD_MANIFEST_MODULE_PATH = "./user-facing/build-manifest.js";
+const VIRTUAL_MODULE_ID = "\0virtual:build-manifest.js";
+
+/**
+ * This plugin is used to stub the build manifest module. It creates a virtual module
+ * for the build manifest module and returns an empty object.
+ *
+ * This is meant to be used to avoid errors when the build manifest module is not found.
+ * This plugin only runs in dev server mode.
+ */
+export const buildManifestStubPlugin = (): Plugin => {
+  return {
+    name: "build-manifest-stub",
+    enforce: "pre",
+    apply: "serve",
+
+    resolveId(source) {
+      if (source === BUILD_MANIFEST_MODULE_PATH) {
+        return VIRTUAL_MODULE_ID;
+      }
+    },
+    load(id) {
+      if (id === VIRTUAL_MODULE_ID) {
+        return "export default {}";
+      }
+    },
+  };
+};

package/src/dev-utils/vite-plugin-sb-cdn.mts

@@ -224,8 +224,8 @@ async function analyzeModuleGraph(
     { content: string; binary: ArrayBuffer }
   > = new Map(),
 ): Promise<AnalysisResult> {
-  // Avoid circular dependencies
-  if (visited.has(url)) {
+  // Avoid circular dependencies and skip the shared library's build manifest reference
+  if (visited.has(url) || url.endsWith("/user-facing/build-manifest.js")) {
     return {
       dependencies: new Set(),
       content: "",
@@ -474,6 +474,13 @@ const wellKnownPackages = new Map<string, string>([
   ["react-dom", "https://esm.sh/react-dom@18.2.0"],
   ["react/jsx-runtime", "https://esm.sh/react@18.2.0/jsx-runtime"],
   ["react/jsx-dev-runtime", "https://esm.sh/react@18.2.0/jsx-dev-runtime"],
+  ["./user-facing/build-manifest.js", "/assets/build-manifest.js"],
+  ["/assets/user-facing/build-manifest.js", "/assets/build-manifest.js"],
+]);
+
+const packagesToExcludeFromCdnRedirect = new Set<string>([
+  "./user-facing/build-manifest.js",
+  "/assets/user-facing/build-manifest.js",
 ]);
 
 const react18CdnUrl = "https://esm.sh/react@18.2.0";
@@ -773,8 +780,12 @@ export async function superblocksCdnPlugin(
         // Externalize modules specified in the import map
         // The cdn: prefix ensures they're properly resolved to the CDN URL
         if (imports.includes(id)) {
+          const shouldRedirectToCdn = !packagesToExcludeFromCdnRedirect.has(id);
           debug(`Externalizing module for CDN resolution: ${id}`);
-          return { id: `cdn:${id}`, external: true };
+          return {
+            id: `${shouldRedirectToCdn ? "cdn:" : ""}${id}`,
+            external: true,
+          };
         }
 
         return null;

package/src/index.ts

@@ -11,6 +11,8 @@ export {
   fetchApplicationWithComponents,
   fetchApplications,
   fetchCurrentUser,
+  getDefaultBranchInfo,
+  getCurrentBranchInfo,
   pushApi,
   pushApplication,
   registerComponents,
@@ -20,8 +22,10 @@ export {
   type ApplicationWrapper,
   type Branch,
   type Branches,
+  type BranchSource,
   type CodeModeApplicationWrapper,
   type CommitDto,
+  type CurrentBranch,
   type GetCommitsResponseBody,
   type MultiPageApplicationWrapper,
   type MultiPageApplicationWrapperWithComponents,

package/src/vite-plugin-generate-build-manifest.mts

@@ -0,0 +1,192 @@
+import path from "node:path";
+import { parse } from "@babel/parser";
+import { getClientApiId } from "@superblocksteam/library-shared";
+import { resolveLanguageSpecificStepContentFromBlocks } from "@superblocksteam/util";
+import { getPageName } from "@superblocksteam/vite-plugin-file-sync";
+import {
+  extractIdentifierPathsFromApi,
+  extractApiDependencies,
+} from "@superblocksteam/vite-plugin-file-sync/binding-extraction";
+import {
+  getScope,
+  extractImportsFromAst,
+} from "@superblocksteam/vite-plugin-file-sync/parsing";
+import { yellow, red } from "colorette";
+import fg from "fast-glob";
+import fs from "fs-extra";
+import { createLogger } from "vite";
+import yaml from "yaml";
+import { getLogger } from "./dev-utils/dev-logger.mjs";
+import type { ParseResult } from "@babel/parser";
+import type { File } from "@babel/types";
+import type {
+  DeleteMeLibraryApi,
+  StaticScope,
+} from "@superblocksteam/library-shared/types";
+import type { Plugin } from "vite";
+
+export const scopeFileBaseName = "scope.ts";
+export const apiFileBaseName = "api.yaml";
+
+type ApiDependency = {
+  apiName: string;
+  params: string[];
+  dependencies: string[];
+};
+
+/**
+ * Vite plugin that generates a build manifest for the application.
+ *
+ * This plugin will:
+ * 1. Read all api.yaml and api.yml files in the application
+ * 2. Read all scope.ts files in the application
+ * 3. Generate a build manifest for the application
+ * 4. Write the build manifest to a file in the build output directory
+ *
+ * The build manifest is a JSON object with the following properties:
+ * - apis: a map of all apis in the application keyed by their file path
+ * - apiDependencies: an array where each item represents an api and its dependencies
+ *
+ * @param root - The root directory of the application
+ * @returns A Vite plugin that generates a build manifest for the application
+ */
+export function generateBuildManifestPlugin(root: string) {
+  const viteLogger = createLogger();
+  const logger = getLogger();
+  viteLogger.info = (msg: string) => logger.info(msg);
+  viteLogger.warn = (msg: string) => {
+    logger.warn(yellow(msg));
+  };
+  viteLogger.warnOnce = (msg: string) => {
+    logger.warn(yellow(msg));
+  };
+  viteLogger.error = (msg: string) => {
+    logger.error(red(msg));
+  };
+
+  viteLogger.clearScreen = () => {};
+
+  const scopesByPage: Record<string, StaticScope | null> = {};
+  const apiFiles: Record<string, DeleteMeLibraryApi> = {};
+  let buildManifest: {
+    apis: Record<string, { api: DeleteMeLibraryApi; scopeId: string }>;
+    apiDependencies: ApiDependency[];
+  } = { apis: {}, apiDependencies: [] };
+
+  return {
+    name: "sb-generate-build-manifest",
+    apply: "build",
+    enforce: "pre",
+
+    async buildStart() {
+      const apiDocuments = await fg(["**/api.yaml", "**/api.yml"], {
+        cwd: root,
+      });
+
+      for (const apiFilePath of apiDocuments) {
+        const absoluteApiFilePath = path.join(root, apiFilePath);
+
+        const document = await fs.readFile(absoluteApiFilePath, "utf-8");
+        const apiPb = yaml.parse(document);
+
+        await resolveLanguageSpecificStepContentFromBlocks(
+          path.dirname(absoluteApiFilePath),
+          apiPb.blocks ?? [],
+          {},
+        );
+
+        const pageName = getPageName(apiFilePath);
+        apiPb.metadata.id = getClientApiId(apiPb.metadata.name, pageName);
+        apiFiles[apiFilePath] = { apiPb, pageName };
+      }
+    },
+
+    transform(code: string, id: string) {
+      if (id.endsWith(scopeFileBaseName)) {
+        const ast = parse(code, {
+          sourceType: "module",
+          sourceFilename: id,
+          plugins: [["typescript", {}]],
+        });
+
+        const scopeFileMeta: {
+          code: string;
+          ast: ParseResult<File>;
+          imports: Record<string, boolean>;
+        } = {
+          code,
+          ast,
+          imports: extractImportsFromAst(ast),
+        };
+        const scope = getScope(id, scopeFileMeta);
+
+        scopesByPage[getPageName(id)] = scope;
+      }
+
+      return code;
+    },
+
+    async generateBundle() {
+      const allApiNames = getAllUniqueApiNames(apiFiles);
+
+      const allApis = Object.entries(apiFiles).reduce(
+        (acc, [id, api]) => {
+          acc[id] = {
+            api,
+            scopeId: scopesByPage[api.pageName]?.scopeId ?? "",
+          };
+          return acc;
+        },
+        {} as Record<string, { api: DeleteMeLibraryApi; scopeId: string }>,
+      );
+
+      const deps = await getApiDependencies(allApiNames, apiFiles);
+
+      buildManifest = {
+        apis: allApis,
+        apiDependencies: deps,
+      };
+
+      this.emitFile({
+        type: "prebuilt-chunk",
+        fileName: "assets/build-manifest.js",
+        code: `export default ${JSON.stringify(buildManifest)}`,
+        exports: ["default"],
+      });
+    },
+  } as Plugin;
+}
+
+function getAllUniqueApiNames(
+  apiFiles: Record<string, DeleteMeLibraryApi>,
+): string[] {
+  const allApiNamesSet = new Set<string>(
+    Object.values(apiFiles).map((api) => api.apiPb.metadata.name),
+  );
+  return Array.from(allApiNamesSet);
+}
+
+async function getApiDependencies(
+  apiNames: string[],
+  apiFiles: Record<string, DeleteMeLibraryApi>,
+): Promise<ApiDependency[]> {
+  const deps: ApiDependency[] = [];
+
+  // TODO: This logic is a copy of the extractApiParamsAndDependencies function in the
+  // fileSyncVitePlugin (https://github.com/superblocksteam/superblocks/blob/474c0b11d79a1d6988864fb20d5ec26f92931fde/packages/vite-plugin-file-sync/src/file-sync-vite-plugin.ts#L261-L280).
+  //
+  // This logic should be refactored so that it can be shared between the two plugins.
+  await Promise.all([
+    ...Object.values(apiFiles).map(async (api) => {
+      const bindings = await extractIdentifierPathsFromApi(api);
+      const apiDependencies = extractApiDependencies(apiNames, bindings);
+      deps.push({
+        apiName: api.apiPb.metadata.name,
+        params: bindings,
+        dependencies: apiDependencies,
+      });
+    }),
+  ]);
+
+  return deps;
+}

package/src/vite-plugin-inject-sb-ids-transform.mts

@@ -29,7 +29,7 @@ const routesFileBaseName = "routes.json";
 export async function injectSuperblocksIdsPlugin(root: string) {
   const viteLogger = createLogger();
   const logger = getLogger();
-  viteLogger.info = logger.info;
+  viteLogger.info = (msg: string) => logger.info(msg);
   viteLogger.warn = (msg: string) => {
     logger.warn(yellow(msg));
   };

package/test/clients.test.mts

@@ -0,0 +1,120 @@
+import fs from "fs";
+import path from "path";
+import { expect } from "chai";
+import { describe, it } from "mocha";
+import { BranchSource, getCurrentBranchInfo } from "../src/client.js";
+import { getCurrentGitBranch } from "../src/version-control.mjs";
+import type { SuperblocksDevEnvironmentConfig } from "@superblocksteam/util";
+
+// The .superblocks folder is located in the 'test' directory, so we need to prefix the path in order to find it.
+const testPathPrefix = "test";
+const superblocksTestFolder = path.join(
+  process.cwd(),
+  testPathPrefix,
+  ".superblocks",
+);
+const devEnvBranch = "dev-branch";
+const currentGitBranch = await getCurrentGitBranch();
+
+describe("get current branch info", () => {
+  let createdSuperblocksFolder = false;
+
+  before(async function () {
+    // Make the .superblocks folder in the test directory, if it is missing. It should be git-ignored.
+    if (!fs.existsSync(superblocksTestFolder)) {
+      fs.mkdirSync(superblocksTestFolder, { recursive: true });
+      createdSuperblocksFolder = true;
+    }
+    // Create a dev-environment.json file in the .superblocks folder.
+    const devEnvironmentJson = path.join(
+      superblocksTestFolder,
+      "dev-environment.json",
+    );
+    fs.writeFileSync(
+      devEnvironmentJson,
+      JSON.stringify({
+        branch: devEnvBranch,
+        configType: "DEV_ENVIRONMENT",
+      } as SuperblocksDevEnvironmentConfig),
+    );
+  });
+
+  after(async function () {
+    // Delete the .superblocks folder in the test directory.
+    if (createdSuperblocksFolder && fs.existsSync(superblocksTestFolder)) {
+      fs.rmSync(superblocksTestFolder, { recursive: true });
+    }
+  });
+
+  it("should find the dev environment config and return a valid branch info object", async () => {
+    const branchInfo = await getCurrentBranchInfo(undefined, testPathPrefix);
+
+    expect(branchInfo.branchName).to.equal(devEnvBranch);
+    expect(branchInfo.source).to.equal(BranchSource.DEV_ENVIRONMENT);
+    expect(branchInfo.userSpecifiedBranch).to.be.undefined;
+    expect(branchInfo.isDefinedInDevEnvironmentConfig()).to.be.true;
+    expect(branchInfo.isDevEnvironmentWithUserSpecifiedBranch()).to.be.false;
+    expect(branchInfo.isDefaultBranch()).to.be.false;
+
+    // Call it again to make sure it has the same properties
+    const branchInfo2 = await getCurrentBranchInfo(undefined, testPathPrefix);
+    expect(branchInfo).to.deep.equal(branchInfo2);
+  });
+
+  it("should find the dev environment config and include the user-specified branch parameter", async () => {
+    const userBranch = "test-user-branch";
+    const branchInfo = await getCurrentBranchInfo(userBranch, testPathPrefix);
+
+    expect(branchInfo.branchName).to.equal(devEnvBranch);
+    expect(branchInfo.source).to.equal(BranchSource.DEV_ENVIRONMENT);
+    expect(branchInfo.userSpecifiedBranch).to.equal(userBranch);
+    expect(branchInfo.isDefinedInDevEnvironmentConfig()).to.be.true;
+    expect(branchInfo.isDevEnvironmentWithUserSpecifiedBranch()).to.be.true;
+    expect(branchInfo.isDefaultBranch()).to.be.false;
+
+    // Call it again to make sure it's the same object
+    const branchInfo2 = await getCurrentBranchInfo(userBranch, testPathPrefix);
+    expect(branchInfo).to.deep.equal(branchInfo2);
+
+    // Call it again without the test path will find the user supplied branch
+    const branchInfo3 = await getCurrentBranchInfo(userBranch);
+    expect(branchInfo3.branchName).to.equal(userBranch);
+    expect(branchInfo3.source).to.equal(BranchSource.COMMAND_LINE);
+    expect(branchInfo3.userSpecifiedBranch).to.equal(userBranch);
+    expect(branchInfo3.isDefinedInDevEnvironmentConfig()).to.be.false;
+    expect(branchInfo3.isDevEnvironmentWithUserSpecifiedBranch()).to.be.false;
+    expect(branchInfo3.isDefaultBranch()).to.be.false;
+  });
+
+  it("should not find a dev environment config and return an info with our git branch", async () => {
+    const branchInfo = await getCurrentBranchInfo();
+    expect(branchInfo.branchName).to.equal(currentGitBranch);
+    expect(branchInfo.source).to.equal(BranchSource.GIT_REPO);
+    expect(branchInfo.userSpecifiedBranch).to.be.undefined;
+    expect(branchInfo.isDefinedInDevEnvironmentConfig()).to.be.false;
+    expect(branchInfo.isDevEnvironmentWithUserSpecifiedBranch()).to.be.false;
+    expect(branchInfo.isDefaultBranch()).to.be.false;
+
+    // Call it again to make sure it's the same object
+    const branchInfo2 = await getCurrentBranchInfo();
+    expect(branchInfo).to.deep.equal(branchInfo2);
+  });
+
+  it("should not find a dev environment config and return an info with the user-specified branch", async () => {
+    const userBranch = "test-user-branch";
+    expect(userBranch).to.not.equal(devEnvBranch);
+    expect(userBranch).to.not.equal(currentGitBranch);
+
+    const branchInfo = await getCurrentBranchInfo(userBranch);
+    expect(branchInfo.branchName).to.equal(userBranch);
+    expect(branchInfo.source).to.equal(BranchSource.COMMAND_LINE);
+    expect(branchInfo.userSpecifiedBranch).to.equal(userBranch);
+    expect(branchInfo.isDefinedInDevEnvironmentConfig()).to.be.false;
+    expect(branchInfo.isDevEnvironmentWithUserSpecifiedBranch()).to.be.false;
+    expect(branchInfo.isDefaultBranch()).to.be.false;
+
+    // Call it again to make sure it's the same object
+    const branchInfo2 = await getCurrentBranchInfo(userBranch);
+    expect(branchInfo).to.deep.equal(branchInfo2);
+  });
+});