@plasmicapp/cli 0.1.162

package/dist/utils/test-utils.js

@@ -0,0 +1,106 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TempRepo = void 0;
+const fs_1 = __importDefault(require("fs"));
+const path = __importStar(require("path"));
+const tmp = __importStar(require("tmp"));
+const config_utils_1 = require("../utils/config-utils");
+const file_utils_1 = require("./file-utils");
+class TempRepo {
+    constructor() {
+        this.tmpDir = tmp.dirSync({ unsafeCleanup: true });
+    }
+    destroy() {
+        this.tmpDir.removeCallback();
+    }
+    resolveFile(relativePath) {
+        return path.resolve(this.tmpDir.name, relativePath);
+    }
+    readFile(relativePath) {
+        const absPath = this.resolveFile(relativePath);
+        const buf = file_utils_1.readFileText(absPath);
+        return buf.toString();
+    }
+    writeFile(relativePath, data) {
+        const absPath = this.resolveFile(relativePath);
+        file_utils_1.writeFileText(absPath, data);
+    }
+    deleteFile(relativePath) {
+        const absPath = this.resolveFile(relativePath);
+        file_utils_1.deleteFileBuffered(absPath);
+    }
+    checkFile(relativePath) {
+        const absPath = this.resolveFile(relativePath);
+        try {
+            const stats = fs_1.default.statSync(absPath);
+            return !!stats ? true : false;
+        }
+        catch (e) {
+            return false;
+        }
+    }
+    getComponentFileContents(projectId, componentId) {
+        const plasmicJson = JSON.parse(this.readFile(config_utils_1.CONFIG_FILE_NAME));
+        const srcDir = plasmicJson.srcDir;
+        const projectConfig = plasmicJson.projects.find((p) => p.projectId === projectId);
+        if (!projectConfig) {
+            return;
+        }
+        const componentConfig = projectConfig.components.find((c) => c.id === componentId);
+        if (!componentConfig) {
+            return;
+        }
+        const data = this.readFile(path.join(srcDir, componentConfig.renderModuleFilePath));
+        return data;
+    }
+    plasmicAuthPath() {
+        return this.resolveFile(config_utils_1.AUTH_FILE_NAME);
+    }
+    writePlasmicAuth(json) {
+        this.writeFile(config_utils_1.AUTH_FILE_NAME, JSON.stringify(json));
+    }
+    deletePlasmicAuth() {
+        this.deleteFile(config_utils_1.AUTH_FILE_NAME);
+    }
+    plasmicJsonPath() {
+        return this.resolveFile(config_utils_1.CONFIG_FILE_NAME);
+    }
+    readPlasmicJson() {
+        return JSON.parse(this.readFile(config_utils_1.CONFIG_FILE_NAME));
+    }
+    writePlasmicJson(json) {
+        this.writeFile(config_utils_1.CONFIG_FILE_NAME, JSON.stringify(json));
+    }
+    deletePlasmicJson() {
+        this.deleteFile(config_utils_1.CONFIG_FILE_NAME);
+    }
+    plasmicLoaderJsonPath() {
+        return this.resolveFile(config_utils_1.LOADER_CONFIG_FILE_NAME);
+    }
+    readPlasmicLoaderJson() {
+        return JSON.parse(this.readFile(config_utils_1.LOADER_CONFIG_FILE_NAME));
+    }
+}
+exports.TempRepo = TempRepo;

package/dist/utils/user-utils.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Provide a standardized way to ask user to continue
+ * @param message
+ * @param yes - If true, always return true without prompting.
+ * @param default - Override the default value returned if the user presses enter
+ */
+export declare function confirmWithUser(message: string, yes?: boolean, defaultAnswer?: "y" | "n"): Promise<boolean>;

package/dist/utils/user-utils.js

