@plasmicapp/cli 0.1.162

package/src/test-common/fixtures.ts

@@ -0,0 +1,178 @@
+import L from "lodash";
+import { SyncArgs } from "../actions/sync";
+import { PlasmicConfig, ProjectConfig } from "../utils/config-utils";
+import { TempRepo } from "../utils/test-utils";
+import { MockProject } from "../__mocks__/api";
+
+jest.mock("../api");
+
+export const mockApi = require("../api");
+export let opts: SyncArgs; // Options to pass to sync
+export let tmpRepo: TempRepo;
+
+export const defaultPlasmicJson: PlasmicConfig = {
+  platform: "react",
+  code: {
+    lang: "ts",
+    scheme: "blackbox",
+    reactRuntime: "classic",
+  },
+  style: {
+    scheme: "css",
+    defaultStyleCssFilePath: "plasmic/PP__plasmic__default_style.css",
+  },
+  images: {
+    scheme: "inlined",
+  },
+  tokens: {
+    scheme: "theo",
+    tokensFilePath: "plasmic-tokens.theo.json",
+  },
+  srcDir: "src/",
+  defaultPlasmicDir: "./plasmic",
+  projects: [],
+  globalVariants: {
+    variantGroups: [],
+  },
+  cliVersion: "0.1.44",
+};
+export function standardTestSetup(includeDep = true) {
+  process.env.PLASMIC_DISABLE_AUTH_SEARCH = "1";
+
+  // Setup server-side mock data
+  const project1: MockProject = {
+    projectId: "projectId1",
+    projectApiToken: "abc",
+    version: "1.2.3",
+    projectName: "project1",
+    components: [
+      {
+        id: "buttonId",
+        name: "Button",
+      },
+      {
+        id: "containerId",
+        name: "Container",
+      },
+    ],
+    dependencies: includeDep
+      ? {
+          dependencyId1: "2.3.4",
+        }
+      : {},
+  };
+  const dependency: MockProject = {
+    projectId: "dependencyId1",
+    projectApiToken: "def",
+    version: "2.3.4",
+    projectName: "dependency1",
+    components: [
+      {
+        id: "depComponentId",
+        name: "DepComponent",
+      },
+    ],
+    dependencies: {},
+  };
+  [project1, dependency].forEach((p) => mockApi.addMockProject(p));
+
+  // Setup client-side directory
+  tmpRepo = new TempRepo();
+  tmpRepo.writePlasmicAuth({
+    host: "http://localhost:3003",
+    user: "yang@plasmic.app",
+    token: "faketoken",
+  });
+  tmpRepo.writePlasmicJson(defaultPlasmicJson);
+
+  // Default opts and config
+  opts = {
+    projects: [],
+    yes: true,
+    force: true,
+    nonRecursive: false,
+    skipUpgradeCheck: true,
+    forceOverwrite: true,
+    newComponentScheme: "blackbox",
+    appendJsxOnMissingBase: false,
+    config: tmpRepo.plasmicJsonPath(),
+    auth: tmpRepo.plasmicAuthPath(),
+    loaderConfig: tmpRepo.plasmicLoaderJsonPath(),
+    baseDir: process.cwd(),
+  };
+}
+
+export function standardTestTeardown() {
+  tmpRepo.destroy();
+  mockApi.clear();
+  delete process.env["PLASMIC_DISABLE_AUTH_SEARCH"];
+}
+
+export function expectProject1Components() {
+  // Check correct files exist
+  const button = mockApi.stringToMockComponent(
+    tmpRepo.getComponentFileContents("projectId1", "buttonId")
+  );
+  const container = mockApi.stringToMockComponent(
+    tmpRepo.getComponentFileContents("projectId1", "containerId")
+  );
+  expect(button).toBeTruthy();
+  expect(container).toBeTruthy();
+  expect(button?.name).toEqual("Button");
+  expect(button?.version).toEqual("1.2.3");
+  expect(container?.name).toEqual("Container");
+  expect(container?.version).toEqual("1.2.3");
+}
+
+export const project1Config: ProjectConfig = {
+  projectId: "projectId1",
+  projectName: "Project 1",
+  version: "latest",
+  cssFilePath: "plasmic/PP__demo.css",
+  components: [
+    {
+      id: "buttonId",
+      name: "Button",
+      type: "managed",
+      projectId: "projectId1",
+      renderModuleFilePath: "plasmic/project_id_1/PlasmicButton.tsx",
+      importSpec: {
+        modulePath: "Button.tsx",
+      },
+      cssFilePath: "plasmic/PlasmicButton.css",
+      scheme: "blackbox",
+      componentType: "component",
+    },
+  ],
+  icons: [],
+  images: [],
+  jsBundleThemes: [],
+};
+
+export function expectProject1PlasmicJson() {
+  const plasmicJson = tmpRepo.readPlasmicJson();
+  expect(plasmicJson.projects.length).toEqual(1);
+  const projectConfig = plasmicJson.projects[0];
+  expect(projectConfig.projectApiToken).toBe("abc");
+  expect(projectConfig.components.length).toEqual(2);
+  const componentNames = projectConfig.components.map((c) => c.name);
+  expect(componentNames).toContain("Button");
+  expect(componentNames).toContain("Container");
+}
+
+export function expectProjectAndDepPlasmicJson() {
+  const plasmicJson = tmpRepo.readPlasmicJson();
+  expect(plasmicJson.projects.length).toEqual(2);
+  const projectConfigMap = L.keyBy(plasmicJson.projects, (p) => p.projectId);
+  expect(projectConfigMap["projectId1"]).toBeTruthy();
+  expect(projectConfigMap["dependencyId1"]).toBeTruthy();
+  const projectComponentNames = projectConfigMap["projectId1"].components.map(
+    (c) => c.name
+  );
+  const depComponentNames = projectConfigMap["dependencyId1"].components.map(
+    (c) => c.name
+  );
+  expect(projectComponentNames).toContain("Button");
+  expect(projectComponentNames).toContain("Container");
+  expect(depComponentNames).toContain("DepComponent");
+}

package/src/utils/auth-utils.ts

@@ -0,0 +1,276 @@
+import fs from "fs";
+import inquirer from "inquirer";
+import open from "open";
+import os from "os";
+import socketio from "socket.io-client";
+import path from "upath";
+import { v4 as uuidv4 } from "uuid";
+import { PlasmicApi } from "../api";
+import { logger } from "../deps";
+import { CommonArgs } from "../index";
+import { HandledError } from "../utils/error";
+import {
+  AuthConfig,
+  AUTH_FILE_NAME,
+  DEFAULT_HOST,
+  ENV_AUTH_HOST,
+  ENV_AUTH_TOKEN,
+  ENV_AUTH_USER,
+} from "./config-utils";
+import {
+  existsBuffered,
+  findFile,
+  readFileText,
+  writeFileContentRaw,
+} from "./file-utils";
+
+export type AuthData = {
+  user: string;
+  token: string;
+};
+
+export type CancellablePromise<T> = {
+  promise: Promise<T>;
+  cancel: () => void;
+};
+
+export function authByPolling(
+  host: string,
+  initToken: string
+): CancellablePromise<AuthData> {
+  const socket = socketio.connect(host, {
+    path: `/api/v1/init-token`,
+    transportOptions: {
+      polling: {
+        extraHeaders: {
+          "x-plasmic-init-token": initToken,
+        },
+      },
+    },
+  });
+
+  const promise = new Promise<AuthData>((resolve, reject) => {
+    socket.on("connect", (reason: string) => {
+      logger.info("Waiting for token...");
+    });
+
+    socket.on("token", (data: AuthData) => {
+      resolve(data);
+      socket.close();
+    });
+
+    socket.on("error", (error: {}) => {
+      logger.warn(error);
+      reject(error);
+    });
+  });
+
+  const cancel = () => {
+    socket.close();
+  };
+
+  return { promise, cancel };
+}
+
+function authByPrompt(host: string) {
+  const promise = inquirer.prompt([
+    {
+      name: "user",
+      message: "Your Plasmic user email",
+    },
+    {
+      name: "token",
+      message: `Your personal access token (create one at ${host}/self/settings)`,
+    },
+  ]);
+
+  const cancel = () => {
+    logger.info("Cancelling prompt...");
+    process.stdin.pause();
+  };
+
+  return { promise, cancel };
+}
+
+export async function startAuth(opts: Partial<CommonArgs> & { host: string }) {
+  if (opts.yes) {
+    throw new HandledError("Plasmic credentials could not be found.");
+  }
+
+  const auth = await new Promise<AuthData>((resolve, reject) => {
+    let prompt: CancellablePromise<AuthData>;
+
+    const initToken = uuidv4();
+    const url = `${opts.host}/auth/plasmic-init/${initToken}`;
+    open(url);
+    logger.info(
+      `\nIf your browser doesn't automatically open, enter the following URL:\n${url}\n`
+    );
+
+    logger.info(`Please log in and authorize Plasmic CLI.`);
+    const polling = authByPolling(opts.host, initToken);
+    polling.promise.then((auth) => {
+      if (prompt) {
+        prompt.cancel();
+      } else {
+        clearTimeout(timeout);
+      }
+      resolve(auth);
+    });
+
+    // Default to 1 minute.
+    const authPollTimeout =
+      Number(process.env.PLASMIC_AUTH_POLL_TIMEOUT) || 60 * 1000;
+    if (authPollTimeout === -1) {
+      return;
+    }
+    const timeout = setTimeout(() => {
+      logger.info(`We haven't received an auth token from Plasmic yet.`);
+      prompt = authByPrompt(opts.host);
+      prompt.promise
+        .then((auth) => {
+          polling.cancel();
+          resolve(auth);
+        })
+        .catch(reject);
+    }, authPollTimeout);
+  });
+
+  if (!auth.user || !auth.token) {
+    logger.error(`Could not get auth token.`);
+    return;
+  }
+
+  const newAuthFile = opts.auth || path.join(os.homedir(), AUTH_FILE_NAME);
+
+  await writeAuth(newAuthFile, {
+    host: opts.host,
+    user: auth.user,
+    token: auth.token,
+  });
+
+  logger.info(
+    `Successfully created Plasmic credentials file at ${newAuthFile}`
+  );
+}
+
+export function readAuth(authFile: string) {
+  if (!existsBuffered(authFile)) {
+    throw new HandledError(`No Plasmic auth file found at ${authFile}`);
+  }
+  try {
+    const parsed = JSON.parse(readFileText(authFile)) as AuthConfig;
+    // Strip trailing slashes.
+    return {
+      ...parsed,
+      host: parsed.host.replace(/\/+$/, ""),
+    };
+  } catch (e) {
+    logger.error(
+      `Error encountered reading plasmic credentials at ${authFile}: ${e}`
+    );
+    throw e;
+  }
+}
+
+export function getEnvAuth(): AuthConfig | undefined {
+  const host = process.env[ENV_AUTH_HOST];
+  const user = process.env[ENV_AUTH_USER];
+  const token = process.env[ENV_AUTH_TOKEN];
+
+  // both user and token are required
+  if (!user || !token) {
+    // Try to give a hint if they partially entered a credential
+    if (user || token) {
+      logger.warn(
+        `Your Plasmic credentials were only partially set via environment variables. Try both ${ENV_AUTH_USER} and ${ENV_AUTH_TOKEN}`
+      );
+    }
+    return;
+  }
+
+  return {
+    host: host ?? DEFAULT_HOST,
+    user,
+    token,
+  };
+}
+
+function readCurrentAuth(authPath?: string) {
+  const authFromEnv = getEnvAuth();
+  if (authFromEnv) return authFromEnv;
+
+  if (!authPath && !process.env.PLASMIC_DISABLE_AUTH_SEARCH) {
+    authPath = findAuthFile(process.cwd(), { traverseParents: true });
+  }
+  if (!authPath) {
+    return undefined;
+  }
+  return readAuth(authPath);
+}
+
+export async function getCurrentAuth(authPath?: string) {
+  const auth = readCurrentAuth(authPath);
+  if (!auth) {
+    return undefined;
+  }
+  const api = new PlasmicApi(auth);
+  try {
+    await api.getCurrentUser();
+    return auth;
+  } catch (e) {
+    if (e.response?.status === 401) {
+      logger.error(`The current credentials expired or are not valid.`);
+      return undefined;
+    }
+    throw e;
+  }
+}
+
+function failAuth() {
+  throw new HandledError(
+    `Unable to authenticate Plasmic. Please run 'plasmic auth'.`
+  );
+}
+
+export async function getOrStartAuth(
+  opts: CommonArgs & { host: string; enableSkipAuth?: boolean }
+) {
+  let auth = await getCurrentAuth(opts.auth);
+  if (!auth && opts.enableSkipAuth) {
+    return;
+  }
+  if (!auth && opts.yes) {
+    failAuth();
+  }
+  if (!auth) {
+    await startAuth(opts);
+    auth = await getCurrentAuth(opts.auth);
+  }
+  if (!auth) {
+    failAuth();
+  }
+  return auth;
+}
+
+export function findAuthFile(
+  dir: string,
+  opts: {
+    traverseParents?: boolean;
+  }
+) {
+  let file = findFile(dir, (f) => f === AUTH_FILE_NAME, opts);
+  if (!file) {
+    file = findFile(os.homedir(), (f) => f === AUTH_FILE_NAME, {
+      traverseParents: false,
+    });
+  }
+  return file;
+}
+
+export async function writeAuth(authFile: string, config: AuthConfig) {
+  await writeFileContentRaw(authFile, JSON.stringify(config, undefined, 2), {
+    force: true,
+  });
+  fs.chmodSync(authFile, "600");
+}