@@ -0,0 +1,48 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.confirmWithUser = void 0;
+const inquirer_1 = __importDefault(require("inquirer"));
+const deps_1 = require("../deps");
+/**
+ * Provide a standardized way to ask user to continue
+ * @param message
+ * @param yes - If true, always return true without prompting.
+ * @param default - Override the default value returned if the user presses enter
+ */
+function confirmWithUser(message, yes, defaultAnswer) {
+    return __awaiter(this, void 0, void 0, function* () {
+        if (process.env.QUIET) {
+            return true;
+        }
+        if (!!yes) {
+            if (!process.env.QUIET) {
+                deps_1.logger.info(`${message} (Y/n): y`);
+            }
+            return true;
+        }
+        defaultAnswer = defaultAnswer !== null && defaultAnswer !== void 0 ? defaultAnswer : "y";
+        const isDefaultYes = defaultAnswer === "y";
+        const choices = `(${isDefaultYes ? "Y" : "y"}/${isDefaultYes ? "n" : "N"})`;
+        const res = yield inquirer_1.default.prompt([
+            {
+                name: "continue",
+                message: `${message} ${choices}`,
+                default: defaultAnswer,
+            },
+        ]);
+        return ["y", "yes"].includes(res.continue.toLowerCase());
+    });
+}
+exports.confirmWithUser = confirmWithUser;

package/jest.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  preset: "ts-jest/presets/js-with-babel",
+  testEnvironment: "node",
+  testPathIgnorePatterns: ["/node_modules/", "/dist/"],
+  testRunner: "jest-circus/runner",
+};

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@plasmicapp/cli",
+  "version": "0.1.162",
+  "description": "plasmic cli for syncing local code with Plasmic designs",
+  "engines": {
+    "node": ">=12"
+  },
+  "main": "./dist/lib.js",
+  "types": "./dist/lib.d.ts",
+  "bin": {
+    "plasmic": "./dist/index.js"
+  },
+  "scripts": {
+    "wtest": "jest --colors --watchAll",
+    "test": "jest --colors",
+    "test:debug": "node --inspect-brk node_modules/.bin/jest --runInBand --watch",
+    "build": "bash build.sh",
+    "plasmic": "ts-node src/index.ts",
+    "prepare": "yarn build"
+  },
+  "devDependencies": {
+    "@babel/preset-typescript": "^7.12.1",
+    "@plasmicapp/react-web": "^0.2.18",
+    "@types/findup-sync": "^2.0.2",
+    "@types/glob": "^7.1.3",
+    "@types/inquirer": "^6.5.0",
+    "@types/jest": "^26.0.4",
+    "@types/latest-version": "^4.0.1",
+    "@types/lodash": "^4.14.157",
+    "@types/node": "^14.0.23",
+    "@types/pako": "^1.0.1",
+    "@types/prettier": "^2.0.2",
+    "@types/semver": "^7.3.1",
+    "@types/tmp": "^0.2.0",
+    "@types/update-notifier": "^4.1.0",
+    "@types/uuid": "^8.3.0",
+    "@types/wrap-ansi": "^3.0.0",
+    "@types/yargs": "^15.0.5",
+    "@typescript-eslint/eslint-plugin": "^3.8.0",
+    "@typescript-eslint/parser": "^3.8.0",
+    "eslint": "^7.7.0",
+    "jest": "^26.1.0",
+    "jest-circus": "^26.1.0",
+    "tmp": "^0.2.1",
+    "ts-jest": "^26.1.2",
+    "ts-node": "^8.10.2",
+    "typescript-json-schema": "^0.45.0"
+  },
+  "dependencies": {
+    "@babel/core": "^7.12.3",
+    "@babel/generator": "^7.12.1",
+    "@plasmicapp/code-merger": "^0.0.31",
+    "@sentry/node": "^5.19.2",
+    "@types/socket.io-client": "^1.4.34",
+    "axios": "^0.21.1",
+    "chalk": "^4.1.0",
+    "fast-glob": "^3.2.4",
+    "findup-sync": "^4.0.0",
+    "fs": "^0.0.1-security",
+    "glob": "^7.1.6",
+    "inquirer": "^7.3.2",
+    "latest-version": "^5.1.0",
+    "lodash": "^4.17.19",
+    "moment": "^2.27.0",
+    "open": "^8.0.9",
+    "pako": "^1.0.11",
+    "path": "^0.12.7",
+    "prettier": "^2.0.5",
+    "semver": "^7.3.2",
+    "socket.io-client": "^3.0.3",
+    "typescript": "^3.9.6",
+    "upath": "^1.2.0",
+    "update-notifier": "^4.1.0",
+    "utility-types": "^3.10.0",
+    "uuid": "^8.3.1",
+    "winston": "^3.3.3",
+    "wrap-ansi": "^7.0.0",
+    "yargs": "^15.4.1"
+  }
+}