package/src/utils/checksum.ts

@@ -0,0 +1,106 @@
+import { SyncArgs } from "../actions/sync";
+import { ChecksumBundle } from "../api";
+import { PlasmicContext } from "./config-utils";
+import { assert } from "./lang-utils";
+
+export function getChecksums(
+  context: PlasmicContext,
+  opts: SyncArgs,
+  projectId: string,
+  componentIds: string[]
+): ChecksumBundle {
+  const projectConfig = context.config.projects.find(
+    (p) => p.projectId === projectId
+  );
+
+  const projectLock = context.lock.projects.find(
+    (projectLock) => projectLock.projectId === projectId
+  );
+
+  if (!projectConfig || !projectLock || opts.allFiles) {
+    return {
+      imageChecksums: [],
+      iconChecksums: [],
+      renderModuleChecksums: [],
+      cssRulesChecksums: [],
+      globalVariantChecksums: [],
+      projectCssChecksum: "",
+    };
+  }
+
+  const fileLocks = projectLock.fileLocks;
+
+  const knownImages = new Set(projectConfig.images.map((i) => i.id));
+  const knownIcons = new Set(projectConfig.icons.map((i) => i.id));
+  const knownComponents = new Set(projectConfig.components.map((c) => c.id));
+  const knownGlobalVariants = new Set(
+    context.config.globalVariants.variantGroups
+      .filter((vg) => vg.projectId === projectId)
+      .map((vg) => vg.id)
+  );
+  const knownThemes = new Set(
+    (projectConfig.jsBundleThemes || []).map((theme) => theme.bundleName)
+  );
+
+  const toBeSyncedComponents = new Set(componentIds);
+
+  const imageChecksums = fileLocks
+    .filter(
+      (fileLock) =>
+        fileLock.type === "image" && knownImages.has(fileLock.assetId)
+    )
+    .map((fileLock): [string, string] => [fileLock.assetId, fileLock.checksum]);
+
+  const iconChecksums = fileLocks
+    .filter(
+      (fileLock) =>
+        projectLock.lang === context.config.code.lang &&
+        fileLock.type === "icon" &&
+        knownIcons.has(fileLock.assetId)
+    )
+    .map((fileLock): [string, string] => [fileLock.assetId, fileLock.checksum]);
+
+  const renderModuleChecksums = fileLocks
+    .filter(
+      (fileLock) =>
+        projectLock.lang === context.config.code.lang &&
+        fileLock.type === "renderModule" &&
+        toBeSyncedComponents.has(fileLock.assetId) &&
+        knownComponents.has(fileLock.assetId)
+    )
+    .map((fileLock): [string, string] => [fileLock.assetId, fileLock.checksum]);
+
+  const cssRulesChecksums = fileLocks
+    .filter(
+      (fileLock) =>
+        fileLock.type === "cssRules" &&
+        toBeSyncedComponents.has(fileLock.assetId) &&
+        knownComponents.has(fileLock.assetId)
+    )
+    .map((fileLock): [string, string] => [fileLock.assetId, fileLock.checksum]);
+
+  const globalVariantChecksums = fileLocks
+    .filter(
+      (fileLock) =>
+        projectLock.lang === context.config.code.lang &&
+        fileLock.type === "globalVariant" &&
+        knownGlobalVariants.has(fileLock.assetId)
+    )
+    .map((fileLock): [string, string] => [fileLock.assetId, fileLock.checksum]);
+
+  const projectCssChecksums = fileLocks.filter(
+    (fileLock) => fileLock.type === "projectCss"
+  );
+  assert(projectCssChecksums.length < 2);
+  const projectCssChecksum =
+    projectCssChecksums.length > 0 ? projectCssChecksums[0].checksum : "";
+
+  return {
+    imageChecksums,
+    iconChecksums,
+    renderModuleChecksums,
+    cssRulesChecksums,
+    globalVariantChecksums,
+    projectCssChecksum,
+  };
+}