package/src/__mocks__/api.ts

@@ -0,0 +1,394 @@
+import { ProjectSyncMetadataModel } from "@plasmicapp/code-merger";
+import L from "lodash";
+import {
+  ChecksumBundle,
+  ComponentBundle,
+  ProjectBundle,
+  ProjectIconsResponse,
+  ProjectIdAndToken,
+  ProjectMetaBundle,
+  ProjectVersionMeta,
+  RequiredPackages,
+  StyleConfigResponse,
+  StyleTokensMap,
+  VersionResolution,
+} from "../api";
+import { AuthConfig } from "../utils/config-utils";
+import { ensure } from "../utils/lang-utils";
+import * as semver from "../utils/semver";
+
+const api: any = jest.genMockFromModule("../api");
+
+/**
+ * Store a simplified data model for use with testing
+ */
+// Keyed by (projectId, version)
+const PROJECTS: MockProject[] = [];
+export interface MockProject {
+  projectId: string;
+  projectApiToken: string;
+  version: string;
+  projectName: string;
+  components: MockComponent[];
+  dependencies: {
+    [projectId: string]: string;
+  };
+}
+export interface MockComponent {
+  id: string;
+  name: string;
+  projectId?: string;
+  version?: string;
+}
+
+function clear() {
+  while (PROJECTS.length > 0) {
+    PROJECTS.shift();
+  }
+}
+
+function mockProjectToProjectVersionMeta(
+  mock: MockProject,
+  componentIdOrNames?: readonly string[]
+): ProjectVersionMeta {
+  return {
+    ...mock,
+    componentIds: mock.components
+      .filter(
+        (c) =>
+          !componentIdOrNames ||
+          componentIdOrNames.includes(c.name) ||
+          componentIdOrNames.includes(c.id)
+      )
+      .map((c) => c.id),
+  };
+}
+
+/**
+ * Call this in test to setup the data model
+ * @param id componentId
+ * @param comp MockComponent
+ */
+function addMockProject(proj: MockProject) {
+  const projectId = proj.projectId;
+  const version = proj.version;
+  // Populate projectId and version into each component
+  // will be useful when reading / writing components to files
+  proj.components = proj.components.map((c) => {
+    return {
+      ...c,
+      projectId,
+      version,
+    };
+  });
+
+  const existing = getMockProject(projectId, version);
+  if (!existing) {
+    PROJECTS.push(proj);
+  } else {
+    existing.components = proj.components;
+    existing.dependencies = proj.dependencies;
+  }
+}
+
+/**
+ * Used to interpret data that's stored in the "codegen" files from the Mock server
+ * @param data
+ */
+function stringToMockComponent(data?: string): MockComponent | undefined {
+  if (!data) {
+    return;
+  }
+  const withoutComments = data.startsWith("//") ? data.slice(2) : data;
+  const cleaned = withoutComments.trim();
+  return JSON.parse(cleaned);
+}
+
+/**
+ * Used to write mock data into files for testing.
+ * Useful to see what version was written
+ * Need to prefix with a comment to satisfy the parser used in `fixAllImports`
+ * @param component
+ */
+function mockComponentToString(component: MockComponent): string {
+  return "// " + JSON.stringify(component);
+}
+
+function getMockProject(
+  projectId: string,
+  version: string
+): MockProject | undefined {
+  return PROJECTS.find(
+    (m) => m.projectId === projectId && m.version === version
+  );
+}
+
+/**
+ * Only fetch top-level components that match the projectId (optionally also componentIdOrNames + version)
+ * Does not crawl the dependency tree
+ * @param projectId
+ * @param componentIdOrNames
+ * @param versionRange
+ */
+function getMockComponents(
+  projectId: string,
+  version: string,
+  componentIdOrNames: readonly string[] | undefined
+): MockComponent[] {
+  const project = getMockProject(projectId, version);
+  return !project
+    ? []
+    : project.components.filter(
+        (c) =>
+          !componentIdOrNames ||
+          componentIdOrNames.includes(c.id) ||
+          componentIdOrNames.includes(c.name)
+      );
+}
+
+function genFilename(base: string, suffix: string) {
+  return "Plasmic" + base + "." + suffix;
+}
+
+function genComponentBundle(component: MockComponent): ComponentBundle {
+  return {
+    renderModule: mockComponentToString(component),
+    skeletonModule: mockComponentToString(component),
+    cssRules: `theClass {color: blue;}`,
+    renderModuleFileName: genFilename(component.name, "tsx"),
+    skeletonModuleFileName: component.name + ".tsx",
+    cssFileName: genFilename(component.name, "css"),
+    componentName: component.name,
+    id: component.id,
+    scheme: "blackbox",
+    nameInIdToUuid: [],
+    isPage: false,
+  };
+}
+
+function genEmptyStyleTokensMap() {
+  return {
+    props: [],
+    global: {
+      meta: {
+        source: "plasmic.app" as "plasmic.app",
+      },
+    },
+  };
+}
+
+function genProjectMetaBundle(projectId: string): ProjectMetaBundle {
+  return {
+    projectId,
+    projectName: projectId,
+    cssFileName: genFilename(projectId, "css"),
+    cssRules: `theClass {color: green;}`,
+    jsBundleThemes: [],
+  };
+}
+
+function* getDeps(projects: ProjectVersionMeta[]) {
+  const queue: ProjectVersionMeta[] = [...projects];
+  while (queue.length > 0) {
+    const curr = ensure(queue.shift());
+    for (const [projectId, version] of L.toPairs(curr.dependencies)) {
+      const mockProject = ensure(getMockProject(projectId, version));
+      const projectMeta = mockProjectToProjectVersionMeta(mockProject);
+      yield projectMeta;
+      queue.push(projectMeta);
+    }
+  }
+}
+
+class PlasmicApi {
+  constructor(private auth: AuthConfig) {}
+
+  async genStyleConfig(): Promise<StyleConfigResponse> {
+    const result = {
+      defaultStyleCssFileName: genFilename("default", "css"),
+      defaultStyleCssRules: `theClass {color: red;}`,
+    };
+    return result;
+  }
+
+  async resolveSync(
+    projects: {
+      projectId: string;
+      versionRange: string;
+      componentIdOrNames: readonly string[] | undefined;
+      projectApiToken?: string;
+    }[],
+    recursive?: boolean
+  ): Promise<VersionResolution> {
+    const results: VersionResolution = {
+      projects: [],
+      dependencies: [],
+      conflicts: [],
+    };
+
+    // Get top level projects
+    projects.forEach((proj) => {
+      const availableProjects = Array.from(PROJECTS.values()).filter(
+        (p) => p.projectId === proj.projectId
+      );
+      if (
+        !(
+          (this.auth.user && this.auth.token) ||
+          availableProjects.every(
+            (p) => p.projectApiToken === proj.projectApiToken
+          )
+        )
+      ) {
+        throw new Error("No user+token, and project API tokens don't match");
+      }
+      const availableVersions = availableProjects.map((p) => p.version);
+      const version = semver.maxSatisfying(
+        availableVersions,
+        proj.versionRange
+      );
+      if (version) {
+        const mockProject = ensure(getMockProject(proj.projectId, version));
+        const projectMeta = mockProjectToProjectVersionMeta(
+          mockProject,
+          proj.componentIdOrNames
+        );
+        results.projects.push(projectMeta);
+      }
+    });
+
+    // Get dependencies
+    if (!!recursive) {
+      const deps = [...getDeps(results.projects)];
+      results.dependencies.push(...deps);
+    }
+
+    return results;
+  }
+
+  async getCurrentUser() {
+    return true;
+  }
+
+  async projectComponents(
+    projectId: string,
+    opts: {
+      platform: string;
+      newCompScheme: "blackbox" | "direct";
+      // The list of existing components as [componentUuid, codeScheme]
+      existingCompScheme: Array<[string, "blackbox" | "direct"]>;
+      componentIdOrNames: readonly string[] | undefined;
+      version: string;
+    }
+  ): Promise<ProjectBundle> {
+    const { componentIdOrNames, version } = opts;
+    if (PROJECTS.length <= 0) {
+      throw new Error("Remember to call __addMockProject first!");
+    }
+    const maybeTokenPair = this.lastProjectIdsAndTokens.find(
+      (pair) => pair.projectId === projectId
+    );
+    const project = ensure(PROJECTS.find((p) => p.projectId === projectId));
+    if (
+      !(
+        (this.auth.user && this.auth.token) ||
+        project.projectApiToken === maybeTokenPair?.projectApiToken
+      )
+    ) {
+      throw new Error("No user+token and project API tokens don't match");
+    }
+    // Server also require tokens for the dependencies.
+    const deps = [...getDeps([mockProjectToProjectVersionMeta(project)])];
+    if (
+      !deps.every((dep) =>
+        this.lastProjectIdsAndTokens.find((p) => p.projectId === dep.projectId)
+      )
+    ) {
+      throw new Error(
+        "No user+token and project API tokens don't match on a dependency"
+      );
+    }
+    const mockComponents = getMockComponents(
+      projectId,
+      version,
+      componentIdOrNames
+    );
+    if (mockComponents.length <= 0) {
+      throw new Error(
+        `Code gen failed: no components match the parameters ${JSON.stringify(
+          { projectId, version, componentIdOrNames },
+          undefined,
+          2
+        )}`
+      );
+    }
+
+    const components = mockComponents.map((c) => genComponentBundle(c));
+    const result = {
+      components,
+      codeComponentMetas: [],
+      projectConfig: genProjectMetaBundle(projectId),
+      globalVariants: [],
+      usedTokens: genEmptyStyleTokensMap(),
+      iconAssets: [],
+      imageAssets: [],
+      checksums: {
+        renderModuleChecksums: components.map((c) => [c.id, c.renderModule]),
+        cssRulesChecksums: components.map((c) => [c.id, c.cssRules]),
+        imageChecksums: [],
+        iconChecksums: [],
+        globalVariantChecksums: [],
+        projectCssChecksum: "",
+      } as ChecksumBundle,
+    };
+    return result;
+  }
+
+  async uploadBundle(
+    projectId: string,
+    bundleName: string,
+    bundleJs: string,
+    css: string[],
+    metaJson: string
+  ): Promise<StyleTokensMap> {
+    throw new Error("Unimplemented");
+  }
+
+  async projectStyleTokens(projectId: string): Promise<StyleTokensMap> {
+    throw new Error("Unimplemented");
+  }
+
+  async projectIcons(projectId: string): Promise<ProjectIconsResponse> {
+    throw new Error("Unimplemented");
+  }
+
+  async projectSyncMetadata(
+    projectId: string,
+    revision: number,
+    rethrowAppError: boolean
+  ): Promise<ProjectSyncMetadataModel> {
+    throw new Error("Unimplemented");
+  }
+
+  async requiredPackages(): Promise<RequiredPackages> {
+    return {
+      "@plasmicapp/loader": "0.0.1",
+      "@plasmicapp/cli": "0.0.1",
+      "@plasmicapp/react-web": "0.0.1",
+      "@plasmicapp/react-web-runtime": "0.0.1",
+    };
+  }
+
+  connectSocket() {}
+
+  lastProjectIdsAndTokens: ProjectIdAndToken[] = [];
+  attachProjectIdsAndTokens(idsAndTokens: ProjectIdAndToken[]) {
+    this.lastProjectIdsAndTokens = idsAndTokens;
+  }
+}
+
+api.PlasmicApi = PlasmicApi;
+api.clear = clear;
+api.getMockProject = getMockProject;
+api.addMockProject = addMockProject;
+api.stringToMockComponent = stringToMockComponent;
+module.exports = api;